Android Kotlin基礎講座 02.2: ユーザー対話型にする

タスク：文字入力用のEditTextを追加する

このタスクでは、ユーザーがニックネームを入力するためのEditTextビューというインプットフィールドを追加していきます。

ステップ1：プロジェクトを始める

1. 33前回の記事で作成したAboutMeアプリが準備できていない場合は、次のリンクからスターターコードをダウンロードしてください。こちらのコードは前回の記事で作成したコードと同じものになります。
   
2. Android Studioで前回の記事で作成したアプリ、または1でダウンロードしたプロジェクトを開いてください。
   
3. アプリを起動してください。名前のテキストビュー、星の画像、スクロールビュー内の長いテキストが表示されます。
   
   
   
   ユーザーがテキストを一切変更できないことを確認してください。

文字を入力することができるなど、ユーザー対話型にすることでアプリはより魅力的なものになります。Androidでは文字入力を受け付けるためのUIとしてエディットテキストというウィジェットを提供しています。TextViewのサブクラスであるEditTextクラスを用いたエディットテキストを定義します。下の画像のように、エディットテキストはユーザーに文字の入力と修正をできるようにします。

ステップ2：EditTextを追加する

1. Android Studioでactivity_main.xmlを開き、Designタブにしてください。
   
2. パレット上のTextをクリックしてください。
   
   
   
   Ab TextViewがText要素のリストのトップに表示されています。
   Ab TextViewの下にいくつかのEditTextビューに分類されるビューがあります。
   
   パレット上のTextViewのアイコン画像のAbには下線が引かれていません。一方で、EditTextのアイコンはAbに下線が引かれています。下線はそのビューが編集可能であることを示しています。
   
   それぞれのEditTextビューに異なる属性が設定されており、Androidシステムはスクリーンキーボードのような適切なインプットソフトウェアを表示します。
   
3. PlainTextエディットテキストをコンポーネントツリーにドラッグし、name_textの下、star_imageの上に配置してください。
   
   
4. 下の表のようにアトリビュートパネルからEditTextビューの属性を設定してください。

属性	値
id	nickname_edit
layout_width	match_parent (デフォルト)
layout_height	wrap_content (デフォルト)

5. アプリを起動してください。星の画像の上に、デフォルトでは”Name”と表示されているエディットテキストがあります。