Android基础#10: Layout经典布局--layout中的控件左右平均分布，使用LinearLayout实现

爱被打了一巴掌 2023-10-16 21:56 4阅读 0赞

优雅的设计好你的布局-----箴言-----

**内容简介：**

在实际开发中，经常需要将控件进行水平平均分配，本篇介绍用LinearLayout来实现水平平均。

下面是一个典型的布局文件：

**（1）水平平分，在顶部显示：**

默认情况下，Layout是在父的layout的顶部。

效果图1：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpcmFua2U_size_16_color_FFFFFF_t_70][]

代码如下：

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        >
    
    
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="左"></Button>
    
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="中"></Button>
    
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="右"></Button>
    
    
    </LinearLayout>

**（2）水平平分，在竖直居中显示：**

只需要在layout中加上android:gravity="center\_vertical"，即可。

效果图2：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpcmFua2U_size_16_color_FFFFFF_t_70 1][]

代码如下：

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center_vertical"
        >
    
    
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="左"></Button>
    
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="中"></Button>
    
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="右"></Button>
    
    
    </LinearLayout>

**（3）水平平分，在竖直在底部显示：**

只需要在layout中加上android:gravity="center\_vertical"，即可。

效果图如下：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpcmFua2U_size_16_color_FFFFFF_t_70 2][]

代码如下：

<?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="bottom"
        >
    
    
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="左"></Button>
    
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="中"></Button>
    
        <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="右"></Button>
    
    
    </LinearLayout>

说明：  
android:orientation：水平还是垂直。  
android:gravity：在布局中的顶部，居中，还是底部显示。

android:layout\_width：控件宽度。  
android:layout\_height：控件高度。  
android:layout\_weight：控件所占权重，例如，3个全是1，说明三个控件的权重是一样的，就实现了平均分配。

--------------------

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpcmFua2U_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20210312193249458.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpcmFua2U=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpcmFua2U_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20210312193357626.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpcmFua2U=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpcmFua2U_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/202103121935106.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2xpcmFua2U=,size_16,color_FFFFFF,t_70