icon
icon

Androidアプリ開発のLinearLayoutの使い方【初心者向け】

Androidアプリ開発におけるレイアウトのうち【LinearLayout】の使い方について初心者向けに解説した記事。パーツを縦一列もしくは横一列に並べる場合に使用するレイアウトです。2種類あるので、どちらも紹介します。

テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元:GMOリサーチ株式会社 調査期間:2021年8月12日~8月16日  調査対象:2020年8月以降にプログラミングスクールを受講した18~80歳の男女1,000名  調査手法:インターネット調査

Androidアプリ開発では、アプリの画面を簡単に作成できるレイアウトが用意されています。

今回はそのなかの1つである、LinearLayout(リニアレイアウト)を追加する方法と基本的な使い方をご紹介します。

 

本記事はTechAcademyのAndroidアプリ開発オンラインブートキャンプの内容をもとに解説しています。

 

大石ゆかり

田島メンター!!Androidアプリでパーツを1列に並べたいんですけど、どうしたらいいんですか〜?

田島悠介

いくつか方法はあるけど、1列に並べたいだけならLinearLayoutはどうかな?

大石ゆかり

どうやって使うんですか〜?

 

LinearLayoutとは

LinearLayoutとは、パーツを縦一列もしくは横一列に並べる場合に使用するレイアウトです。

Eclpseで開発をする場合、LinearLayoutは縦一列に並べるLinearLayout(Vertical)と横一列に並べるLinearLayout(Horizontal)の2種類が用意されています。

 

 

LinearLayoutを配置する

今回は、LinearLayoutを使用して画像のような画面を作成してみます。

レイアウトは入れ子にして使用することができます。この例では、赤枠で表したLinearLayout(Vertical)に、青枠で表した3つのLinearLayout(Horizontal)が入れ子になって配置されています。

 

LinearLayout(Vertical)を配置します。

LinearLayout(Vertical)はレイアウトエディタのパレットの「レイアウト」から配置できます。パレット内のLinearLayout(Vertical)を、プレビュー画面までドラッグしましょう。

 

次に、同様にLinearLayout(Horizontal)を3回プレビュー画面までドラッグして配置します。

アウトラインで、レイアウトが正しく配置されているか確認をしましょう。

 

LinearLayoutにパーツを配置する

LinearLayoutにパーツを配置するには、レイアウトエディタのパレットから配置したいパーツを選択し、プレビュー画面へドラッグします。

もしも配置したいレイアウト以外の場所に配置をしてしまった場合は、プレビュー画面に配置されたパーツをドラッグするか、アウトラインに表示されているパーツをドラッグして移動しましょう。

 

3行目のボタンのように、LinearLayoutに配置されたパーツを中央寄せで表示したい場合は、レイアウトを選択し、プロパティの「Gravity」の値を「center_horizontal」に変更します。

 

起動をして、画面を確認します。

配置はこれで完了です。

 

 

[PR] Androidアプリの開発で挫折しない学習方法を動画で公開中

LinearLayoutのコードを確認する

最後にコードを確認してみましょう。

XMLタブでコードを確認すると、下記のようになっています。LinearLayoutが入れ子になっていることがわかると思います。

<LinearLayout xmlns:android=”http://schemas.android.com/apk/res/android”
android:layout_width=”match_parent”
android:layout_height=”match_parent”
android:orientation=”vertical” >
<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content” >
<TextView
android:id=”@+id/textView1″
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”名前” />
<EditText
android:id=”@+id/editText1″
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_weight=”1″
android:ems=”10″ >
<requestFocus />
</EditText>
</LinearLayout>
<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content” >
<TextView
android:id=”@+id/textView2″
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_weight=”1″
android:text=”コメント” />
<EditText
android:id=”@+id/editText2″
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:layout_weight=”1″
android:ems=”10″ />
</LinearLayout>
<LinearLayout
android:layout_width=”match_parent”
android:layout_height=”wrap_content”
android:gravity=”center_horizontal” >
<Button
android:id=”@+id/button1″
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”送信” />
<Button
android:id=”@+id/button2″
android:layout_width=”wrap_content”
android:layout_height=”wrap_content”
android:text=”リセット” />
</LinearLayout>
</LinearLayout>

今回は以上です。

 

他のレイアウトも試したい場合はRelativeLayoutの使い方も合わせてご覧ください。

 

大石ゆかり

簡単に1列に並べられるんですね〜♪

田島悠介

そうだね。縦でも横でも並べられるから、使う場面がとても多いレイアウトの一つだね。

大石ゆかり

そうですね〜♪

 

[お知らせ]TechAcademyでは初心者でもオリジナルアプリが作れるAndroidアプリ開発講座(オンラインブートキャンプ)を開催しています。自分でアプリを公開してみたい場合はご参加ください。

初心者・未経験でもできる。まずはテックアカデミーに相談しよう

プログラミングを独学で学習していて、このように感じた経験はないでしょうか?

  • ・調べてもほしい情報が見つからない
  • ・独学のスキルが実際の業務で通用するのか不安
  • ・目標への学習プランがわからず、迷子になりそう

テックアカデミーでは、このような 学習に不安を抱えている方へ、マンツーマンで相談できる機会を無料で提供 しています。
30分間、オンラインでどんなことでも質問し放題です。

「受けてよかった」と感じていただけるよう カウンセラーやエンジニア・デザイナー があなたの相談に真摯に向き合います。

「自分に合っているか診断してほしい」
「漠然としているが話を聞いてみたい」

こんなささいな悩みでも大丈夫です。

無理な勧誘は一切ありません ので、まずはお気軽にご参加ください。
※体験用のカリキュラムも無料で配布いたします。(1週間限定)

今なら参加者限定の割引特典付き! 無料相談を予約する