Help us understand the problem. What is going on with this article?

Kotlinで始めるAndroidアプリ入門(中編)

More than 1 year has passed since last update.

前編に引き続きKotlinでAndroidアプリを作ってみます。

最初の画面で入力した文字列を、2つ目の画面に渡すアプリになります。まずは最初の画面を作ります。

レイアウトエディタを開く

左のプロジェクトウィンドウから、app > res > layout > activity_main.xml を選択します。

もし、XMLが表示されていたら、下のタブでデザインを選択します。

青いアイコンをクリックし、「Blueprint」を選択します。

settingLayout.png

最初の画面を作る

最初の画面は、テキストボックスとボタンが一つずつある画面です。

デフォルトで設定されている「Hello World!」が表示されているTextViewは削除してください。右クリックして、削除を選択します。

deleteHelloWorld.png

まずは、テキストボックスを追加します。
左のパレットウィンドウで Text > PlaneText を選択し、画面へドラッグ&ドロップします。
createTextBox.png

次にボタンを追加します。
左のパレットウィンドウで Button > Button を選択し、画面へドラッグ&ドロップします。
createButton.png

UI文字列を変更する

青いアイコンをクリックし、「デザインを」選択します。
テキストボックスには「Name」、ボタンには「BUTTON」という文字列が表示されていることがわかります。これを変更しましょう。
designMode.png

文字列をハードコピーしてもよいのですが、ここではXMLで管理します。XMLで管理すると、ローカライズなどが簡単にできるようになります。

左のProjectウィンドウから、app > res > values > strings.xml を開きます。上部の「エディターを開く」をクリックします。
openXML.png

テキストボックスに表示する文字列を設定します。「+」ボタンをクリックし、
 キー: edit_message
 値:Enter a message
と入力します。
textKey.png

次に、ボタンに表示する文字列を設定します。同じく「+」ボタンをクリックし、
 キー: button_send
 値:Send
と入力します。
buttonKey.png

設定したビューと文字列を紐つけましょう。
まず、上部のタブバーから「activity_main.xml」をクリックします。
テキストボックスをクリックし、右の属性で「テキスト」を空にします。次に「hint」の横の「…」をクリックします。
setTextMessage.png

ダイアログで「edit_message」をダブルクリックします。
chooseMessage.png

同様に、ボタンをクリックし、「テキスト」の横の「…」をクリックします。
setButtonMessage.png

ダイアログで「button_send」をダブルクリックします。
chooseButtonMessage.png

これで最初の画面の設定はおしまいです。ビューの制約やサイズの設定もできますが、ここでは割愛します。詳しくは公式ガイドをご覧ください。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした