如何设置两种颜色的边框按钮

Question

我正在尝试为具有两种颜色 white 和 black 的 Button 创建边框。所以我决定创建一个形状。我尝试添加白色和黑色的渐变我的代码不起作用

我想要这样的边框：

我的 xml :

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

    <item>
        <shape android:shape="rectangle" >
            <gradient
                android:angle="360"
                android:centerColor="#000000"
                android:endColor="#bfbfbf"
                android:gradientRadius="360"
                android:startColor="#ffffff"
                android:type="sweep" />

            <stroke
                android:width="2dp"
                android:color="#ffffff" />
        </shape>
    </item>
    <item
        android:bottom="4dp"
        android:left="4dp"
        android:right="4dp"
        android:top="4dp">
        <shape android:shape="rectangle" >
            <solid android:color="#d2d2d2" />
        </shape>
    </item>

</layer-list>

和 buttn :

<Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="OK"
            android:background="@drawable/border"
            android:layout_alignBottom="@+id/progress"
            android:layout_centerHorizontal="true"
            android:id="@+id/okbtn" />

Answer 1

请在此处查看有关创建可绘制形状的信息http://developer.android.com/guide/topics/resources/drawable-resource.html#Shape

完成此操作后，在 XML 中为您的按钮设置 android:background="@drawable/your_button_border"

Answer 2

这似乎是使用 9-patch image 的好地方。任何基于常规 .png 文件、<shape> 或 <vector> 的解决方案最终都会缩放按钮的白色和黑色边框。

创建 button.9.png 文件后，您可以使用 android:background="@drawable/button".

将其设置为按钮的背景

编辑

这是基于您链接的 .png 文件的 9 补丁：

Answer 3

button_background.xml

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

    <item>
        <shape android:shape="rectangle">
            <stroke
                android:width="@dimen/stroke_width_outer"
                android:color="#000" />
        </shape>
    </item>

    <item
        android:bottom="@dimen/stroke_width_outer"
        android:right="@dimen/stroke_width_outer">
        <shape android:shape="rectangle">
            <stroke
                android:width="@dimen/stroke_width_outer"
                android:color="#FFF" />
        </shape>
    </item>

    <item
        android:bottom="@dimen/stroke_width_outer"
        android:left="@dimen/stroke_width_outer"
        android:right="@dimen/stroke_width_outer"
        android:top="@dimen/stroke_width_outer">
        <shape android:shape="rectangle">
            <stroke
                android:width="@dimen/stroke_width_outer"
                android:color="#7F7F7F" />
        </shape>
    </item>

    <item
        android:bottom="@dimen/stroke_width_inner"
        android:left="@dimen/stroke_width_outer"
        android:right="@dimen/stroke_width_inner"
        android:top="@dimen/stroke_width_outer">
        <shape android:shape="rectangle">
            <stroke
                android:width="@dimen/stroke_width_outer"
                android:color="#DFDFDF" />
        </shape>
    </item>

    <item
        android:bottom="@dimen/stroke_width_inner"
        android:left="@dimen/stroke_width_inner"
        android:right="@dimen/stroke_width_inner"
        android:top="@dimen/stroke_width_inner">
        <shape android:shape="rectangle">
            <solid android:color="#BFBFBF" />
        </shape>
    </item>

</layer-list>

values/dimen.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <dimen name="stroke_width_outer">3dp</dimen>
    <dimen name="stroke_width_inner">6dp</dimen>
</resources>

stroke_width_inner 应该是 stroke_width_outer 的两倍总是

为按钮应用背景 -

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/button_background"
    android:text="OK"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

在布局编辑器上 -

在设备上 -

在设备上，您不会看到在布局编辑器中看到的灰色左边框和上边框

如何设置两种颜色的边框按钮

how to set border button with 2 colors

xml

android

border

colors

button

编辑