Android LinearLayout添加間隔(Divider)的正確姿勢

最優解

我們直接看最優解

		int width = 50;
		LinearLayout linearLayout = findViewById(R.id.ll_5_base);
		GradientDrawable drawable = new GradientDrawable();
        drawable.setSize(width,1);
        linearLayout.setDividerDrawable(drawable);
        linearLayout.setShowDividers(LinearLayout.SHOW_DIVIDER_MIDDLE);

如果你一下就看懂了，就可以X掉這個網頁了。如果想看看還有什麼別的方法，可以繼續往下看。

方案分析

在開發中我們有時候會遇到給LinearLayout的iitem添加間隔的問題，有一下幾種方案供選擇。

1. 給每個item添加margin或padding。這個方法的缺點非常明顯，如果要修改間隔則非常麻煩，而且item一旦設置了間隔則複用性不好，我也會爲這個方法給出優化方案來解決這個問題。
2. 在每一個item之間添加一個空白的view來頂起來，這個方法和LinearLayout提供的divider非常相似，LinearLayout給出的方法是在每個item之間添加一個Drawable，所以這個思路我們會根據官方的做法來解決。

這兩個方法優化之後其實效果都差不多，下面就來看代碼吧。

1.添加Margin和Padding最優解

這種方法只能添加空白的間隔，不能添加間隔線。代碼如下，看完代碼再分析。

首先定義好xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ll_5_base"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center">

    <Button
        android:id="@+id/bt_12345"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="12345" />

    <Button
        android:id="@+id/bt_12347"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="12347" />

    <Button
        android:id="@+id/bt_12346"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="12346" />

</LinearLayout>

我們再一個LinearLayout裏添加了3個Button，現在我們就用代碼來添加間隔

        LinearLayout linearLayout = findViewById(R.id.ll_5_base);        
				int llChildCount = linearLayout.getChildCount();
        int width = 50;
        LinearLayout.LayoutParams llParams;
        if (llChildCount > 1) {
            for (int i = 1; i < llChildCount; i++) {
                View view = linearLayout.getChildAt(i);
                llParams = (LinearLayout.LayoutParams) view.getLayoutParams();
                llParams.setMarginStart(width);
            }
        }

因爲所有的View都是繼承自View這個類的，所以我們把它們依次找到然後添加margin即可實現添加間隔的目的，要注意的一點是，動態addView的時候需要先添加LayoutParams然後再添加。

效果如下

2.使用LinearLayout的Divider來添加間隔最優解

LinearLayout提供了通過xml靜態添加Divider的方法，代碼如下

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ll_5_base"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:showDividers="middle"
    android:divider="@drawable/line"
    android:gravity="center">

showDivider提供了四種添加Divider的方式，大家看一下就會懂。Divider我使用shape寫了一個透明的佔位圖片，代碼如下

<shape android:shape="rectangle"
    xmlns:android="http://schemas.android.com/apk/res/android" >
    <size android:height="1dp" android:width="50dp"/>

</shape>

看效果

動態修改間隔大小方法如下

        LinearLayout linearLayout = findViewById(R.id.ll_5_base);
        Drawable drawable = 							             ResourcesCompat.getDrawable(getResources(),R.drawable.line,null);
        ((GradientDrawable) drawable).setSize(20,1);
        linearLayout.setDividerDrawable(drawable);
        linearLayout.setShowDividers(LinearLayout.SHOW_DIVIDER_MIDDLE);

這樣我們也可以做到動態修改間隔的目的。

最優解

我們無需新建任何文件，使用以下代碼即可。

		int width = 50;
		LinearLayout linearLayout = findViewById(R.id.ll_5_base);
		GradientDrawable drawable = new GradientDrawable();
        drawable.setSize(width,1);
        linearLayout.setDividerDrawable(drawable);
        linearLayout.setShowDividers(LinearLayout.SHOW_DIVIDER_MIDDLE);

這樣即可添加Divider，我一般都是使用這種方法。

總結

好啦，這就是Android LinearLayout添加間隔(Divider)的正確姿勢，希望你有所收穫。