Android ImageView ImageButton示例-IGI

时间：2020-02-23 14:28:59 　来源:igfitidea点击:

Android ImageView用于显示图像文件。
Android也有一个" ImageButton"。
顾名思义，" ImageButton"组件是一个带有图像的按钮。
ImageButton由Android类android.widget.ImageButton表示。
在本教程中，我们将在我们的应用程序中实现android ImageView和ImageButton。

Android ImageView

Android ImageView是用于在应用程序中显示图像的UI小部件之一。
它是通过以下方式在XML布局中定义的。

<ImageView
          android:id="@+id/imageView"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_margin="5dp"
          android:src="@drawable/ic_launcher"

其中" android：src"用于从可绘制资源文件夹中分配图像文件。

Android ImageView ScaleType

android中的ImageView具有不同的配置选项以支持不同的scaleTypes。

scaleType选项用于将图像的边界缩放到图像视图的边界。
以下是受支持的列出的scaleType配置属性。

CENTER：不缩放显示图像在视图中心的位置。
CENTER_CROP：缩放图像，使x和y尺寸均大于或者等于视图，同时保持图像的长宽比；使图像在视图中居中
CENTER_INSIDE：缩放图像以适合视图内部，同时保持图像的宽高比。
如果图像已经小于视图，则与中心相同
FIT_CENTER：缩放图像以适合视图内部，同时保持图像的宽高比。
至少一个轴将与视图完全匹配，并且结果在视图内部居中
FIT_START：与fitCenter相同，但与视图的左上方对齐
FIT_END：与fitCenter相同，但与视图的右下角对齐
FIT_XY：缩放x和y尺寸以完全匹配视图大小。
d不保持图像宽高比
MATRIX：使用提供的Matrix类缩放图像。
可以使用setImageMatrix方法提供矩阵。
Matrix类可用于将变换(例如旋转)应用于图像

FIT_CENTER中的默认scaleType。

注意：fitXY比例类型允许您设置布局中图像的确切尺寸。
但是，由于缩放可能会出现图像的潜在失真。
例如;

<ImageView
          android:id="@+id/imageView"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_margin="5dp"
          android:scaleType="fitXY"
          android:src="@drawable/ic_launcher"

在Android ImageView中支持多种密度

有一个功能强大的系统可以为正确的设备选择正确的图像资产。
每个设备密度类别都有特定的可绘制文件夹，包括：ldpi(低)，mdpi(中)，hdpi(高)和xhdpi(超高)等。
例如，drawable-mdpi表示每英寸可绘制的中点。

在这个项目中，我们将在活动中显示各种图像scaleTypes以及一个android图像按钮。

向资源添加图像

我们将使用ImageView显示" png"图像。
PNG是无损的，因此它们比JPG图像具有优势。
我们将图像添加到文件夹" res/drawable-xdpi"，" res/drawable-mdpi"或者" res/drawable-hdpi"等文件夹中，具体取决于图像的大小。

Android ImageView，ImageButton示例项目结构

如您所见，我们已经在相应尺寸的可绘制文件夹中添加了Balloon.png文件。

Android ImageView项目代码

xml布局文件包含五个具有不同scaleTypes的图像以及一个ImageButton。
该布局是ScrollView(使活动可滚动)的子级，我们将在后面讨论。

activity_main.xml

