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屬性後
可以看到控件的背景變為我們設定的背景色,控件内容可見。(背景不要設定和字型一樣顔色哈)
(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時
<ImageView
android:background="@drawable/link"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
發現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(後部/尾部/底部)
控件寬高哪個大時哪邊有空白留出