Android Studio: ボタンクリックで画像の表示

実行時の画面

プロジェクトの作成

プロジェクト名: button03
Empty Views Activity を選びます。

環境設定

インターネットにアクセスできるようにします。

manifests/AndroidManifest.xml

（省略）
<uses-permission android:name="android.permission.INTERNET" />
（省略）

Coil を使う設定

app/build.gradle.kts

（省略）
dependencies {
    implementation("io.coil-kt:coil:2.4.0")
（省略）

画面

res/layout/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"
    tools:context=".MainActivity">


    <LinearLayout
        android:layout_width="409dp"
        android:layout_height="729dp"
        android:orientation="vertical"
        tools:layout_editor_absoluteX="1dp"
        tools:layout_editor_absoluteY="1dp">

        <TextView
            android:id="@+id/text_view"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="40sp"
            android:text="TextView" />

        <Button
            android:id="@+id/button_a"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="40sp"
            android:text="Button A" />

        <Button
            android:id="@+id/button_b"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="40sp"
            android:text="Button B" />

        <Button
            android:id="@+id/button_c"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="40sp"
            android:text="Button C" />

        <Button
            android:id="@+id/button_d"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="40sp"
            android:text="Button D" />

        <Button
            android:id="@+id/button_e"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textSize="40sp"
            android:text="Button E" />

<ImageView
        android:id="@+id/image_view"
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_gravity="center"
        android:background="#CCCCCC"/>

    </LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

プログラム

MainActivity.kt

package com.example.button03

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Button
import android.widget.ImageView
import android.widget.TextView
import coil.load

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

        val textMessage = findViewById<TextView>(R.id.text_view)

        val button_A = findViewById<Button>(R.id.button_a)
        val button_B = findViewById<Button>(R.id.button_b)
        val button_C = findViewById<Button>(R.id.button_c)
        val button_D = findViewById<Button>(R.id.button_d)
        val button_E = findViewById<Button>(R.id.button_e)

               val imageUrl = arrayOf(
            "https://www.city.fuji.shizuoka.jp/page/gazou/fmervo000001dsro-att/rn2ola000000lk6n.JPG"
,"https://www.city.fuji.shizuoka.jp/page/gazou/fmervo000001dsro-att/5000-21.jpg",
            "https://www.city.fuji.shizuoka.jp/page/gazou/fmervo000001dsro-att/fujikawa01b.jpg",
            "https://www.city.fuji.shizuoka.jp/page/gazou/fmervo000001dsro-att/rn2ola000000lk9d.JPG",
            "https://www.city.fuji.shizuoka.jp/page/gazou/fmervo000001dsro-att/rn2ola000000lko8.JPG")
        val timageView = findViewById<ImageView>(R.id.image_view)

        button_A.setOnClickListener{
            textMessage.setText("A is clicked")
            timageView.load(imageUrl[0])
        }

        button_B.setOnClickListener{
            textMessage.setText("B is clicked")
            timageView.load(imageUrl[1])
        }

        button_C.setOnClickListener{
            textMessage.setText("C is clicked")
            timageView.load(imageUrl[2])
        }

        button_D.setOnClickListener{
            textMessage.setText("D is clicked")
            timageView.load(imageUrl[3])
        }

        button_E.setOnClickListener{
            textMessage.setText("E is clicked")
            timageView.load(imageUrl[4])
        }
    }
}

実行

File -> Sync Project with Gradle Files

右三角をクリック

参考: SDK のバージョン

kts:app/build.gradle.kts

（省略）
android {
    namespace = "com.example.button03"
    compileSdk = 34

    defaultConfig {
        applicationId = "com.example.button03"
        minSdk = 26
        targetSdk = 34
        versionCode = 1
        versionName = "1.0"

        testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"
    }
（省略）