收藏
回答

小程序载入网络图片拉伸闪烁

问题模块 框架类型 问题类型 API/组件名称 终端类型 操作系统 微信版本 基础库版本
API和组件 小程序 Bug image 客户端 6.6.7 2.2.3

小程序载入一个网络图片列表的时候,图片会先变大然后再变成设置的尺寸,给人感觉图片是跳出来的的。

image图片的mode设置的是widthFix,宽度是320rpx,高度没有设置。

是在做一个瀑布流展示图片列表的时候,发现的问题。

我知道小程序会给image默认设置宽高,但是这样的话载入的时候会先显示默认的宽高,然后再变成自定义的宽高,这样的话图片的拉伸变换过程会呈现给使用者,体验很不好。

不知道有什么方法能够避免这样的问题?

最后一次编辑于  2018-08-17  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏关注问题回答

9 个回答

  • Dreamer
    Dreamer
    2018-08-18

    先把图片高度定为0

    2018-08-18
    赞同
    回复
  • Jany、
    Jany、
    2018-08-31

    想知道你的瀑布流是用css3实现的还是用其他方法?

    2018-08-31
    赞同
    回复 6
    • 水滴
      水滴
      2018-08-31

      用js实现的,因为要按照后台给定的顺序横向排列,所以不能用CSS3实现。

      2018-08-31
      赞同
      回复
    • Jany、
      Jany、
      2018-08-31回复水滴

      可以麻烦你大概跟我讲解一下原理吗?我也是用的css3之后排序是纵向的。o(╥﹏╥)o

      2018-08-31
      赞同
      回复
    • 水滴
      水滴
      2018-08-31回复Jany、

      CSS3实现的话,是先计算整体高度,然后竖向排列,这样的话跟后台设置的顺序不符。一般是设置左右两栏和一个总栏,在隐藏的总栏里载入图片,然后图片的载入事件中判断左右两栏的高度,把新载入的图片push入短的那一栏。这样的话能够实现左右两栏横向排列。


      2018-08-31
      赞同
      回复
    • Jany、
      Jany、
      2018-08-31回复水滴

      就是要插入图片的时候先判断左右两栏的高度,然后再决定把图片塞哪边呀!明白了,谢谢哈

      2018-08-31
      赞同
      回复
    • 水滴
      水滴
      2018-08-31回复Jany、

      对的。

      2018-08-31
      赞同
      回复
    查看更多(1)
  • HC
    HC
    08-08

    最后有解决吗?

    08-08
    赞同
    回复