前言
在Android
開發過程中,我們常回用到一個展示圖片的控件——ImageView
。接下來就讓我們學習下ImageView
的使用吧。
今天涉及知識:
- ImageView設置圖片的方法
- ImageView圖片展示縮放類型
- ImageView的scaleType在Activity中的使用
- 效果圖和項目結構圖
先來波效果圖
一.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,今天的內容就介紹到這裏了,謝謝大家。