Kotlin筆記(37) — ImageView用法

前言

在Android開發過程中，我們常回用到一個展示圖片的控件——ImageView。接下來就讓我們學習下ImageView的使用吧。

今天涉及知識：

1. ImageView設置圖片的方法
2. ImageView圖片展示縮放類型
3. ImageView的scaleType在Activity中的使用
4. 效果圖和項目結構圖

先來波效果圖

一.ImageView設置圖片的方法

ImageView設置圖片的方法如下：

        //設置resource
        mImv.imageResource = R.mipmap.laday

        //設置drawable
        var drawable:Drawable=resources.getDrawable(R.mipmap.laday,null)
        mImv.setImageDrawable(drawable)

        //設置bitmap
        var bitmap:Bitmap=BitmapFactory.decodeResource(resources, R.mipmap.laday)
        mImv.setImageBitmap(bitmap)

二.ImageView圖片展示縮放類型

縮放類型如下表：

ScaleType拉伸類型	說明
ScaleType.FIT_START	圖片拉伸使之位於視圖上部
ScaleType.FIT_END	圖片拉伸使之位於視圖下部
ScaleType.FIT_XY	不按比例縮放圖片，目標是把圖片塞滿整個View(圖片可能被拉伸)
ScaleType.FIT_CENTER	把圖片按比例擴大/縮小到View的寬度，居中顯示
ScaleType.CENTER	保持圖片原尺寸並位於視圖中間，當圖片長/寬超過View的長/寬，則截取圖片的居中部分顯示
ScaleType.CENTER_CROP	按比例擴大圖片的size居中顯示，使得圖片長(寬)等於或大於View的長(寬)
ScaleType.CENTER_INSIDE	將圖片的內容完整居中顯示，通過按比例縮小或原來的size使得圖片長/寬等於或小於View的長/寬

三.ImageView的scaleType在Activity中的使用

ImageView的居中設置有很多，下面給出ImageView關於居中ScaleType在Activity中使用的代碼：

@RequiresApi(Build.VERSION_CODES.LOLLIPOP)
open class MainActivity : AppCompatActivity(), View.OnClickListener {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(com.kotlintest.R.layout.activity_main)

        initData()
        setListener()
    }

    private fun initData() {

        //設置resource
        mImv.imageResource = R.mipmap.laday

        //設置drawable
        var drawable:Drawable=resources.getDrawable(R.mipmap.laday,null)
        mImv.setImageDrawable(drawable)

        //設置bitmap
        var bitmap:Bitmap=BitmapFactory.decodeResource(resources, R.mipmap.laday)
        mImv.setImageBitmap(bitmap)
        LogUtil.i("======2=====")
    }

    private fun setListener() {
        mBtnTest.setOnClickListener(this@MainActivity)
        mBtn1.setOnClickListener(this@MainActivity)
        mBtn2.setOnClickListener(this@MainActivity)
        mBtn3.setOnClickListener(this@MainActivity)
        mBtn4.setOnClickListener(this@MainActivity)
    }

    override fun onClick(v: View) {
        ImageView.ScaleType.FIT_XY
        ImageView.ScaleType.FIT_START
        ImageView.ScaleType.FIT_END

       when(v.id){
           R.id.mBtnTest->toast("=====han")
           R.id.mBtn1->mImv.scaleType=ImageView.ScaleType.FIT_CENTER  //fitCenter
           R.id.mBtn2->mImv.scaleType=ImageView.ScaleType.CENTER  //center
           R.id.mBtn3->mImv.scaleType=ImageView.ScaleType.CENTER_CROP  //centerCrop
           R.id.mBtn4->mImv.scaleType=ImageView.ScaleType.CENTER_INSIDE  //centerInside
       }
    }
}

佈局文件activity_main.xml代碼如下：

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/color_f2f2f2"
    tools:context=".ui.MainActivity">

    <TextView
        android:id="@+id/mTvTest"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp"
        android:gravity="center"
        android:text="測試"
        android:textColor="@color/black"
        android:textSize="16sp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/mBtnTest"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:text="測試"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/mTvTest" />

    <ImageView
        android:id="@+id/mImv"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_marginTop="10dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/mBtnTest" />


    <Button
        android:id="@+id/mBtn1"
        android:textAllCaps="false"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:text="fit_center"
        app:layout_constraintEnd_toStartOf="@+id/mBtn2"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/mImv" />

    <Button
        android:id="@+id/mBtn2"
        android:textAllCaps="false"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="center"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/mBtn1"
        app:layout_constraintTop_toTopOf="@+id/mBtn1" />


    <Button
        android:id="@+id/mBtn3"
        android:textAllCaps="false"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:text="center_crop"
        app:layout_constraintEnd_toStartOf="@+id/mBtn4"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/mBtn1" />

    <Button
        android:id="@+id/mBtn4"
        android:textAllCaps="false"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:text="center_inside"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintStart_toEndOf="@+id/mBtn3"
        app:layout_constraintTop_toTopOf="@+id/mBtn3" />
</androidx.constraintlayout.widget.ConstraintLayout>

四.效果圖和項目結構圖

ok,今天的內容就介紹到這裏了，謝謝大家。