Android 入門チュートリアル | ImageView 画像表示

アプリのインターフェースをより美しく鮮やかにするために、写真を追加できます。展示写真は「必要なだけ」です。本であれ、新聞であれ、ウェブサイトであれ、写真を表示する必要があります。結局のところ、「写真のない真実はない」のです。Androidアプリ開発では、画像を表示するためによく使いますImageView。

ImageView の主なプロパティ

ImageViewの使用法

ImageView は、画像を表示するためによく使用されます。たとえば、ドローアブル内の画像リソースを直接表示します。ImageView は Drawable オブジェクトを表示します。

src と backGround の違い

レイアウト XML で、まず src と backGround の違いを見てみましょう。

backGroundこれは View の背景であり (ImageView は View のサブクラスです)、ビュー全体をカバーするように画像を拡大します。
srcこれは ImageView のプロパティであり、表示する画像リソースを受け入れます。

以降の表現を容易にするために、最初にImageViewのスタイルを指定し、サイズを統一します。別のデフォルトの背景色を設定します。

<style name="IvDemo1">
    <item name="android:layout_width">100dp</item>
    <item name="android:layout_height">80dp</item>
    <item name="android:background">#929292</item>
    <item name="android:layout_marginTop">4dp</item>
</style>

画像をドローアブルディレクトリに追加します。画像の幅と高さの比率はスタイル設定とは異なります。映像効果を確認するのに便利です。

サンプル XML で、src と backGround の違いを示します。

<ImageView
    style="@style/IvDemo1"
    android:background="@drawable/pic_2_robots" />

<ImageView
    style="@style/IvDemo1"
    android:layout_marginStart="20dp"
    android:src="@drawable/pic_2_robots" />

効果：

左側は背景として設定されており、画像が ImageView 全体をカバーするように引き伸ばされていることがわかります。そして写真は少し歪んでいます。これは、画像の幅と長さの比率が ImageView の幅と長さの比率と一致しないためです。

右側に src を設定すると、画像が完全に覆われていないことがわかります。右図の表示方法が次に紹介するscaleTypeです。

scaleType、画像表示方法

src を設定した後、scaleType を設定することで画像の表示効果を決定できます。

 <ImageView
    style="@style/IvDemo1"
    android:scaleType="fitXY"
    android:src="@drawable/pic_2_robots" />

実際、Drawable 内のリソースを使用することに加えて、src はミップマップも使用できます。

<ImageView
    style="@style/IvDemo1"
    android:layout_marginStart="20dp"
    android:scaleType="center"
    android:src="@mipmap/ic_launcher" />

スケールタイプの値:

フィットスタート
フィットセンター
フィットエンド
フィットXY
中心
センタークロップ
中央内側
マトリックス

「fit」という単語を使用すると、画像の内容全体が表示されます。fitStart，fitCenter，fitEnd画像は元の縦横比で表示されます。指定した方向に絵が近づいていきます。fitXY は、ImageView 全体をカバーするように画像を引き伸ばします。

center，centerCrop，centerInside彼らはできるだけ写真の中央部分を見せようとします。

center は画像を拡大縮小しません。画像が ImageView より大きい場合は、画像の中央部分が表示されます。
centerCrop は、画像の中央部分をできるだけ多く表示します。
centerInside では、表示のために画像を中央に配置し、ImageView を埋めようとしません。

matrix画像を ImageView の左上隅に広げ、画像を拡大縮小しないでください。

画像の透明度、アルファを設定します

値を設定すると、alphaImageView 全体の透明度を変更できます。

 <ImageView
    style="@style/IvDemo1"
    android:layout_marginStart="20dp"
    android:alpha="0.9"
    android:scaleType="fitCenter"
    android:src="@drawable/pic_2_robots" />

例：

最後にもう一度シェアします

[Tencent 技術チーム制作] Android をゼロから始めてマスターする、Android Studio インストールチュートリアル + Android 基本チュートリアルのフルセット

Androidプログラミング入門チュートリアル

入門から慣れるまでの Java 言語の基礎

ここに画像の説明を挿入します

Kotlin 言語の基礎から入門まで

ここに画像の説明を挿入します

初心者から使い慣れたものまでの Android テクノロジースタック

ここに画像の説明を挿入します

Android Jetpack についての総合的な学習

ここに画像の説明を挿入します

初心者にとって、Android Studio のインストールは難しいかもしれません。次のビデオを見て、インストール方法と実行方法を段階的に学習できます。

Android Studioのインストールチュートリアル

ここに画像の説明を挿入します

Java の学習段階では、この段階ではビデオ学習に重点を置き、書籍を確認して穴埋めすることで補うことをお勧めします。書籍を中心に学習する場合は、書籍の説明に基づいてコードを入力し、指導ビデオで補足して抜け漏れを確認し、穴埋めすることができます。問題が発生した場合は、Baidu にアクセスすると、初級レベルの問題に遭遇した場合でも、より適切な回答が得られることが多いです。

4 つの主要コンポーネントの使用方法、Service の作成方法、レイアウト方法、簡単なカスタム View、アニメーション、ネットワーク通信、その他の一般的な技術などの基本的な知識を習得する必要があります。

ゼロベースのチュートリアルの完全なセットが用意されています。必要な場合は、以下の QR コードを追加して無料で入手できます。