ImageView的ScaleType屬性設置

一、對比顯示ScaleType的不同效果

二、使用嵌套LinearLayout爲每一張ImageView添加文字說明

三、ScaleType的8個屬性簡要說明:

1.scaleType=“matrix” 

是保持原圖大小、從左上角的點開始,以矩陣形式繪圖。

2.scaleType=“fitXY”  

不按比例縮放圖片,目標是把圖片塞滿整個View。

3.scaleType=“fitStart”

是將原圖沿左上角的點(即matrix方式繪圖開始的點),按比例縮放原圖繪製而成的。

4.scaleType=“fitCenter”

是將原圖沿上方居中的點(即matrix方式繪圖第一行的居中的點),按比例縮放原圖繪製而成的。

5.scaleType=“fitEnd”

是將原圖沿下方居中的點(即matrix方式繪圖最後一行的居中的點),按比例縮放原圖繪製而成的。

6.scaleType=“Center”

是保持原圖大小,以原圖的幾何中心點和ImagView的幾何中心點爲基準,只繪製ImagView大小的圖像。

7.scaleType=“centerCrop”

不保持原圖大小,以原圖的幾何中心點和ImagView的幾何中心點爲基準,只繪製ImagView大小的圖像(以填滿ImagView爲目標,對原圖進行裁剪)。

3.scaleType=“centerInside”

不保持原圖大小,以原圖的幾何中心點和ImagView的幾何中心點爲基準,只繪製ImagView大小的圖像(以顯示完整圖片爲目標,對原圖進行縮放)。

四、設置方法

java:

使用setImageResource()設置使用的圖片

使用setScaleType()設置圖片拉伸屬性

xml:

使用android:src="" 設置使用的圖片

使用android:scaleType=""設置圖片拉伸屬性
                

先看原始圖片:


效果圖:


