收藏
回答

scroll-view如何做到和swiper一样自动滚动且可以衔接滑动?

scroll-view组件要怎么自动滚动,滚动到最后一个时需要和swiper一样衔接滑动,要求滚动时不能卡顿,可以用手势控制滑动,就像scroll-view一样,自动滚动时,动画时长不能太快

最后一次编辑于  2023-03-31
回答关注问题邀请回答
收藏

8 个回答

  • 远方
    远方
    01-03

    楼主问题解决了吗

    01-03
    有用
    回复 1
    • new world
      new world
      06-05
      同问楼主
      06-05
      回复
  • 小川
    小川
    2023-08-27

     <swiper class="nianbaolist" autoplay circular vertical easing-function="linear" interval="1000" duration="1000" display-multiple-items="10">

        <block>

        <swiper-item>

          <text>1111111111111111111111111111</text>

        </swiper-item>

            <swiper-item>

          <view>1111111111111111111111111111</view>

        </swiper-item>

            <swiper-item>

          <text>1111111111111111111111111111</text>

        </swiper-item>

            <swiper-item>

          <text>1111111111111111111111111111</text>

        </swiper-item>

                <swiper-item>

          <text>1111111111111111111111111111</text>

        </swiper-item>

                <swiper-item>

          <text>1111111111111111111111111111</text>

        </swiper-item>

                <swiper-item>

          <text>1111111111111111111111111111</text>

        </swiper-item>

                <swiper-item>

          <text>1111111111111111111111111111</text>

        </swiper-item>

                <swiper-item>

          <text>1111111111111111111111111111</text>

        </swiper-item>

                <swiper-item>

          <text>1111111111111111111111111111</text>

        </swiper-item>

                <swiper-item>

          <text>1111111111111111111111111111</text>

        </swiper-item>

       

        </block>

      </swiper>


    试试我这个,有一个重要属性是“同时显示几行” display-multiple-items

    2023-08-27
    有用
    回复
  • 松子
    松子
    2023-07-31
      <swiper autoplay circular easing-function="linear" interval="5000" duration="5000" display-multiple-items="1.8">
        <swiper-item wx:for="{{list}}" wx:key="index">
          <view>
            <text> {{ item.name}}</text>
            <text> {{ item.id}}</text>
          </view>
        </swiper-item>
      </swiper>
    
    2023-07-31
    有用
    回复 1
    • Cyrus
      Cyrus
      2023-08-03
      用swiper无法像scroll-view一样,滑动时停留在任意位置
      2023-08-03
      回复
  • Miyon
    Miyon
    2023-05-23

    有大佬解决的吗,需要用第三方插件吗?


    2023-05-23
    有用
    回复
  • 住银行
    住银行
    2023-05-17

    楼主俩月过去了,解决了吗,我也遇到这个工作需求了,服了这产品,跪求回复

    2023-05-17
    有用
    回复
  • PENG
    PENG
    2023-03-31

    很难完美实现,小程序里的监听滚动,不是按每帧去监听。可以试着按照swiper实现原理去配合scroll-view实现看看

    2023-03-31
    有用
    回复
  • showms
    showms
    2023-03-31

    问:为啥不直接用swiper

    2023-03-31
    有用
    回复 1
    • Cyrus
      Cyrus
      2023-03-31
      因为要实现和scroll-view一样,可以让用户随时手势滑动,并且滑动过程要和scroll-view一样,不是swiper这种类似翻页的效果,我也试过用swiper,把interval调到0,duration调到2000左右,但是还是没法达到想要的效果,用手势滑动时不流畅,并且这么调参数的话,swiper会莫名其妙的一卡一跳的,由于interval调成0了,bindchange事件会不断的调用,造成的性能问题也蛮大的
      2023-03-31
      回复
  • 启年
    启年
    2023-03-30

    写个定时器不断修改scrollTop的值

    2023-03-30
    有用
    回复 4
    • Cyrus
      Cyrus
      2023-03-31
      这个也试过,没达到想要的效果,而且这个应该也是要不断地setData才行吧,不能滚动太快,只能隔很短的时间去设置,而且目前还不清楚要怎么做衔接滑动,在list后面push数据嘛
      2023-03-31
      回复
    • 启年
      启年
      2023-03-31回复Cyrus
      衔接滑动,在list后面push数据嘛


      你指的是分页加载数据吧,到一定程度就去加载下一页的数据,追加到list后面,试试看效果。
      2023-03-31
      回复
    • Cyrus
      Cyrus
      2023-03-31
      不是噢,假设list里有5个item,我是要不断的循环滚动这5个item
      2023-03-31
      回复
    • 启年
      启年
      2023-03-31回复Cyrus
      你这需求及其适合swiper,努力调试swiper吧,别考虑scroll-view了。
      2023-03-31
      回复
登录 后发表内容