[Android]如何創建一個View的分割線


 buttons-with-separators3 

 

   如何創建一個View的分割線,如上圖

   我們見介紹三種可以創建看起來很不錯的view的分割線,如在button之間添加分割線。

 

    這個例子是將為LinearLayout內的三個Button間添加分割線。

     這三個例子可能容易實現,相信會有更好的實現辦法。

buttons-with-separators3 

 

1 人工添加LinearLayout的分割線

 

 

我們可以創建一個View,這個View就是分割線,只要簡單在Button之間添加這個分割線就可以。

分割線的實現,如下:

 

<View

 android:layout_height="fill_parent"

 android:layout_width="1dp"

 android:background="#90909090"

 android:layout_marginBottom="5dp"

 android:layout_marginTop="5dp"

/>

  

 
        

So the whole layout, as pictured, becomes:

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:adjustViewBounds="true"
    android:orientation="horizontal">
 
    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        style="?android:attr/buttonBarButtonStyle"
        android:text="Yes"
        android:layout_weight="1"
        android:id="@+id/button1"
        android:textColor="#00b0e4" />
 
    <View android:layout_height="fill_parent"
        android:layout_width="1px"
        android:background="#90909090"
        android:layout_marginBottom="5dp"
        android:layout_marginTop="5dp"
        android:id="@+id/separator1" />
 
    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        style="?android:attr/buttonBarButtonStyle"
        android:text="No"
        android:layout_weight="1"
        android:id="@+id/button2"
        android:textColor="#00b0e4" />
 
    <View android:layout_height="fill_parent"
        android:layout_width="1px"
        android:background="#90909090"
        android:layout_marginBottom="5dp"
        android:layout_marginTop="5dp"
        android:id="@+id/separator2" />
 
    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        style="?android:attr/buttonBarButtonStyle"
        android:text="Neutral"
        android:layout_weight="1"
        android:id="@+id/button3"
        android:textColor="#00b0e4" />
 
</LinearLayout>

  

 

2 在LinearLayout定義divider

你可以給LinearLayout設置a view divider,這很明顯是個很好的解決方法,尤其是不知道LinearLayout下有多少個子Button。

這種必須是在API level 11 或者更高的API版本使用。

我們先定義這個分割線樣式吧:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
 <size android:width="1dp" />
 <solid android:color="#90909090" />
</shape> 

  

把這個分割線的樣式設置給LinearLayout:

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:adjustViewBounds="true"
    android:divider="@drawable/separator"
    android:showDividers="middle"
    android:orientation="horizontal">
 
    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        style="?android:attr/buttonBarButtonStyle"
        android:text="Yes"
        android:layout_weight="1"
        android:id="@+id/button1"
        android:textColor="#00b0e4" />
 
    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        style="?android:attr/buttonBarButtonStyle"
        android:text="No"
        android:layout_weight="1"
        android:id="@+id/button2"
        android:textColor="#00b0e4" />
 
    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        style="?android:attr/buttonBarButtonStyle"
        android:text="Neutral"
        android:layout_weight="1"
        android:id="@+id/button3"
        android:textColor="#00b0e4" />
 
</LinearLayout>

  

其中最重要當然就是:

android:divider="@drawable/separator"
android:showDividers="middle" 

3給容器組件設置ButtonBarStyle (默認是分割線,最容易實現方法)

 

As danialgoodwin mentioned in the comments, adding the buttonBarStyle to the LinearLayout will show default separators.  This is also for api level 11 or higher only.

The important part here, is adding this line to the LinearLayout:

<LinearLayout
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    style="?android:buttonBarStyle"
    android:dividerPadding="15dp"
    >
 
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="New Button"
        android:id="@+id/button1"
        android:layout_gravity="center_vertical" />
 
    <!-- more buttons/views -->
     
</LinearLayout>

  

You can also adjust the paddings of the view separators with the “dividerPadding” setting.

 

 

 

Button使用的相同的檢舉,所以他們之間的間距也是相同的。

當然你可為分割線設置漸變色。

原文 :http://envyandroid.com/archives/1193/view-separators


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM