Android ImageView scaleType

拼搏现实的明天。 2022-11-15 03:42 210阅读 0赞

#### 一、类型 ####

ImageView有一个属性叫做scaleType，它的取值一共有八种，分别是：matrix，fitXY，fitStart，fitCenter，fitEnd，center，centerCrop，centerInside

#### 一、matrix ####

matrix表示原图从ImageView的左上角开始绘制，如果原图大于ImageView，那么多余的部分则剪裁掉，如果原图小于ImageView，那么对原图不做任何处理。比如我的两张大小不同的图片，分别显示在96dp×96dp的ImageView上，会有不同的效果，代码如下：

![在这里插入图片描述][20210330195232391.png]  
我们看到，big图片由于比较大，因此只有左上角显示出来了，其他部分则被剪裁掉了，而small图片由于分辨率比较小，因此完整的显示在ImageView的左上角。

#### 二、fitXY ####

fitXY的目标是填充整个ImageView，为了完成这个目标，它需要对图片进行一些缩放操作，在缩放的过程中，它不会按照原图的比例来缩放。比如下面一个例子：

![在这里插入图片描述][2021033019533636.png]  
两张图片都被显示出来了，但是都有一定程度的变形，因为在这里系统只考虑将ImageView填充满，而不会按照原图比例去缩放。

#### 三、fitStart ####

将图片按比例缩放至View的宽度或者高度（取宽和高的最小值），然后居上或者居左显示（与前面缩放至宽还是高有关），我们来看下面一个例子：

![在这里插入图片描述][20210330195430495.png]  
big图片是缩放至ImageView的宽度，然后居上显示，small图片是缩放至ImageView的高度，然后居左显示。

#### 四、fitCenter ####

fitCenter和fitStart基本一样，唯一不同的是fitCenter将图片按比例缩放之后是居中显示，看下面一个例子：

![在这里插入图片描述][20210330195525785.png]

#### 五、fitEnd ####

fitEnd和fitStart也基本一样，唯一不同的是fitEnd将图片按比例缩放之后是居右或者居下显示，比如下面一个Demo：

![在这里插入图片描述][20210330195623450.png]

#### 六、center ####

center表示将原图按照原来的大小居中显示，如果原图的大小超过了ImageView的大小，那么剪裁掉多余部分，只显示中间一部分图像，比如下面一个Demo：

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjYwMDM5OA_size_16_color_FFFFFF_t_70]

#### 七、centerCrop ####

centerCrop的目标是将ImageView填充满，故按比例缩放原图，使得可以将ImageView填充满，同时将多余的宽或者高剪裁掉,比如下面一个Demo :

![在这里插入图片描述][20210330195744242.png]

#### 八、centerInsid ####

centerInside的目标是将原图完整的显示出来，故按比例缩放原图，使得ImageView可以将原图完整显示，比如下面一个Demo：

![在这里插入图片描述][20210330195827608.png]

[20210330195232391.png]: /images/20221022/5eb5a505b4244a2481bac025b52a609f.png
[2021033019533636.png]: https://img-blog.csdnimg.cn/2021033019533636.png
[20210330195430495.png]: https://img-blog.csdnimg.cn/20210330195430495.png
[20210330195525785.png]: https://img-blog.csdnimg.cn/20210330195525785.png
[20210330195623450.png]: https://img-blog.csdnimg.cn/20210330195623450.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjYwMDM5OA_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20210330195707417.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjYwMDM5OA==,size_16,color_FFFFFF,t_70
[20210330195744242.png]: https://img-blog.csdnimg.cn/20210330195744242.png
[20210330195827608.png]: https://img-blog.csdnimg.cn/20210330195827608.png