對齊在SIGNE線3個按鈕，每個按鈕都有不同的邊框

Question

下午好，

我做誰在下面的圖片中需要3個按鈕的TabLayout下對齊，喜歡的應用：

我不知道做什麼是最好的方法，因爲每個人都有不同的邊界。

任何人都可以幫到我嗎？ 謝謝！

---

我終於做到了：

buttons.xml

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="horizontal" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:layout_weight="1" 
    android:gravity="center_horizontal" 
    android:layout_marginLeft="18sp" 
    android:layout_marginRight="18sp"> 

    <Button 
     style="?android:textAppearanceSmall" 
     android:layout_width="wrap_content" 
     android:layout_height="31sp" 
     android:id="@+id/one" 
     android:text="ONE" 
     android:textColor="@color/red" 
     android:layout_weight="1" 
     android:background="@drawable/button_shape_one" /> 

    <Button 
     style="?android:textAppearanceSmall" 
     android:layout_width="wrap_content" 
     android:layout_height="31sp" 
     android:id="@+id/two" 
     android:text="TWO" 
     android:textColor="@color/red" 
     android:layout_weight="1" 
     android:background="@drawable/button_shape_two"/> 

    <Button 
     style="?android:textAppearanceSmall" 
     android:layout_width="wrap_content" 
     android:layout_height="31sp" 
     android:id="@+id/three" 
     android:text="THREE" 
     android:textColor="@color/red" 
     android:layout_weight="1" 
     android:background="@drawable/button_shape_three"/> 

</LinearLayout> 

button_shape_one.xml

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 

    <solid android:color="@color/transparent"/> 

    <stroke android:width="1dp" 
     android:color="@color/red" 
     /> 

    <corners android:bottomRightRadius="0dp" 
     android:bottomLeftRadius="5dp" 
     android:topLeftRadius="5dp" 
     android:topRightRadius="0dp"/> 
</shape> 

button_shape_two.xml

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 
    <item 
     android:bottom="0dp" 
     android:left="-2dp" 
     android:right="-2dp" 
     android:top="0dp"> 
     <shape android:shape="rectangle" > 
      <stroke 
       android:width="1dp" 
       android:color="@color/red" /> 

      <solid android:color="@color/transparent" /> 

      <padding android:left="10dp" 
       android:right="10dp" 
       android:top="5dp" 
       android:bottom="5dp" /> 
     </shape> 
    </item> 

</layer-list> 

button_shape_three.xml

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 

    <solid android:color="@color/transparent"/> 

    <stroke android:width="1dp" 
     android:color="@color/red" 
     /> 

    <corners android:bottomRightRadius="5dp" 
     android:bottomLeftRadius="0dp" 
     android:topLeftRadius="0dp" 
     android:topRightRadius="5dp"/> 
</shape> 

結果：

謝謝大家！

Answer 1

您需要爲所有按鈕創建一個Shape drawable。例如中心按鈕可以使用下面的drawable作爲背景。

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
    <solid android:color="#606060"/> 
    <stroke android:color="#303030" android:width="2dp" /> 
</shape> 

對於其他兩種則需要圓滑的邊緣僅在左，right.For，你可以跟隨This崗位上SO。

*注意：根據您的需要更改顏色，您還需要在每個按鈕上應用選擇器以突出顯示選擇。 也可以使用可繪製的形狀去除左右邊框。有關詳細信息，請參閱This post

更容易的方法將是使用This Library.

Answer 2

設置寬度爲「0dp」和重量爲「1」的所有的按鈕和將它們包裝在水平的LinearLayout內

Answer 3

在抽拉

?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 

<solid android:color="#ffffffff"/>  

<stroke android:width="3dp" 
    android:color="#ff000000" 
    /> 

<corners android:bottomRightRadius="7dp" 
    android:bottomLeftRadius="7dp" 
    android:topLeftRadius="7dp" 
    android:topRightRadius="7dp"/> 
</shape> 

編輯roundedbuttons.xml形狀根據自己的喜好

在你的XML佈局

LinearLayout(Horizontal) 
- Buttons with background(roundedbuttons.xml) and weight="1" 

Answer 4

你爲什麼不使用帶有藍色邊框作爲3個textViews背景家長一個線性佈局。沒有必要使它變得複雜。