Android基础#24-1：Android UI-使用LinearLayout或RelativeLayout让三个控件居中平均排列

例1:  水平居中：

LinearLayout有边距，在LinearLayout中，左中右居中显示三个TextView。

效果图：

xml代码：

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="@color/black"
    >
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="100dp"。   //高度固定100dp
        android:orientation="horizontal"。//横向
        android:layout_margin="30dp"
        android:background="#FFBB86FC"
        >
        <TextView
            android:id="@+id/textview_left"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="10"
            android:text="left"
            android:gravity="center_vertical"
            >
        </TextView>

        <TextView
            android:id="@+id/textview_mid"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="10"
            android:text="middle"
            android:gravity="center_vertical"
            >
        </TextView>
        <TextView
            android:id="@+id/textview_right"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="10"
            android:text="right"
            android:gravity="center_vertical"
            >
        </TextView>
    </LinearLayout>

</LinearLayout>

 说明：

宽度要和父布局一致，即layout_width设置为match_parent；

使用android:gravity和android:layout_weight让控件水平居中显示;

分别设置三个TextView的text属性值为“left”，“middle”，“right”；

三个TextView控件都设置layout_weight属性，并且它们的值都相等，说明平均分配窗口；

例2: 垂直居中：

使用android:gravity和android:layout_weight让控件居中显示。

效果图：

 xml代码：

只需要修改例子1中的LinearLayout的几个属性即可：

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent" //铺满
        android:layout_margin="30dp"
        android:orientation="vertical"。 //纵向
        android:background="#FFBB86FC"

 仅仅需要设置layout的属性orientation为vertical就可以了。

例3: RelativeLayout实现左中右排列，模拟app的标题栏。

效果图：

xml代码：

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="@color/black"
    >
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="100dp"
        android:layout_margin="30dp"
        android:orientation="horizontal"
        android:background="#FFBB86FC"
        >
        <TextView
            android:id="@+id/textview_left"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="10"
            android:text="left"
            android:gravity="left"
            android:layout_centerVertical="true"

            >
        </TextView>

        <TextView
            android:id="@+id/textview_mid"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="10"
            android:text="middle"
            android:gravity="center"
            android:layout_centerVertical="true"
            >
        </TextView>
        <TextView
            android:id="@+id/textview_right"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="10"
            android:text="right"
            android:gravity="right"
            android:layout_centerVertical="true"
            >
        </TextView>
    </RelativeLayout>

</LinearLayout>

分析：

顶层的LinearLayout内部嵌套了RelativeLayout，三个TextView的父布局都是这个RelativeLayout；

android:layout_centerVertical="true"： 控件垂直居中排列。

---