如何创建具有渐变背景的圆角按钮？

Question

如何创建这样的按钮：

创建圆角按钮或具有渐变背景按钮是一回事，但同时使用它们又是另一回事！我知道这是可能的，因为我在几个应用程序中看到过这种按钮，但无法创建它。

有什么帮助吗？ !!!

button_round_radius_test 代码：

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



    <corners
        android:radius="20dp" />

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

    <stroke
        android:color="#FFFFFF"
        android:width="2dp" />


    <size
        android:width="165dp"
        android:height="40dp" />

</shape>

gradient_bg 代码：

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <gradient
        android:angle="90"
        android:endColor="#ff009f"
        android:startColor="#1a2b5d"
        android:type="linear" />

</shape>

用法：

<ImageButton
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="#TestText"
                    android:padding="8dp"
                    android:layout_marginTop="5dp"
                    android:layout_marginLeft="5dp"
                    android:layout_marginRight="5dp"
                    android:layout_marginBottom="5dp"
                    android:textColor="@color/font_black"
                    android:src="@drawable/gradient_bg"
                    android:background="@drawable/button_round_radius_test"
                    />

Answer 1

创建 drawable 并在 button

的后台设置

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <corners android:radius="@dimen/_20sdp" />

    <gradient android:startColor="@color/ThemeColor"
        android:endColor="@color/ThemeColor"
        android:centerColor="@color/ThemeColor"/>

</shape>

Answer 2

试试这个

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <gradient
                android:angle="90"
                android:endColor="#ff009f"
                android:startColor="#1a2b5d"
                android:type="linear" />
            <stroke android:color="@android:color/transparent" android:width="2dp" />
            <corners android:radius="25dp"/>
        </shape>
    </item>
</selector>

这样使用

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">


    <Button
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:text="#TestText"
        android:padding="8dp"
        android:gravity="center"
        android:textColor="#FFFFFF"
        android:textStyle="bold"
        android:layout_marginTop="5dp"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="5dp"
        android:layout_marginBottom="5dp"
        android:background="@drawable/test"
        />

</LinearLayout>

输出

Answer 3

试试这个

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


<stroke
    android:width="2dp"
    android:color="#FFFFFF" />

<size
    android:width="165dp"
    android:height="40dp" />

<gradient
    android:angle="90"
    android:endColor="#ff009f"
    android:startColor="#1a2b5d"
    android:type="linear" />
</shape>

如何创建具有渐变背景的圆角按钮？

How to create round corner buttons with gradient background?

android

android-button