xml代碼:

  1. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:background="@drawable/field"  
  6.     android:orientation="vertical"  
  7.     tools:context=".MainActivity" >  
  8.   
  9.     <LinearLayout   
  10.         android:layout_width="wrap_content"  
  11.         android:layout_height="wrap_content"  
  12.         android:orientation="horizontal" >  
  13.   
  14.         <LinearLayout  
  15.             android:layout_width="wrap_content"  
  16.             android:layout_height="wrap_content"  
  17.             android:orientation="vertical"  
  18.             android:layout_marginRight="5dp" >  
  19.   
  20.             <TextView  
  21.                 android:layout_width="wrap_content"  
  22.                 android:layout_height="wrap_content"  
  23.                 android:text="matrix"  
  24.                 android:textColor="#ff00ff" />  
  25.   
  26.             <ImageView  
  27.                 android:id="@+id/imageViewId"  
  28.                 android:layout_width="100dp"  
  29.                 android:layout_height="100dp"  
  30.                 android:background="#f0f0f0"  
  31.                 android:scaleType="matrix"  
  32.                 android:src="@drawable/zhl" />  
  33.         </LinearLayout>  
  34.   
  35.         <LinearLayout  
  36.             android:layout_width="wrap_content"  
  37.             android:layout_height="wrap_content"  
  38.             android:orientation="vertical"  
  39.             android:layout_marginRight="5dp" >  
  40.   
  41.             <TextView  
  42.                 android:layout_width="wrap_content"  
  43.                 android:layout_height="wrap_content"  
  44.                 android:text="fitXY"  
  45.                 android:textColor="#ff00ff" />  
  46.   
  47.             <ImageView  
  48.                 android:id="@+id/imageViewId"  
  49.                 android:layout_width="100dp"  
  50.                 android:layout_height="100dp"  
  51.                 android:background="#f0f0f0"  
  52.                 android:scaleType="fitXY"  
  53.                 android:src="@drawable/zhl" />  
  54.         </LinearLayout>  
  55.   
  56.         <LinearLayout  
  57.             android:layout_width="wrap_content"  
  58.             android:layout_height="wrap_content"  
  59.             android:orientation="vertical"  
  60.             android:layout_marginRight="5dp" >  
  61.   
  62.             <TextView  
  63.                 android:layout_width="wrap_content"  
  64.                 android:layout_height="wrap_content"  
  65.                 android:text="fitStart"  
  66.                 android:textColor="#ff00ff" />  
  67.   
  68.             <ImageView  
  69.                 android:id="@+id/imageViewId"  
  70.                 android:layout_width="100dp"  
  71.                 android:layout_height="100dp"  
  72.                 android:background="#f0f0f0"  
  73.                 android:scaleType="fitStart"  
  74.                 android:src="@drawable/zhl" />  
  75.         </LinearLayout>  
  76.     </LinearLayout>  
  77.   
  78.     <LinearLayout  
  79.         android:layout_width="wrap_content"  
  80.         android:layout_height="wrap_content"  
  81.         android:orientation="horizontal" >  
  82.   
  83.         <LinearLayout  
  84.             android:layout_width="wrap_content"  
  85.             android:layout_height="wrap_content"  
  86.             android:orientation="vertical"  
  87.             android:layout_marginRight="5dp" >  
  88.   
  89.             <TextView  
  90.                 android:layout_width="wrap_content"  
  91.                 android:layout_height="wrap_content"  
  92.                 android:text="fitCenter"  
  93.                 android:textColor="#ff00ff" />  
  94.   
  95.             <ImageView  
  96.                 android:id="@+id/imageViewId"  
  97.                 android:layout_width="100dp"  
  98.                 android:layout_height="100dp"  
  99.                 android:background="#f0f0f0"  
  100.                 android:scaleType="fitCenter"  
  101.                 android:src="@drawable/zhl" />  
  102.         </LinearLayout>  
  103.   
  104.         <LinearLayout  
  105.             android:layout_width="wrap_content"  
  106.             android:layout_height="wrap_content"  
  107.             android:orientation="vertical"  
  108.             android:layout_marginRight="5dp" >  
  109.   
  110.             <TextView  
  111.                 android:layout_width="wrap_content"  
  112.                 android:layout_height="wrap_content"  
  113.                 android:text="fitEnd"  
  114.                 android:textColor="#ff00ff" />  
  115.   
  116.             <ImageView  
  117.                 android:id="@+id/imageViewId"  
  118.                 android:layout_width="100dp"  
  119.                 android:layout_height="100dp"  
  120.                 android:background="#f0f0f0"  
  121.                 android:scaleType="fitEnd"  
  122.                 android:src="@drawable/zhl" />  
  123.         </LinearLayout>  
  124.   
  125.         <LinearLayout  
  126.             android:layout_width="wrap_content"  
  127.             android:layout_height="wrap_content"  
  128.             android:orientation="vertical"  
  129.             android:layout_marginRight="5dp" >  
  130.   
  131.             <TextView  
  132.                 android:layout_width="wrap_content"  
  133.                 android:layout_height="wrap_content"  
  134.                 android:text="center"  
  135.                 android:textColor="#ff00ff" />  
  136.   
  137.             <ImageView  
  138.                 android:id="@+id/imageViewId"  
  139.                 android:layout_width="100dp"  
  140.                 android:layout_height="100dp"  
  141.                 android:background="#f0f0f0"  
  142.                 android:scaleType="center"  
  143.                 android:src="@drawable/zhl" />  
  144.         </LinearLayout>  
  145.     </LinearLayout>  
  146.   
  147.     <LinearLayout  
  148.         android:layout_width="wrap_content"  
  149.         android:layout_height="wrap_content"  
  150.         android:orientation="horizontal" >  
  151.   
  152.         <LinearLayout  
  153.             android:layout_width="wrap_content"  
  154.             android:layout_height="wrap_content"  
  155.             android:orientation="vertical"  
  156.             android:layout_marginRight="5dp" >  
  157.   
  158.             <TextView  
  159.                 android:layout_width="wrap_content"  
  160.                 android:layout_height="wrap_content"  
  161.                 android:text="centerCrop"  
  162.                 android:textColor="#ff00ff" />  
  163.   
  164.             <ImageView  
  165.                 android:id="@+id/imageViewId"  
  166.                 android:layout_width="100dp"  
  167.                 android:layout_height="100dp"  
  168.                 android:background="#f0f0f0"  
  169.                 android:scaleType="centerCrop"  
  170.                 android:src="@drawable/zhl" />  
  171.         </LinearLayout>  
  172.   
  173.         <LinearLayout  
  174.             android:layout_width="wrap_content"  
  175.             android:layout_height="wrap_content"  
  176.             android:orientation="vertical"  
  177.             android:layout_marginRight="5dp" >  
  178.   
  179.             <TextView  
  180.                 android:layout_width="wrap_content"  
  181.                 android:layout_height="wrap_content"  
  182.                 android:text="centerInside"  
  183.                 android:textColor="#ff00ff" />  
  184.   
  185.             <ImageView  
  186.                 android:id="@+id/imageViewId"  
  187.                 android:layout_width="100dp"  
  188.                 android:layout_height="100dp"  
  189.                 android:background="#f0f0f0"  
  190.                 android:scaleType="centerInside"  
  191.                 android:src="@drawable/zhl" />  
  192.         </LinearLayout>  
  193.     </LinearLayout>  
  194.   
  195. </LinearLayout>  
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章