<ScrollView xmlns:android="https://schemas.android.com/apk/res/android"
  xmlns:tools="https://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="match_parent">

  <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:orientation="vertical" >

      <ImageView
          android:id="@+id/imageView1"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_margin="5dp"
          android:src="@drawable/balloon" 

      <ImageView
          android:id="@+id/imageView2"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_margin="5dp"
          android:background="#fff"
          android:padding="3dp"
          android:scaleType="fitXY"
          android:src="@drawable/balloon" 

      <ImageView
          android:id="@+id/imageView3"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_margin="5dp"
          android:background="#fff"
          android:paddingBottom="50dp"
          android:paddingLeft="3dp"
          android:paddingRight="3dp"
          android:paddingTop="3dp"
          android:scaleType="fitStart"
          android:src="@drawable/balloon" 

      <ImageView
          android:id="@+id/imageView4"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_margin="5dp"
          android:background="#fff"
          android:paddingBottom="50dp"
          android:paddingLeft="3dp"
          android:paddingRight="3dp"
          android:paddingTop="3dp"
          android:scaleType="fitEnd"
          android:src="@drawable/balloon" 

      <ImageView
          android:id="@+id/imageView5"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_margin="5dp"
          android:background="#fff"
          android:padding="3dp"
          android:src="@drawable/balloon" 

      <ImageButton
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:id="@+id/imageButton"
          android:layout_gravity="center_horizontal"
          android:layout_centerVertical="true"
          android:layout_centerHorizontal="true"
          android:src="@android:drawable/ic_menu_send"

  </LinearLayout>

</ScrollView>

MainActivity.java在下面定义。

package com.theitroad.imageview;

import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.Toast;

public class MainActivity extends Activity {

  @Override
  protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);

      //setting image resource from drawable
      ImageView imageView = (ImageView) findViewById(R.id.imageView2);
      imageView.setImageResource(R.drawable.balloon);

      imageView.setOnClickListener(new OnClickListener() {

          @Override
          public void onClick(View arg0) {
              Toast.makeText(getApplicationContext(), "Clicked Second Image",
                      Toast.LENGTH_SHORT).show();
          }
      });

      ImageButton imageButton=(ImageButton) findViewById(R.id.imageButton);
      imageButton.setOnClickListener(new OnClickListener() {
          @Override
          public void onClick(View v) {
              Toast.makeText(getApplicationContext(), "Clicked Image Button",
                      Toast.LENGTH_SHORT).show();
          }
      });

      Bitmap bMap = BitmapFactory.decodeResource(getResources(), R.drawable.balloon);
      Bitmap bMapScaled = Bitmap.createScaledBitmap(bMap, 350, 300, true);
      ImageView image = (ImageView) findViewById(R.id.imageView5);
      image.setImageBitmap(bMapScaled);

  }
}

其中我们使第二个ImageView可单击以显示Toast。

Android ImageButton

Android ImageButton具有普通按钮的所有属性。
它可以选择添加资源文件而不是文本。

使用位图

位图属于android.graphics.Bitmap类。

Bitmapfactory主要用于缩放可绘制图像。
如果我们不使用" BitmapFactory"，则会导致内存分配不足。

我们可以将上面显示的ImageView2中显示的位图更改为可绘制资源，就像对imageview2所做的那样。

ImageView image = (ImageView) findViewById(R.id.imageview2);
image.setImageResource(R.drawable.balloon);

imageview5没有分配任何scaleType，因此我们使用了静态方法createScaledBitmap(Bitmap src，int dstWidth，int dstHeight，boolean filter)对其进行缩放。

要将存储中存在的任何文件传递到imageview中，请执行以下代码。

ImageView image = (ImageView) findViewById(R.id.test_image);
Bitmap bMap = BitmapFactory.decodeFile("/sdcard/test.png");
image.setImageBitmap(bMap);

setImageBitmap()将位图内容设置为ImageView。

代表最终输出的图像如下所示：

默认情况下，第一个ImageView未被分配任何scaleType。
因此，作为默认scaleType的center被隐式地分配给它。
第二个ImageView具有scaleType fitXY。
会看到失真，因此不是在应用程序中使用的好习惯。
第三和第四ImageView分别具有scaleType fitStart和fitEnd。
第五个ImageView已使用位图使用自定义的宽度和高度缩放。

这也是我们应用程序的简短动画。

本教程到此结束。
您可以从下面的链接下载最终的Android ImageView项目。

Android ImageView ImageButton示例