Android无需java代码，仅在xml中实现横向多个控件间隔分布

最新推荐文章于 2022-12-10 14:19:13 发布

zhilonng

最新推荐文章于 2022-12-10 14:19:13 发布

阅读量1.9k

点赞数 2

本文链接：https://blog.csdn.net/zhilonng/article/details/52137208

版权

实现思路可以理解为插空法。

先看看效果图：

实现思路主要分两步：

step 1 ：先将左右两个控件位置确定，我是使用一个framelayout将左右空间分布在最左和最右，当然如果你希望最左最右也有和中间一样的间隔，也可以实现，等理解了插空法思想，其实都一样

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:layout_marginTop="5dp"
    android:layout_marginLeft="10dp"
    android:layout_marginRight="10dp">
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <View
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:background="#9e9e9e"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:layout_gravity="center"
            android:text="1"
            android:textSize="10dp"
            android:layout_marginLeft="1dp"/>
    </LinearLayout>

    ……

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right"
        android:orientation="vertical">
        <View
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:layout_gravity="right"
            android:background="#9e9e9e"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="5dp"
            android:layout_gravity="center"
            android:text="4"
            android:textSize="10dp"
            android:layout_marginRight="1dp"/>
    </LinearLayout>
</FrameLayout>

step 2 ：将中间剩余空间用一个LinearLayout进行填充,生成三个正方形view,在每个正方形左右，各填充一个weight为1的space空间，即可实现：

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="right"
                android:layout_marginRight="60dp"
                android:layout_marginLeft="60dp"
                android:orientation="horizontal">
                <Space
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    tools:targetApi="ice_cream_sandwich" />
                <LinearLayout
                    android:layout_width="60dp"
                    android:layout_height="wrap_content"
                    android:orientation="vertical">
                    <View
                        android:layout_width="60dp"
                        android:layout_height="60dp"
                        android:background="#9e9e9e"
                        android:layout_gravity="center"/>
                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="5dp"
                        android:text="2"
                        android:textSize="10dp"
                        android:layout_gravity="center"/>
                </LinearLayout>
                <Space
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    tools:targetApi="ice_cream_sandwich" />
                <LinearLayout
                    android:layout_width="60dp"
                    android:layout_height="wrap_content"
                    android:orientation="vertical">
                    <View
                        android:layout_width="60dp"
                        android:layout_height="60dp"
                        android:background="#9e9e9e"
                        android:layout_gravity="center"/>
                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="5dp"
                        android:text="3"
                        android:textSize="10dp"
                        android:layout_gravity="center"/>
                </LinearLayout>
                <Space
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_weight="1"
                    tools:targetApi="ice_cream_sandwich" />
            </LinearLayout>

实现思路很简单，一开始采用代码控制间距，但这么做难免会对布局进行重绘，降低了应用性能，直接在xml布局文件中进行一次绘制，可以减少这样的弊端！