ImageView詳解

時間  2019-11-09
標籤 imageview 詳解 简体版
原文   原文鏈接

知識點簡介

ImageView在官方的介紹上說是顯示任意圖像，如圖標。ImageView類能夠從各類來源(如資源或內容提供程序)加載圖像，負責從圖像中計算其度量，以即可以在任何佈局管理器中使用，並提供各類顯示選項，如縮放和着色。html

基本使用方法

  1. xml xml中聲明ImageView控件，而後在activity中經過findViewById()獲取
<ImageView
        android:id="@+id/image"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" 
        android:src="@mipmap/icon_check"/>
複製代碼
public class MainActivity extends RxAppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ImageView imageView = (ImageView) findViewById(R.id.image);
    }

}
複製代碼
  1. new 經過new建立出ImageView對象，傳入一個context
ImageView view = new ImageView(this);
複製代碼

經常使用屬性

經常使用屬性詳解

  • android:adjustViewBounds

 相關方法:setAdjustViewBounds(boolean)  官方解釋：經過調整ImageView的界限來保持圖片的寬高比例android

 adjustViewBounds參數默認爲false，當咱們須要使用它的時候將其設置爲true,其scaleType自動爲「fitCenter」（當scaleType與adjustViewBounds同時在xml中設置後，若是設置了scaleType，則由adjustViewBounds自動設置的scaleType將失效，由於scaleType優先級比adjustViewBounds高），而且會根據當前View的最大寬高來填充View的內容，而且須要配合上maxHeight與maxWidth一塊兒使用纔會有效，由於其須要一個ImageView的界限bash

<ImageView
        android:id="@+id/image"
        android:maxHeight="30dp"
        android:maxWidth="30dp"
        android:adjustViewBounds="true"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:src="@mipmap/icon_check"/>
複製代碼
  • android:baseline

 相關方法:setBaseline(int)  官方解釋:視圖中基線的偏移量。ide

 baseline默認爲-1，此時基線處於ImageView的頂部，當經過setBaseLine設置偏移量爲正數時表明視圖的基線向下偏移，爲負數時向上偏移，下面咱們能夠經過代碼與圖片的結合清楚的瞭解那條基線的位置(當baseline與baselineAlignBottom同時存在一個視圖中時，基線以設置了baselineAlignBottom爲主)佈局

  1. 設置偏移量爲正數
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    >

    <TextView
        android:text="你好"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <ImageView
        android:baseline="50dp"
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"/>

</LinearLayout>
複製代碼

在這裏插入圖片描述

  1. 設置偏移量爲負數
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
  >

    <TextView
        android:text="你好"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <ImageView
        android:baseline="-50dp"
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"/>

</LinearLayout>
複製代碼

偏移量爲-50dp
3. 不設置偏移量 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    >

    <TextView
        android:text="你好"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <ImageView
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"/>

</LinearLayout>
複製代碼

無偏移量

  • android:baselineAlignBottom  相關方法:setBaselineAlignBottom(boolean)  官方解釋:若是爲true，則圖像視圖將基於其底部邊緣與基線對齊  其實就是基線的位置處於ImageView的底部，展示出來的效果就是上圖示例中咱們的文字與圖片底部對齊，其中baseline若是與baselineAlignBottom同時使用時，baseline設置得將毫無心義，基線位置以baselineAlignBottom設置的爲主
<LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
 
    <TextView
        android:text="你好"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <ImageView
        android:baselineAlignBottom="true"
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"/>
        
    </LinearLayout>
複製代碼

在這裏插入圖片描述

  • android:cropToPadding  相關方法:setCropToPadding(boolean)  官方解釋:若是爲true，該圖像將被裁剪以適合其填充  這個參數若是設置爲true，ImageView在onDraw的時候會根據scrollX、scrollY、padding等等參數來對圖片進行裁剪，並將裁剪後的圖片填充到界面上
    onDraw方法 
<LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <TextView
        android:text="你好"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <ImageView
        android:paddingLeft="-20dp"
        android:cropToPadding="true"
        android:id="@+id/image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"/>

    </LinearLayout>
複製代碼

