ImageView的scaleType知識總結

ImageView的ScaleType決定了圖片在View上的顯示的樣式，比如如何對圖片進行縮放，顯示圖片整體還是部分，還是根據自己的需求進行相關顯示。設置比較簡單：

xml中如下定義：

android:scaleType="center"

或者代碼中如下定義：

imageView.setScaleType(ImageView.ScaleType.CENTER);

首先我們先來看下我們最終需要的結果：

我們這里就以一個實例來看下顯示的圖片大小吧。

首先，我們先來一個真圖(默認顯示的)，圖片地址如下：

http://photos.breadtrip.com/photo_2012_06_26_b10dafad432167233c86774c0bc8bc3b.jpg?imageView/2/w/960/q/85

這個圖片的大小是720*960分辨率的。(而且后臺給定的還不是固定的圖片大小)

當然這個時候我們在app中使用的時候，是不會這么原圖大小進行顯示的，而是根據我們的imageView的寬和高進行適當的匹配。

比如如下定義：

我們定義以下的樣式（用到了cardview）
  <style name="Card_bg">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">120dp</item>
        <item name="android:layout_marginBottom">4dp</item>
        <item name="cardBackgroundColor">@color/white</item>
        <item name="cardCornerRadius">4dp</item>
        <item name="cardElevation">2dp</item>
    </style>


    <style name="CardPhoto">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">match_parent</item>
        <item name="android:tint">@color/photo_tint</item>
        <item name="android:scaleType">centerCrop</item>
        <item name="riv_corner_radius">6dp</item>
    </style>

這里我在這里用到了一個開源庫，用于圓角圖片形成,地址如下：

compile 'com.makeramen:roundedimageview:1.5.0'

這個時候我們在xml中如下使用：

<android.support.v7.widget.CardView
        android:id="@+id/card_view"
        style="@style/Card_bg"
        >
        <include
            layout="@layout/card_photo"/>
 </android.support.v7.widget.CardView>

其中card_photo布局文件如下：

<?xml version="1.0" encoding="utf-8"?>
<com.makeramen.RoundedImageView xmlns:android="http://schemas.android.com/apk/res/android"
                                android:id="@+id/photo"
              style="@style/CardPhoto">

</com.makeramen.RoundedImageView>

以上并不是重點(以上只是為了實現我們上圖的效果，個人感覺還是蠻好看的)，重點是scaleType，哈哈，來讓我們開始吧。

我們雖然定義了ImageView的寬匹配父窗體，高是120dp。我們先來看下scaleType不設置的時候什么樣子。

1、默認不適用scaleType效果

可以看大如果什么都沒有，就是原版的縮放(這里高有了限定，那么就按照高的比例進行縮放)

2、ImageView.ScaleType.CENTER效果

android:scaleType="center"

可以看到center的效果和我們需要的效果基本接近了，但是細心的看的出來，還是有區別的，那就是會按照圖片原來的size居中顯示， 如果圖片的長/寬 超過了view的長/寬，則截取圖片的居中部分 ，這也就是為什么我們看到的是圖片的居中顯示部分

3、ImageView.ScaleType.CENTER_CROP效果

android:scaleType="centerCrop"

可以看到這個效果是最終我們需要的效果，按比例擴大(或者縮小)圖片的size居中顯示，使得圖片的長(寬)等于或者大于或者小于view的長(寬)

4、ImageView.ScaleType.CENTER_INSIDE效果

android:scaleType="centerInside"

將圖片的內容完整居中顯示，通過安裝長或者寬的縮小或放大的比例(這里按照了高的進行了縮放)使得圖片的長/寬等于或者小于view的長/寬

5、ImageView.ScaleType.FIT_CENTER效果

android:scaleType="fitCenter"

把圖片按照比例擴大或者縮小，居中顯示

6、ImageView.ScaleType.FITSTART、FITEND效果

android:scaleType="fitStart"
 android:scaleType="fitEnd"

這兩個效果和fitCenter的效果差不多，只是顯示的位置不同，圖片上有了顯示位置對應的模式，這里就不多說了。

7、ImageView.ScaleType.FITXY

android:scaleType="fitXY"

不按照比例進行擴展或者縮放，目的是鋪滿整個view(這里明顯的可以看到圖片被拉伸了)

至此，應該知道了關于ImageView的scaleType屬性是怎么一回事，并且在以后的項目中也知道了怎么使用了吧。也算是自己的一個總結。

 

 

來自：http://www.jianshu.com/p/feba178588e1