Question

我想有这个特定的设计：

enter image description here

文本＆＃34; A＆＃34;，＆＃34; B＆＃34;和＆＃34; C＆＃34;以中心为中心。

如果您要在xml中提出解决方案，我会提供200分。它必须由3个按钮组成。我不需要java中的逻辑。这可以让我自己，但我需要xml drawables和布局。

修改

请考虑向后兼容性和Android 5。

Answer 1

起初，我误解了你的问题。对我而言，您似乎需要一个布局，如您发布的图片所示。但是，在查看android-segmented-control库之后，很明显您正在寻找一个允许在A，B，C ...等之间切换的控件。库正在使用RadioGroup，这确实是最好的选择。

我注意到该库使用了负边距，我读过这些边缘会导致某些设备出现问题。还缺少对API 21的支持。

xml方法的工作原理：RadioGroup建立在LinearLayout之上。 LinearLayout的一个鲜为人知的特征（可能是因为它在大多数情况下不适合）是divider属性。如果使用android:showDividers="..."，LinearLayout将显示分隔符及其子项。显示这些分频器的位置取决于showDivider=".."的值。可能有三个值：middle，beginning＆amp; end。我们将使用middle来显示A和{}之间的分隔线。 B和B＆amp; C。

对于有线框架，我们不需要多个drawable（至少现在不是）。我们可以做到以下几点：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <stroke android:color="@color/stroke_color" android:width="@dimen/stroke_width"/>
    <corners android:radius="@dimen/corner_radius"/>
</shape>

上面的drawable将被设置为 RadioGroup的背景。 showDividers将处理A，B和＆amp;之间的垂直划分。 C。因此，我们的布局看起来与您现在发布的图片相同。好吧，对于showDividers，我们还需要提供divider drawable：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <solid android:color="@color/stroke_color"/>
    <size android:width="@dimen/stroke_width"/>
</shape>

现在，我们需要处理RadioButtons的活跃状态。鉴于圆角，我们需要编写3个不同的drawable：一个用于第一个孩子，一个用于中间，一个用于最后一个。这种方法是可扩展的 - 第一个和最后一个可绘制的保持相同，而每个孩子在第一个和第一个之间最后获得中间抽签。我已经创建了几个可以添加到项目中的要点：

API＆lt; 21 - 将它们放在res/drawable ：

中

RadioGroup background

RadioGroup divider

RadioButton background for first child

RadioButton background for middle child

RadioButton background for last child

API＆gt; = 21 - 将其放在res/drawable-v21 中：

RadioButton background for first child

RadioButton background for middle child

RadioButton background for last child

资源 - 包含已定义的颜色，尺寸和样式 - 您可以将此文件放在res/values中，也可以将每种资源类型复制粘贴到相应的文件中：

Resources

最后，这是一个示例xml布局，显示了定义的样式如何实现这一点：

Sample

对API级别的行动＆lt; 21：

pre_lollipop.mp4

在API 21上采取行动：

lollipop.mp4

Answer 2

你需要两种不同的形状，一种是左边的圆角

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
 <solid android:color="@color/your_color"/>
    <corners
     android:topLeftRadius="0dp"
     android:bottomLeftRadius="0dp"
  android:topLeftRadius="15dp"
  android:topRightRadius="15dp"/>
</shape>

右边有一个圆角的

 <?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
 <solid android:color="@color/your_color"/>
    <corners
     android:topRightRadius="0dp"
    android:bottomRightRadius
  android:topLeftRadius="15dp"
  android:topRightRadius="15dp"/>
</shape>

作为按钮的背景。您可以在水平LinearLayout上排列三个按钮。要赋予三个相同的宽度，请添加layout_width="0dp"和layout_weight="1"。

Answer 3

您需要创建三个xml drawables

shape_left.xml：

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

    <corners
        android:bottomLeftRadius="5dp"
        android:topLeftRadius="5dp"/>

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

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

</shape>

shape_middle.xml：

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

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

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

</shape>

shape_right.xml：

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

    <corners
        android:bottomRightRadius="5dp"
        android:topRightRadius="5dp"/>

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

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

</shape>

布局：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:tools="http://schemas.android.com/tools"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:paddingLeft="@dimen/activity_horizontal_margin"
                android:paddingRight="@dimen/activity_horizontal_margin"
                android:paddingTop="@dimen/activity_vertical_margin"
                android:paddingBottom="@dimen/activity_vertical_margin"
                android:orientation="horizontal"
                tools:context=".MainActivity">

    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="@drawable/drawable_left"/>

    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="@drawable/shape_middle"/>

    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="@drawable/shape_right"/>

</LinearLayout>

请注意，对于Android 5.0中的按钮，它可能会出现一些问题。但你可以把它作为任何视图的背景。

我在Android 5.0上进行了测试，但它确实有效。添加透明色（可以是任何颜色）以支持旧版本。对于Android 4.0以下的版本，您需要创建一个文件夹drawable-v14并将这些形状放在那里。在普通的drawable文件夹中，你应该放置相同的形状，但是你应该使用bottomRightRadius而不是bottomLeftRadius。 shape_right也是如此。这是因为一个错误导致底角转错的错误。

特定按钮布局

3 个答案: