The picture display layout of Wechat's moments.

! [clipboard.
clipboard.png
e4Ie)

clipboard.png

similar to the figure above. Multiple pictures show that I can control the width and height of its display. If it is a picture, I do not set its width and height, it will cover my screen, set the width and height, and because the length and width of each picture is different, the picture will stretch or squeeze

so how should this picture be laid out when I develop Mini Program


Hello, Mini Program has a picture component image
if you take a closer look at its API, there will be a mode attribute. First of all, aspectFit , you judge whether the picture height under this mode will exceed your predetermined critical value (you should set a height max-height), if so, Just use the value of aspectFill (keep the aspect ratio to scale the picture so that only the short edges of the picture are fully displayed. In other words, the picture is usually complete only in the horizontal or vertical direction, and the other direction will be intercepted.)


what about the percentage of width and height?


Boss, how can this layout be realized?

Menu