Android UI系列-----ImageView的scaleType屬性

Android UI系列-----ImageView的scaleType屬性

這篇隨筆將會簡單的記錄下ImageView這個控件的一些使用方法，以及其最重要的一個屬性: scaleType

ImageView這個控件是用來顯示圖片用的，例如咱們能夠經過下面這段xml配置來聲明顯示一張圖片：

<ImageView        android:id="@+id/imageView"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/ic_launcher"/>

其中src就是引用咱們須要使用的圖片，其能夠是存放在 assets 目錄下的圖片，也能夠是res/drawable目錄下的圖片，還能夠是網絡上的圖片。咱們這裏是將圖片放在了 res/drawable這個目錄下，而後經過其自動生成的ID來引用這個圖片，咱們一樣能夠在Java代碼中經過ImageView這個對象來設置咱們要引用的圖片

　　　　 ImageView imageView = (ImageView)findViewById(R.id.iamgeView1);        //    經過setImageResource()來設置引用的圖片
        imageView.setImageResource(R.id.iamgeView1);

接下來咱們來看看ImageView中最重要的一個屬性：scaleType，這個屬性是用來控制咱們的圖片怎樣縮擴或者移動來匹配咱們和ImageView自己設置的大小。

其擁有許多的值，咱們接下來根據代碼來看看每一個值所表明的含義：

①fitCenter：這個值指的是，當我這張圖片比ImageView大的時候，就會按照比例對圖片進行縮放，並將圖片居中顯示。若是這張圖片比ImageView小，那麼就會根據比例對圖片進行擴大，而後將其居中顯示，注意：若是圖片分辨率不是兩個相等的值，例如480*320，那麼由於縮放比例不一樣，fitCenter設置後，其會根據小的分辨率進行縮小，例如會根據320來進行縮放或者擴大

　　<ImageView 
        android:id="@+id/iamgeView1"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/dog"
        android:background="#ABCDEF"
        android:scaleType="fitCenter"/>
    
    <ImageView        android:id="@+id/imageView2"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="#FEDCBA"
        android:src="@drawable/ic_launcher"
        android:scaleType="fitCenter"/>

咱們看到，這裏引用了兩張圖片，第一張dog圖片是比ImageView大的，第二張ic_launcher是比ImageView小的，咱們設置其scaleType後，其顯示效果以下：

咱們看到，由於第一張圖片分辨率不是兩個相等的數，那麼就會留出一些邊出來

②fitStart、fitEnd屬性：這個屬性跟fitCenter相似，當圖片大小與ImageView不相等時，其會按照比例對圖片進行縮小或者放大，其參考的方向是根據分辨率大的那一方，例如480*320，則會參考480那方做爲上下，若是是fitStart，則會將圖片上邊跟ImageView對其，fitEnd則會將圖片下邊與ImageView對其

    <ImageView 
        android:id="@+id/iamgeView1"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/dog"
        android:background="#ABCDEF"
        android:scaleType="fitStart"/>
    
    <ImageView        android:id="@+id/imageView2"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="#FEDCBA"
        android:src="@drawable/ic_launcher"
        android:scaleType="fitStart"/>

咱們看到，其會根據480那個分辨率向上對其，若是設置成fitStart，反之，設置成fitEnd，則會向下對其

③center：若是設置成center的話，那麼圖片就會截取中間的那部分顯示在ImageView裏面，不會對圖片進行縮小或者放大

    <ImageView 
        android:id="@+id/iamgeView1"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/dog"
        android:background="#ABCDEF"
        android:scaleType="center"/>
    
    <ImageView        android:id="@+id/imageView2"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="#FEDCBA"
        android:src="@drawable/ic_launcher"
        android:scaleType="center"/>

④centerInside：設置這個屬性值後，若是圖片的大小比ImageView大，那麼就根據比例對圖片進行縮小並將其居中顯示，若是圖片比ImageView小，那麼則不會對圖片進行擴大處理，而是直接對其進行居中顯示：

    <ImageView 
        android:id="@+id/iamgeView1"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/dog"
        android:background="#ABCDEF"
        android:scaleType="centerInside"/>
    
    <ImageView        android:id="@+id/imageView2"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="#FEDCBA"
        android:src="@drawable/ic_launcher"
        android:scaleType="centerInside"/>

⑤centerCrop：若是圖片比ImageView大，那麼則會對其進行縮小，可是並不會像fitCenter或者centerInside那樣是根據比例縮放，centerCrop設置後，其縮放的時候會將整個ImageView的邊都佔據滿，不會留出空隙，而後再將圖片居中顯示，若是圖片小的話，就會對其進行擴大，並佔滿ImageView的邊框，再居中顯示：

　　<ImageView 
        android:id="@+id/iamgeView1"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/dog"
        android:background="#ABCDEF"
        android:scaleType="centerCrop"/>
    
    <ImageView        android:id="@+id/imageView2"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="#FEDCBA"
        android:src="@drawable/ic_launcher"
        android:scaleType="centerCrop"/>

咱們一樣能夠在java代碼中來設置scaleType這個屬性：

ImageView imageView = (ImageView)findViewById(R.id.iamgeView1);imageView.setScaleType(ScaleType.CENTER_CROP);

 

這幾個就是咱們經常使用的幾個scaleType屬性，咱們能夠根據須要來設置不一樣的屬性值來達到圖片和ImageView大小匹配的效果