38
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

エニプラAdvent Calendar 2023

Day 7

【AndroidStudio】viewについて

Last updated at Posted at 2023-12-06

目的

本記事は私が学んだことについての備忘録です。
今回はviewについてまとめていきます。

目次

viewとは
viewの種類
viewの表示・非表示の切り替え
おわりに
参考にさせていただいたサイト

viewとは

Layout内に配置する画面部品のことです。
xmlファイルに記述して静的に追加したり、Activityから動的に追加したりできます。
前回の記事でLayoutについてまとめていますので気になる方はよろしければご覧ください。

viewの種類

ここからは利用頻度の高いviewをピックアップして紹介していきます。

TextView

名前の通りテキスト、つまり文字列を表示できるviewです。
1行で横にひたすら表示したり、複数行で分けて表示することが可能です。
singleLineという属性をtrueにすると1行で表示できます。
また、表示できる範囲よりも文字数が多かった場合は
「...」のような3点リーダーで省略表示も可能です。
文字のどこを省略するかもellipsizeという属性で選択することができます。
※marqueeはTextViewにフォーカスがあたった場合スクロールされる

ellipsizeの設定値 省略箇所 表示形式
none 省略なし   abcdefg
start 先頭を省略 ...cdefg
middle 中央を省略 ab...efg
end 最後を省略 abcde...
marquee スクロール 文字が流れるように
表示される

EditText

テキストの入力ができるviewです。
EditTextに入力された文字をもとに
TextViewなどに反映させるなど使用用途は多岐にわたります。
入力されたテキストを取得するにはActivity内で
下記のように記述すると取得することが出来ます。

MainActivity.kt
val txt: String = binding.editText.Text.toString()

例のコードではViewBindingを用いた書き方になります。
ViewBindingについてはまた別の機会にまとめたいと思います。
分からない方は調べてみてくださいね。
findViewByIdでも取得したいviewのidの値をeditTextの箇所に入れることで
同じくテキストを取得することが出来ます。

また、文字を入力する前の状態のとき半透明の文字を表示させられます。
これはhint属性で文字を設定することで表示できます。
文字を入力すると半透明の文字は非表示になります。
数字.png

Button

名前のままですがボタンを表示するviewです。
特定条件下で押下できないようにすることも可能です。
タップできないようにするコードは下記の通りです。
こちらもViewBindingを用いた書き方です。

MainActivity.kt
binding.button.isEnabled = false

isEnabledをfalseにするとボタンを押下することが出来なくなり、
文字の色がグレーになります。
trueにすると再び押下することが可能になり、文字の色も元通りになります。
また以下の画像のようにボタンに表示するテキストを指定することもできます。
スクリーンショット 2023-11-16 023231.png

ImageView

画像を表示するviewです。
drawableに予め入れておいた画像を表示することができます。
ちなみにdrawableは以下の画像の赤枠の箇所のことを指します。
適当に作ったプロジェクトなので画像が入っていませんが・・・
スクリーンショット 2023-11-16 023356.png

drawableでサポートされていないBitmap形式の画像や
処理の途中で受け取ったdrawableに入っていない画像などは
コード内で動的に画像を設定すれば表示することができます。
大体の画像は表示することができるためとても重宝します。

Spinner

ドロップダウンリストを表示するviewです。
ドロップダウンリストとは以下の画像のようなものです。
spinner.png

画像をお借りしたサイト

利用するには設定したい値のarrayListを作成してArrayAdapterから設定する必要があります。
adapterを生成する際リスト内容・選択肢のレイアウトを変更することが可能です。
また、Activity内にドロップダウンリストの何を選択したかを伝えるOnItemSelectedListenerの実装も必要です。
xmlから表示モードの変更も可能でドロップダウンリストをダイアログ形式で表示することが出来ます。
spinnerMode属性にdialogを設定すると変更することが出来ます。

RecyclerView

リストを表示するviewです。
ずら~っとデータを並べて表示したい場合に利用されます。
こんな感じで表示できます。
kotlin_recyclerview_sh_3.png

画像をお借りしたサイト

利用するには1つのデータを表示する時のレイアウトファイルを用意したり、
Adapterを用意してRecyclerViewに設定したり、
用意したAdapter内にViewHolderを継承したクラスを用意する必要があります。
今回他に紹介したviewと比べると複雑で、初心者からすると難しい感じがします。
ですがAndroidアプリを開発するにあたってかなり高確率で利用することになるくらい
扱えると便利なviewですので慣れて損はしないと思います。
かくいう筆者もぼんやりとしか理解していないのでまだまだ扱い切れていませんが・・・

筆者には細かい説明はまだできないため、
詳細が知りたい方は是非調べてみてください。

viewの表示・非表示の切り替え

先ほど紹介したviewなどをxmlファイルやAcitivity内などで追加したのはいいけど
特定の条件下で表示させたいもしくは非表示にさせたいといったことがあると思います。
そんな時は用途に合わせてviewのvisibility属性に以下の値をセットします。

visibilityの設定値 表示形式 どうしたい時に使うか
visible 何も指定しない場合の初期値。
普通に表示される
viewを表示したい時
invisible そのviewの存在は消えないが
見た目は非表示
viewの場所を開けたまま
非表示にしたい時
gone そのviewの存在自体を
非表示扱いにする
viewの場所を詰めて
非表示にしたい時

言葉で書いてあってもしっくりこないと思うので画像で説明します。
こんな感じです。
無題.png

画像ではBUTTON2と書かれているButtonのvisibility属性を変更しています。
invisibleではBUTTON2の分のスペースは空いていますが、
goneではBUTTON2の分のスペースは空いていませんね。

おわりに

前回と同じく直接触れて分かったことなどをまとめてみました。
記事をもっとわかりやすく上手にまとめられるよう
今後も記事の投稿を行って改善していきたいです。
最後まで閲覧いただきありがとうございました。🙇‍♀️

参考にさせていただいたサイト

TextViewの省略表示について
EditTextのhint属性について
drawableでサポートされている画像形式
ImageViewの動的設定
Spinnerについて1
Spinnerについて2
RecyclerViewについて1
RecyclerViewについて2

38
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
38
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?