ImageView图片处理相关属性探讨

ImageView一个图片展示的控件，图片处理的属性也有不少，这里趁着空余自己简单的探讨下。

一、所有view共有的属性

探讨ImageView 的图片相关的属性之前先了解下所有view共有的几个属性吧。我们平时会使用到background这个属性其实除了background这个属性外，与其对应的还有foreground这个属性。

1、 背景前景和控件内容

• background （背景）
• foreground （前景）

所有控件都有背景、前景、还有控件内容（比如TextView的text）这三者，但是这三者有什么联系呢我们先看个栗子。
(1)如下我们搞了个简单的Textview (附预览图)

 <TextView
         android:gravity="center"
         android:textColor="#000"
         android:textSize="30sp"
         android:text="简单的测试"
         android:layout_width="match_parent"
         android:layout_height="match_parent" />

我们看到的内容就是TextView的内容

（2）添加background属性后

 android:background="@color/colorAccent"

可以看到控件的背景变为我们设定的背景色，控件内容可见。（背景不要设置和字体一样颜色哈）

（3）添加foreground后

 <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/colorAccent"
        android:foreground="@color/colorPrimaryDark"
        android:gravity="center"
        android:text="简单的测试"
        android:textColor="#000"
        android:textSize="30sp" />

我们只能看见前景色了

2、三者之间关系（如下图解）

二、图片控制

1、background属性探讨

背景和前景两个属性类似我们就以经常使用的background来探讨下。
background其实就代表控件背景，这个背景的显示和控件大小有关。而控件的大小又可以有三种值如下。

• wrap_content
• match_parent
• 具体的xxx dp

我们把图片设为background 之后进行相关操作:

(1)宽高都包括内容

<ImageView
    android:background="@drawable/link"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

我们发现这显示正式图片默认宽高。

（2）我们宽高都设置为和父控件宽高一致时

  <ImageView
    android:background="@drawable/link"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

发现宽高拉伸铺满屏幕

（3）其中一个为wrap 一个为match时

发现match的铺满相应空间

(4)固定尺寸时（100dp）

 <ImageView
    android:background="@drawable/link"
    android:layout_width="100dp"
    android:layout_height="100dp" />

发现按照相应尺寸变化

综上得出结论：
控件设置了background后（这里默认背景为图片了）图片的大小和控件大小有关。
ps:但是控件大小在开发中一般是确定的，所以我们想要控制图片使用background不可取

2、src属性探讨（为了方便观看我们设置了背景色）

还是那样，单一使用这个属性时还是由控件大小决定图片位置。

• wrap_content
• match_parent
• 具体的xxx dp

（1）都为wrap时

 <ImageView
        android:background="@color/colorAccent"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/link" />

显示原始大小

（2）都为match时（高>宽）

<ImageView
        android:background="@color/colorAccent"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/link" />

图片水平居中铺满，垂直居中上下留空间。
宽<高 先让宽铺满控件 竖直方向有空余

（3）宽match 高wrap（宽>高）

  <ImageView
        android:background="@color/colorAccent"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:src="@drawable/link" />

宽>高 水平有剩余空间

（4）控件大小设置具体的dp

按照宽高大小分情况即可（略）

综上得出结论：
1、控件设置wrap时显示图片的默认大小
2、当宽>高时图片按照控件的大小优先高先铺满 宽有剩余空间
3、当宽<高时图片按照控件的大小优先宽先铺满 高有剩余空间
也会是说小的按照控件优先铺满，大的有剩余控件
ps：还是那句话：但是控件大小在开发中一般是确定的单单使用src也是不可取

3、src+scaleType

真正的控制图片在控件中的位置是scaleType
scaleType的值如下：

• CENTER
• CENTER_INSIDE
• CENTER_CROP
• MATRIX
• FIT_XY
• FIT_START
• FIT_CENTER
• FIT_END

（1）CENTER

保持原图的大小，显示在ImageView控件的中心。
1、当原图的size大于ImageView的size时，多出来的部分被截掉。
2、当原图的size小于imageView的size时，imageView的剩余空间会留白。

（2）CENTER_INSIDE

以原图正常显示为目的
1、如果原图大小大于ImageView的size，就按照比例缩小原图的宽高，居中显示在ImageView中。
2、如果原图size小于ImageView的size，则不做处理。居中显示图片在控件中。

（3）CENTER_CROP

以原图填满ImageView为目的
1、如果原图size大于ImageView的size，则与center_inside一样，按比例缩小，居中显示在ImageView上。
2、如果原图size小于ImageView的size，则按比例拉升原图的宽和高，填充ImageView居中显示。

（4）MATRIX

不改变原图的大小。
1、当原图尺寸大于控件尺寸时。从ImageView的左上角开始绘制，超出部分做剪切处理。
2、当原图尺寸小于控件尺寸时。从左上方按照原图大小显示。

（5）FIT_XY

把图片按照控件大小在ImageView中显示，拉伸显示图片，不保持原比例，填满ImageView.

（6）FIT_START

把原图按照比例放大缩小到ImageView的高度，显示在ImageView的start（前部/上部）。
控件宽高哪个大时哪边有空白留出

（7）FIT_CENTER

把原图按照比例放大缩小到ImageView的高度，显示在ImageView的center（中部/居中显示）。
控件宽高哪个大时哪边有空白留出

（8）FIT_END

把原图按照比例放大缩小到ImageView的高度，显示在ImageVIew的end（后部/尾部/底部）
控件宽高哪个大时哪边有空白留出

end