收藏
回答

在canvas画布上画一张超过屏幕宽度的图,在手机上安卓和IOS上表现不一致?

请教大神这是什么原因? 感谢

画一张图到画布上面,画布长宽和这张图片一致,这行图片宽度超过设备屏幕宽度

手机上看到一张不完整的图片

IOS效果:上下左右都可以滑动

安卓:只能上下滑动 左右不能滑动

问题是为什么IOS能左右滑动,安卓确不能左右滑动????

现在希望安卓也可以左右画到查看这个图片,不知道怎么改。

xml:

<canvas canvas-id="canvas" class='canvasviewup' style="width:{{shwotestCanvasW}}px;height:{{shwotestCanvasH}}px;border:1px solid red;postion:fixed" canvas-id="shwotestCanvas"></canvas>

js:

var that = this;

var w;

var h;


wx.getImageInfo({

src: '../../Images/cs2.jpg',

success: (ress) => {

console.log(ress.width, ress.height)

w = ress.width;

h = ress.height;

that.setData({

shwotestCanvasW: ress.width,

shwotestCanvasH: ress.height

})


let ctx = wx.createCanvasContext('shwotestCanvas')

//将图片src放到cancas内,宽高为图片大小

ctx.drawImage('../../Images/cs2.jpg', 0, 0, w, h)

ctx.draw()

}

最后一次编辑于  2020-06-02
回答关注问题邀请回答
收藏

5 个回答

  • 老虎猛
    老虎猛
    2020-07-13

    这个问题已经解决了 只要在画布外面加上<scroll-view scroll-x="false">即可

    2020-07-13
    有用
    回复
  • 黄乖巧
    黄乖巧
    2020-06-02

    小伙子,你比例没设置

    const canvas = e[0].node

        const width = e[0].width

        const height = e[0].height

        const ctx = canvas.getContext("2d")

        const dpr = wx.getSystemInfoSync().pixelRatio

        canvas.width = width*dpr

        canvas.height = height*dpr

        ctx.scale(dpr,dpr)


    2020-06-02
    有用
    回复
  • 清风
    清风
    2020-06-02

    canvas快高 与 图片宽高都需要设置的

    2020-06-02
    有用
    回复
  • Cjiang
    Cjiang
    2020-06-01

    你好,麻烦提供出现问题的具体机型、微信版本号、系统版本号,以及能复现问题的代码片段https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

    2020-06-01
    有用
    回复 1
  • TNT
    TNT
    2020-06-01

    来个代码片段看下:

    https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

    2020-06-01
    有用
    回复 7
    • 老虎猛
      老虎猛
      2020-06-02
      https://developers.weixin.qq.com/s/Mo11COmS7XhM 华为nova5pro 微信7.0.15 系统版本号:10.0.0.154
      2020-06-02
      回复
    • TNT
      TNT
      2020-06-02回复老虎猛
      https://developers.weixin.qq.com/s/eZ3ZjOmv7Xhh
      2020-06-02
      回复
    • 老虎猛
      老虎猛
      2020-06-02回复TNT
      你好,看到您的代码了图片缩小了,其实我是想知道为什么安卓手机上面显示一个超过屏幕宽的图不能横向活动,IOS是可以的
      2020-06-02
      回复
    • TNT
      TNT
      2020-06-03回复老虎猛
      你fixed定位问题。安卓和ios客户端实现有差异吧。
      2020-06-03
      回复
    • 老虎猛
      老虎猛
      2020-06-03回复TNT
      <canvas canvas-id="canvas" class='canvasviewup' style="width:{{shwotestCanvasW}}px;height:{{shwotestCanvasH}}px;border:1px solid red;postion:fixed" canvas-id="shwotestCanvas"></canvas>  您好,是指这段代码中的 postion:fixed 吗?我将其删除后安卓还是不能横向滑动
      2020-06-03
      回复
    查看更多(2)
登录 后发表内容
问题标签