【AndroidStudio】 LinearLayout

■layoutの組み方コード

■LinearLayout
子要素を縦・横の一列に並べるレイアウトである。android:orientation属性にvertical, horizontalを指定することでそれぞれ縦、横に並べることができる。

書き方 使い方
緑の場所にLinearLayoutを記入
始めの場所に
android:orientation="vertical"を記入
これで要素が縦に並ぶ。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

</LinearLayout>

■BUttonを4つ縦に並べてみる。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

   <Button
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="Button"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"/>

</LinearLayout>

下記画像のようになる。

■幅

■①wrap_content
中身の要素の幅に合わせる。

■②match_parent
親要素の幅に合わせる。

■③任意の数に合わせる。

上記の契約を使いlayoutを組んでみる

    //①wrap_content
    <Button
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:text="Button"/>

    //②match_parent
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Button"/>

    //③任意の数に合わせる。
    <Button
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:text="Button"/>

下記画像のようになる。

■余白

■android:layout_margin
外側の余白
■android:padding
内側の余白

 <Button
       android:layout_width="wrap_content"
       android:layout_margin="80dp"
       android:layout_height="wrap_content"
       android:text="Button"/>

    <Button
        android:layout_width="wrap_content"
        android:padding="40dp"
        android:layout_height="wrap_content"
        android:text="Button"/>

もちろんtopやrightなどに絞って使う事もできる.

■割合

■android:layout_weight
縦or横の全体の面積を割合で割り当てる。
android:layout_weight = "1"
など

 <Button
       android:layout_width="wrap_content"
       android:layout_height="0dp"
       android:layout_weight="1"
       android:text="Button"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:text="Button"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:text="Button"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:text="Button"/>

下記画像のようになる。

■gravity 位置決め

■android:gravity
中の要素の場所を決める。

■android:layout_gravity
親要素に合わせて動く

 <Button
       android:layout_width="300dp"
       android:layout_height="300dp"
      　//中身の要素　真ん中の下
       android:gravity="center|bottom"
       android:text="Button"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        //親要素右端
        android:layout_gravity="right"
        android:text="Button"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        //親要素の終わり
        android:layout_gravity="end"
        android:text="Button"/>