在這裏插入圖片描述

  • android:maxHeight  相關方法:setMaxHeight(int)  官方解釋:爲視圖提供最大的高度可選參數 該參數與maxWidth做用類似，都是至關於給ImageView設置一個最大的寬或高，該參數必須與android:adjustViewBounds配合使用，單獨使用無效
  • android:maxWidth  相關方法: setMaxWidth(int)  官方解釋:爲視圖提供最大的寬度可選參數 該參數與maxWidth做用類似，都是至關於給ImageView設置一個最大的寬或高，該參數必須與android:adjustViewBounds配合使用，單獨使用無效
  • android:scaleType（重點掌握）  相關方法:setScaleType(ImageView.caleType)  官方解釋:控制圖像大小的調整或移動方式，以與此ImageView的大小匹配 Type:
  1. CENTER

 圖片居中展現，若是圖片大與控件大小，則以中心爲基準展現ImageView控件大小，圖片多出的部分裁剪不展現，若是圖片小於控件大小，則所有展現，其他地方留白ui

  1. CENTER_CROP

 圖片進行等比的縮放或拉伸，直到有寬或高有一方可以等於控件的寬高，多餘的不展現this

  1. CENTER_INSIDE

 將圖片進行等比縮放，完整的展現在ImageView上，沒有鋪張到的地方顯示背景色留白spa

  1. FIT_CENTER

 默認模式，圖片將進行等比縮放或放大，完整的展現在ImageView上，而且沒有鋪張到的地方顯示背景色。這裏與CENTER_INSIDE有點相似，區別在於當同時都是小圖片的時候，FIT_CENTER會在小圖片的時候將圖片拉伸至控件大小，而CENTER_INSIDE則只會居中顯示，不拉伸翻譯

  1. FIT_START

 圖片進行等比縮放或放大，完整的展現在ImageView上，這一點和FIT_CENTER類似，不一樣點在於FIT_START是以左上爲基準，當寬完整平鋪展現而且高會有留白後，圖片將在控件的上方，下方留白，若是高平鋪展現，寬有留白時，則右邊留白3d

  1. FIT_END

 圖片進行等比縮放或放大，完整展現在ImageView上，與FIT_START效果相反

  1. FIT_XY

 圖片進行縮放或放大（非等比），顯示在ImageView上，這裏不是等比縮放或放大，會將圖片完整的展現在ImageView上，通常來講圖片寬高比和控件寬高比不一致的狀況下，圖片會呈現扭曲感

  1. MATRIX

 指定一種矩陣，由於其餘七種都是內部已經寫好了矩陣，這一種爲本身指定一種矩陣，配合setImageMatrix()方法使用 快速記憶：其中CENTER,CENTER_CROP,CENTER_INSIDE共性：居中顯示，FIT_CENTER,FIT_END,FIT_START,FIT_XY共性：對圖片進行縮放，MATRIX指定矩陣

  • android:src  相關方法: setImageResource(int)  官方解釋:將可繪製的內容設置給ImageView ImageView顯示圖片有兩種方式，android:background和android:src兩種，雖然兩種都能作到顯示圖片，可是仍是有很大的區別的，在下面專門開設一個節點詳細講解一下
    在這裏插入圖片描述
    在這裏插入圖片描述
  • android:tint  相關方法:setColorFilter(int,PorterDuff.Mode)  官方解釋:設置圖像的顏色 這個方法翻譯過來就是染色，它的做用就是改變圖像每一個像素的顏色，使用起來很簡單，直接調用 setColorFilter();方法，傳入ColorFilter，ColorFilter有三個派生子類LightingColorFilter，PorterDuffColorFilter，ColorMatrixColorFilter，這個方法雖然用起來很簡單，可是其中卻有不少細節，能夠參考Android中ImageView的ColorFilter圖像處理解析，講的很詳細。

子類

ImageButton

 ImageViewButton是一個相似Button的圖像按鈕

  • 能夠根據android:src或setimageresource（int）來爲其設置圖像
  • 能夠同時擁有前景和背景（前景在設置了固定的寬高後會出現圖片失幀狀況）
  • 能夠設置選擇器，根據按鈕的不一樣狀態來改變按鈕的圖像等等（要選擇生效必須控件獲取到焦點）
<ImageButton
        android:id="@+id/imageview"
        android:src="@drawable/bottom_line_style"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
複製代碼

bottom_line_style.xml

<?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
     <item android:state_pressed="true"
           android:drawable="@drawable/button_pressed" /> <!-- pressed -->
     <item android:state_focused="true"
           android:drawable="@drawable/button_focused" /> <!-- focused -->
     <item android:drawable="@drawable/button_normal" /> <!-- default -->
 </selector>
複製代碼

QuickContactBadge

 用於顯示具備標準QuickContact徽章和單擊行爲的圖像的小部件 該方法如今用的很少了，參考文章:QuickContactBadge

AppCompatImageView

 能夠染色的ImageView，實現了TintableBackgroundView與TintableImageSourceView兩個接口，用做對背景顏色進行動態改變，該ImageView在5.0如下的系統容易出現問題，較難排查，不建議使用

注：在高版本中還有一些其餘的子類，可是不常見，因此沒有例舉

相關文章連接：

ImageView的ScaleType原理及效果分析 ：www.jianshu.com/p/fe5d2e3fe… ImageView的ScaleType詳解 ：www.cnblogs.com/pandapan/p/… Android中ImageView的ColorFilter圖像處理解析 ：www.jianshu.com/p/bbc77334b… 關於圓角ImageView的幾種實現方式 ：www.jianshu.com/p/626dbd932…

相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程