ImageView
ImageView继承自View组件,主要用于显示图像资源(例如图片等), ImageView还可以定义所显示的尺寸等。此外, ImageView还派生了ImageButton, ZoomButton等组件。Image View所支持的XML属性和方法如下表所示。
ImageView的XML属性及方法
| XML属性 | 对应方法 | 功能描述 |
|---|---|---|
| android:adjust ViewBounds | setAdjust ViewBounds( boolean) | 是否保持宽高比。需要与maxWidth 、 MaxHeight一起使用,单独使用没有效果 |
| android :cropToPadding | setCropToPadding( boolean) | 截取指定区域是否使用空白代替。单独设置无效果,需要与scrollY一起使用 |
| android: maxHeight | setMaxHeight(int) | 设置View的最大高度,单独使用无效,需要与setAdjustViewBounds()方法一起使用。如果想设置图片固定大小,又想保持图片宽高比,需要如下设置:设置setAdjust ViewBounds 为true;设置max Width和 MaxHeight属性;设置layout_ width和 layout_height均为wrap_content |
| android :max Width | setMax Width(int) | 设置View的最大宽度。用法同android :maxHeight |
| android :src | setImageResource(int) | 设置Image View所显示的 Drawable对象 |
| android :scaleType | setScaleType ( Image View.ScaleType) | 设置所显示的图片如何缩放或移动以适应Image View的大小 |
ImageView的android : scaleType属性可以指定如下属性值
- matrix:用矩阵来绘图。
- fitXY:拉伸图片(不按比例)以填充View的宽高。
- fitStart:按比例拉伸图片,图片拉伸后的高度为View的高度,且显示在 View 的左边。
- fitCenter:按比例拉伸图片,图片拉伸后的高度为View 的高度,且显示在View 的中间。
- fitEnd:按比例拉伸图片,图片拉伸后的高度为View 的高度,且显示在View 的右边。
- center:按原图大小显示图片,当图片宽高大于 View的宽高时,截图图片中间部分显示。
- centerCrop:按比例放大原图,直至等于View某边的宽高。
- centerInside:当原图宽高等于View的宽高时,按原图大小居中显示﹔反之将原图缩放至 View的宽高居中显示。
此外.为了控制ImageView所显示的图片,该组件提供了如下方法
- sctlmageBitmap(Bitmap):使用Bitmap位图来设置ImageView所显示的图片。
- setImageDrawable( Drawable):使用Drawable对象来设置ImageView所显示的图片。
- setImageResource(int):使用图片资源ID来设置ImageView所显示的图片。
- setImagURI(Uri):使用图片的URI来设置ImageView所显示的图片。
代码演示
下面通过一个简单示例演示 ImageView的使用。通过单击“下一页/上一页”按钮,实现图片的切换
对应的布局文件代码如下所示
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:orientation="vertical"
>
<!-- 图片及文字 1 -->
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="vertical">
<ImageView
android:id="@+id/photoImageView"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="30dp"
android:background="@android:color/white"
android:scaleType="fitCenter"
android:src="@drawable/one" />
<TextView
android:id="@+id/photoTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="佐佐木希" />
</LinearLayout>
<!-- 分页 2 -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="horizontal">
<ImageButton
android:id="@+id/backImageBtn"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginLeft="140dp"
android:layout_gravity="fill_vertical"
android:src="@drawable/back"/>
<ImageButton
android:id="@+id/forwardImageBtn"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_gravity="fill_vertical"
android:src="@drawable/forward" />
</LinearLayout>
</LinearLayout>
代码解释如下:标号1处定义了一个 ImageView组件,用来显示图片,通过设置android; scaleType= " fitCenter"属性,使用拉伸后图片的高度作为View的高度,且在View的中间显示,同时还定义了一个TextView组件用来显示图片的名字;标号2处定义了两个ImageButton组件,分别用于显示“上一页”和“下一页”的图片。
下面在Activity 中演示图片分页效果:当用户分别单击“上一页/下一页”按钮时,在屏幕上会显示相应的图片
对应的Activity 代码实现如下所示
package com.qst.demo2;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;
import androidx.appcompat.app.AppCompatActivity;
public class ImageViewDemoActivity extends AppCompatActivity {
//定义变量 1
//图片对应的ImageView
ImageView flagImageView;
TextView flagTxt;
ImageButton backImgeBtn; //上一页
ImageButton forwardImageBtn; //下一页
//图片数组 2
int [] flag = {
R.drawable.one, R.drawable.two, R.drawable.three};
String[] flagNames = {
"佐佐木希", "胡歌", "霉霉"};
//当前页 默认第一页
int currentPage = 0;
@Override //重写方法
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState); //调用父类onCreate创建Activity
setContentView(R.layout.imageview_demo); //设置布局
//初始化组件 3
flagImageView = (ImageView) findViewById(R.id.photoImageView);
flagTxt = (TextView) findViewById(R.id.photoTxt);
//上一页，下一页
backImgeBtn = (ImageButton) findViewById(R.id.backImageBtn);
forwardImageBtn = (ImageButton) findViewById(R.id.forwardImageBtn);
//注册监听器
backImgeBtn.setOnClickListener(onClickListener);
forwardImageBtn.setOnClickListener(onClickListener);
}
//定义单击事件监听器 4
private View.OnClickListener onClickListener = new View.OnClickListener() {
//创建对象
@Override //重写接口方法
public void onClick(View v) {
switch (v.getId()) {
case R.id.backImageBtn:
if (currentPage == 0) {
Toast.makeText(ImageViewDemoActivity.this,
"第一页，前面没有了", Toast.LENGTH_SHORT).show();
return;
}
//上翻一页
currentPage--;
//设置图片
flagImageView.setImageResource(flag[currentPage]);
//设置图片名字
flagTxt.setText(flagNames[currentPage]);
break;
case R.id.forwardImageBtn:
if (currentPage == (flag.length-1)) {
Toast.makeText(ImageViewDemoActivity.this,
"最后一页，后面没有了", Toast.LENGTH_SHORT).show();
return;
}
currentPage++; //下翻一页
flagImageView.setImageResource(flag[currentPage]); //设置图片
flagTxt.setText(flagNames[currentPage]); //设置图片名字
break;
default:
break;
}
}
};
}
代码解释如下:标号1处分别声明了ImageView类型和ImageButton类型的属性变量;标号2处定义了两个数组并进行初始化,分别表示图片资源和图片名称﹔标号3处用于初始化标号1处所声明的属性变量,并对backImageBtn和forwardImageBtn对象设置监听器,来监听各自的单击事件﹔标号4处定义了一个OnClickListener类型的监听器，用于处理按钮单击事件,当单击按钮时根据所单击的按钮不同来显示不同的图片和图片名称。
在AndroidMainfest.xml清单文件中声明Activity
运行Activity代码后，效果如下图
