公告列表
公告列表
收藏
回答

js canvas 自定义 scroll-view


新人求问：

   在小游戏模式下，需要实现类似小程序中的scroll-view组件，尤其是滚动功能的效果，请问有没有相关的方案？

最后一次编辑于  2018-05-11
回答关注问题邀请回答
收藏

1 个回答

  • addy
    addy
    2018-05-11

    可以参考下游戏引擎的UI组件实现，成熟的游戏引擎都有。实现原理：所有的图形都是绘制在canvas上，scroll-view容器只需要绘制部分区域，clip接口裁剪指定的区域，scroll利用touch事件来做。

    2018-05-11
    有用
    回复 4
    • Jedoreee
      Jedoreee
      2018-05-13
      thank you 这个原理我明白了， 我也是准备把所有的图形都绘在离屏canvas上，但是有一个问题：由于行数太多而使整个scrollview的高度超出了整个屏幕的高度，发现超出部分截取出来都是空白的，因为wx.createCanvas创建的canvas是固定为屏幕的宽高的。这个问题有什么好的方案么，还是哪里不对？
      2018-05-13
      赞
      回复
    • addy
      addy
      2018-05-14回复Jedoreee
      没有必要绘制到离屏canvas上，在一个canvas上都可以实现。clip裁剪的出的rect作为scrollview的可视区域，不就好了吗？假设scrollview的height为1000， clip裁剪为500，剩下的500都是不可见的。touch事件来设置transform就可以了。
      2018-05-14
      赞
      回复
    • Jedoreee
      Jedoreee
      2018-05-18回复addy
      OK，get 新方法，感谢
      2018-05-18
      赞
      回复
    • 万达
      万达
      2018-06-13回复Jedoreee

      离屏是什么

      2018-06-13
      赞
      回复
请 登录 后发表内容
相关问题
相关文档