前回は、表示した文字(TextView)を変更する実装をやりました。今回は、テキストボックス(入力部品)を画面に追加する方法を学びます。
余談
Android Studioを立ち上げてLayoutEditorを開いてみると、黒くなっている時があります。
これは、リビルドすると治りました。
TextView
前回までの実装では下のようになっています。
これにテキストボックス(EditText)を追加します。
上記のリンク先にサンプルコード(XML)があるのでそいつをコピーしてきます。
<EditText
android:id="@+id/plain_text_input"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:inputType="text"/>
そして、すでに実装しているTextViewの下にコードを追記します。
参考にするサイトはAndroidデベロッパのガイドです。
ここにはLayoutEditorの開き方が載っていて、とてもわかりやすいです。
しかし、エラーが出ました。「This view is not Constrained ...」という内容でした。
結局のところは「レイアウトのポジション指定をしないと変な場所にコンポーネント(画面の部品)が表示されます。」という内容のエラーでした。
そんなわけで、ポジションを指定します。
<EditText
android:id="@+id/editText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10"
android:inputType="textPersonName"
android:text="Name"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
tools:layout_editor_absoluteX="222dp"
tools:layout_editor_absoluteY="684dp" />
これでエラーは解消できましたが、指定したポジションがおかしいので、左下に移動してしまいました。
なので、これを適当な場所に移動します。今回は、はじめに表示した「プログラミングで遊ぼう！」の文言の下に配置したいので、こちら(まとめ)かこちら(AndroidDeveloppers)を参考にXMLにコードを追加します。
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toTopOf="@+id/textView"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
ポイントとしては、上下左右のポジションが確定するようにプロパティを指定してやらないとエラー(警告？)がAndroid Studioから出されます。
これでとりあえずは、以下のように表示できました。
動かしてみた動画は下です。
でわでわ。。。
