下記の記事で、画面レイアウトを行うのに便利な「デザインモード」についてご紹介させて頂きました。
次は、基本となる「ビューグループ(レイアウト部品)」の使い方を覚えていきましょう。
事前準備
新規プロジェクトで、出てくる「Hello Worldアプリ」があることを前提に説明させていただきます。
まだ、新規プロジェクトを作成されていない方は、下記の記事を参考に「空のプロジェクト」を作成してください。
「空のプロジェクト」を作成したら「デザインモード」を開いて、「Component Tree」の中の「TextView」(Hello World!と表示されている部分)を消しておきます。
これで事前準備は完了です。
LinerLayout(horizontal)
まずは、「LinerLayOut(horizontal)です。このレイアウトを使うと、画面部品を横一列に並べて配置ができます。
現状、「Hello Worldアプリ」では、「ConstraintLayout」と表示されているので、「Convert view」をクリックします。
「LinearLayout」→「Apply」をクリックします。
「LinearLayout(horizontal)」と表示が変わりました。(デフォルトだと、Verticalではなく、horizontalとなるようです。)
後は、適当にButtnをドラック&ドロップすると、下記のようにボタンが横に水平に並べることができます。
LinerLayout(Vertical)
LinerLayout(Vertical)は、画面部品を縦一列に並べて配置ができます。
一旦「Linearlayout(horizontal)」を選択して、「LinearLayout」→「Convert orientation to vertical」を選択します。
LinearLayut(vertical)になっていることを確認できます。
下記のように、縦にボタンレイアウトができています。
TableLayout
「TableLayout」は、表形式で画面部品を配置できます。
「TableLayout」は、直接はレイアウトとして置けませんので、「LinearLayout(vertical)」の上にドラッグ&ドロップします。
Tablelayoutの中には、「TableRow」というレイアウト部品が出来ているので、その中に以下のように部品をドラッグ&ドロップすると、表形式で部品を並べることができます。
FrameLayout
FrameLayoutは、画面部品を重ねて配置ができるレイアウトです。
下記の例では、「Button」と「text」を重ねて配置しています。
ConstraintLayout
「ConstraintLayout」は、画面部品を相対的に配置することができるレイアウトです。
下記のように、部品のマージンの数値をいじることで、相対的な位置に自由に配置をすることができます。(Hello Worldアプリのデフォルトもこのレイアウトでしたよね。)
文言の出し方
Androidアプリは、基本的に画面で使う文言は、string.xmlファイルに外出しするようにするとは、下記の記事で解説させて頂きました。
では、具体的にどのように記入していけばよいか実装してみましょう。
実際にやってみる。
まず、編集していくファイルとしては、Androidアプリの「values/strings.xml」になります。
まずは、サンプルアプリとして、下記のように、「LinearLayout」の下に、「textView部品」を配置しましょう。
まだ、配置しただけでは、下記のように「TextView」と表示されてしまっていて、何のパーツかわからない状態になっています。
まずは、直接値を入力してみる。
まずは、直接値を入力してみましょう。「TextView」をクリックして、Attributeにある「text」にためしに、「検索したい文言を入力してください。」と入力すると値が入りました。
ただ、このままでは固定値の管理として、微妙な感じがしますし、何よりAndroid的にも推奨されていません。
固定値を外出しして書く
下記のように、strings.xmlを選択し、検索したい文言のタグを書きます。
name属性は、必須になります。
textには、「@string/(name属性で設定した値)」と入力します。
固定値がtextViewに埋め込まれました。
この記事へのコメントはありません。