在本教程中，我们将使用Kotlin代码在Android应用程序中讨论和实现ImageView和ImageButton。

什么是Android ImageView？

ImageView是Android中View类的子类。
它用于在屏幕上显示图像。

图像可以是位图或者可绘制资源文件。

ImageView XML代码

ImageView的基本语法为：

<ImageView
      android:id="@+id/imageView"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:src="@drawable/sample_1" 

ImageView的主要属性如下：

• android：src属性用于设置可绘制资源文件。

• android：background用于设置ImageView的背景。

• android：scaleType用于设置图像的裁剪/调整样式。

用Kotlin代码创建ImageView

我们可以使用以下Kotlin代码创建一个ImageView对象。

val imageView = ImageView(this)

" this"表示ImageView可见的上下文。
它可以是活动/片段。

要以编程方式在ImageView上设置可绘制对象，我们使用：

imageView.setImageResource(R.drawable.drawable_id)

什么是Android ImageButton？

ImageButton是ImageView的子类。
这是一个Button + ImageView。
ImageButton不能容纳文本。

ImageView的所有属性也适用于ImageButton。

就像按钮一样，在ImageButton上，我们可以设置OnClickListener以及OnLongClickListener事件。

有关ImageView和ImageButton的XML属性的深入视图，请参阅Android ImageView ImageButton教程。

多屏密度

对于不同类型的手机，屏幕密度是不同的。
当屏幕尺寸为5.5或者6英寸时，适用于4.5英寸屏幕的可绘制文件可能会变得模糊。
因此，为了使各种设备的图像保持完整，我们可以创建不同的可绘制文件夹。

为低，中，高，超高和超高密度创建了drawable-ldpi，drawable-mdpi，drawable-hdpi，drawable-xhdpi和drawable-xxhdpi。

Android SDK在设备上运行应用程序后，会自动检测屏幕尺寸和密度，并使用可绘制文件夹中的相应图像资源文件。

如何为不同的屏幕密度生成图像文件？

我们可以使用Android Asset Studio创建不同密度的图像资源。

或者，从首选项->插件在Android Studio中安装Android Drawable Importer插件。

转到"可绘制|批处理可绘制"并导入图像，以适合每个屏幕密度的图像。

设置当前图像的浓度类型，并为文件生成所有浓度的可绘制对象。

Android ImageView ImageButton Kotlin项目

我们添加了三个示例图像，并使用Drawable Importer为每个可绘制密度创建文件。

XML布局代码

下面给出了activity_main.xml类的代码。

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:id="@+id/linearLayout"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:gravity="center"
  android:orientation="vertical">

  <ImageView
      android:id="@+id/imageView"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:scaleType="centerCrop"
      android:src="@drawable/sample_1" 

  <ImageButton
      android:id="@+id/imageButton"
      android:layout_width="wrap_content"
      android:src="@android:drawable/ic_menu_set_as"
      android:layout_gravity="bottom|center_horizontal"
      android:layout_height="wrap_content" 

</FrameLayout>

我们使用了FrameLayout。
ImageView占据整个屏幕，ImageButton设置在布局的底部。

科特林密码

下面给出了MainActivity.kt Kotlin类的代码。

package net.androidly.androidiyimageviewsbuttons

import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import android.support.v4.content.ContextCompat
import android.view.View
import android.widget.ImageButton
import android.widget.ImageView
import android.widget.Toast
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity(), View.OnClickListener {

  val sampleDrawables = intArrayOf(R.drawable.sample_1, R.drawable.sample_2, R.drawable.sample_3)

  var i = 0

  val scaleType = arrayListOf(ImageView.ScaleType.CENTER_CROP, ImageView.ScaleType.FIT_CENTER, ImageView.ScaleType.CENTER_CROP, ImageView.ScaleType.FIT_XY)

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

      imageView.setOnClickListener(this)
      imageButton.setOnClickListener(this)
  }

  override fun onClick(p0: View?) {
      when (p0) {
          is ImageButton -> if (i == sampleDrawables.size) {
              i = 0
              imageView.setImageResource(sampleDrawables[i])
              imageView.colorFilter = null
              i++
          } else {
              imageView.setImageResource(sampleDrawables[i])
              imageView.colorFilter = null

              i++
          }
          is ImageView -> {
              imageView.setColorFilter(ContextCompat.getColor(this, R.color.myColor))
              imageView.scaleType = scaleType.shuffled().take(1)[0]
          }

          else -> Toast.makeText(applicationContext, "Neither ImageView nor ImageButton", Toast.LENGTH_LONG).show()
      }
  }

}

• 在上面的代码中，我们创建了一个Drawables数组和一个ScaleType的ArrayList。

• 我们已经在Activity类上实现了View.OnClickListener，并在ImageView和ImageButton上都设置了OnClickListener。

• 多亏了Kotlin Android扩展，我们无需使用findViewById即可在我们的Kotlin活动中挂接XML ID。

• 我们使用了"何时"语句来检查单击以触发操作的视图的类型。

• 由于每个ImageButton都是一个ImageView，因此必须将ImageButton的情况保留在ImageView上方。
  如果将其保留在下面，则ImageButton单击侦听器将在when语句中触发ImageView块。

• 单击ImageButton时，我们在数组中的ImageView上设置下一个可绘制对象。

• 单击ImageView时，我们使用colorFiltersetter属性在ImageView上设置滤色器。
  同样，我们通过改组数组并获取第一个元素，在arrayList的ImageView上设置一个随机的scaleType。

应用输出

下面给出了上面应用程序的输出。

单击ImageView时，缩放比例类型会更改。

您可以从以下链接下载AndroidlyImageViewsButtons项目：AndroidIyImageViewsButtons

为了减小下载大小，我们删除了xxhdpi和xhdpi图像资源文件。
尝试使用Drawable Importer插件构建它们！