[Android] ImageView 画像を表示させる３つの方法

アプリで画像を表示させるにはImageViewを使います。画像表示には色々方法がありますが、下のような３つの設定方法について試してみたいと思います。
　

レイアウトに直接

imgeview 03 - [Android] ImageView 画像を表示させる３つの方法

drawableから読込

imgeview 04 - [Android] ImageView 画像を表示させる３つの方法

assetsから取込

Android Studio 3.2
Android 9.0

ImageView

　
画像はボタンなどと違って静的なUIとして、例えば背景やあるいは何かを説明する画像などとして使うことが多いでしょう。
　
ここでは３種類の表示方法を取り上げてみます。尚、画像を後から変えたり、サイズの変更などImageView画像を拡大縮小など動的に扱うこともできます。
　
画像はdrawableにコピー＆ペーストします。下は例として
– img_1.jpg
– img_2.jpg
をdrawableに入れています。
また、img_3.jpgのようにassetsフォルダを作って大きな画像を入れることもできます。
　

　

目次
1.レイアウトに直接埋め込むケース
2.drawable にある画像を読み込む
3.assets に画像を置きそれを取り込む場合
4.drawable VS assets
5.Picasso ライブラリー

レイアウトに直接埋め込むケース

　
これは、最初からレイアウトに書き込んでしまうものです。
　
drawable に img_1.jpg を入れた状態で、レイアウトファイル activity_main.xml には以下のように記述します。
また、レイアウトはデフォルトのConstraintLayoutを使ってますが、RelativeLayoutやLinearLayoutでも簡単に作成できます。
　
activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ImageView
        android:src="@drawable/img_1"
        android:scaleType="centerCrop"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:contentDescription="@string/img_description1"/>

</android.support.constraint.ConstraintLayout>

<?xml version="1.0" encoding="utf-8"?>

<android.support.constraint.ConstraintLayout

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity">

<ImageView

android:src="@drawable/img_1"

android:scaleType="centerCrop"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:contentDescription="@string/img_description1"/>

</android.support.constraint.ConstraintLayout>

　
リソースファイルですが、contentDescriptionを入れろというワーニングに対応しただけです。この画像の説明を入れるわけですが、なくても大丈夫ではあります。
res¥values¥strings.xml

<resources>
    ...
    <string name="img_description1">image1</string>
</resources>

...

<string name="img_description1">image1</string>

</resources>

　
以上の設定で画像が表示されました。
　

　
設定内容をみてみると、
　

android:src="@drawable/img_1"

1	android:src="@drawable/img_1"

　
ここでdrawableにある画像 img_1 を表示する source として定義しています。
（jpg, pngの拡張子はいりません）
　

android:layout_width="match_parent"
android:layout_height="match_parent"

1 2	android:layout_width="match_parent" android:layout_height="match_parent"

　
画面の縦横一杯の領域で画像を表示する設定ですが、実際の画像ピクセルと表示領域は必ずしも合ってはいません。scaleTypeは centerCrop を使うと画面に合うように拡大縮小してくれます。
　

android:scaleType="centerCrop"

1	android:scaleType="centerCrop"

　
この場合では、MainActivity.java になにも記述する必要はありません。

drawable にある画像を読み込む

　
上と同様に画像 img_2.jpg は同じく drawableにあるとして、そのIDコードを

findViewById

で呼びだし setImageResource(ID) で表示します。
コードで画像を呼び出しているので動的に画像の変更ができます。
　

//ImageView imageView2 = (ImageView)findViewById(R.id.image_view_2);
ImageView imageView2 = findViewById(R.id.image_view_2);
imageView2.setImageResource(R.drawable.img_2);

//ImageView imageView2 = (ImageView)findViewById(R.id.image_view_2);

ImageView imageView2 = findViewById(R.id.image_view_2);

imageView2.setImageResource(R.drawable.img_2);

　
レイアウトは、MainActivityで呼ばれるIDに対応させます

android:id=”@+id/image_view_2″
　

    <ImageView
        android:id="@+id/image_view_2"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

<ImageView

android:id="@+id/image_view_2"

android:layout_width="match_parent"

android:layout_height="match_parent" />

　
まとめるとこうなります
MainActivity.java

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {

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

        ImageView imageView2 = findViewById(R.id.image_view_2);
        imageView2.setImageResource(R.drawable.img_2);

    }
}

import android.support.v7.app.AppCompatActivity;

import android.os.Bundle;

import android.widget.ImageView;

public class MainActivity extends AppCompatActivity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

ImageView imageView2 = findViewById(R.id.image_view_2);

imageView2.setImageResource(R.drawable.img_2);

}

　
activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ImageView
        android:id="@+id/image_view_2"
        android:scaleType="centerCrop"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:contentDescription="@string/img_description2" />

</android.support.constraint.ConstraintLayout>

<?xml version="1.0" encoding="utf-8"?>

<android.support.constraint.ConstraintLayout

xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

tools:context=".MainActivity">

<ImageView

android:id="@+id/image_view_2"

android:scaleType="centerCrop"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:contentDescription="@string/img_description2" />

</android.support.constraint.ConstraintLayout>

　
リソースファイルです
res¥values¥strings.xml

<resources>
    ...
    <string name="img_description2">image2</string>
</resources>

...

<string name="img_description2">image2</string>

</resources>