Preparation
Set a box: width 200px, height 100px
mode takes scaleToFill
The original size of the image will not be maintained, and it will be stretched to fill the image box
mode take aspectFit
It will maintain the horizontal and vertical ratio of the original image, so that the long side of the image is fully displayed. The above image ensures that the numerical direction is fully displayed and the image ratio remains unchanged, so there is a blank space in the horizontal direction.
mode take aspectFill
It will maintain the proportion of the picture to ensure that the short side is displayed. The above picture ensures that the width is displayed completely, and the vertical direction is not displayed completely.
mode取widthFix
The width does not change, and the height changes automatically. We set the width to 200px. This size remains unchanged. Its height will change according to its horizontal and vertical ratios, so the height is raised
mode takes heightFix
The height remains unchanged, and the width changes automatically. We set the height to 100px. This size remains unchanged. Its width will change according to its horizontal and vertical ratios, so the width is smaller