Android 自定义Button

最新推荐文章于 2021-05-25 15:35:30 发布

原创最新推荐文章于 2021-05-25 15:35:30 发布 · 331 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#android #button

移动端专栏收录该内容

27 篇文章

订阅专栏

本文详细介绍如何在Android中使用XML资源文件定制按钮样式，包括普通、圆角、描边、渐变及圆形按钮的设计方法，展示了如何调整颜色、边框和圆角等属性。

Youtube地址：https://www.youtube.com/watch?v=nlPtfncjOWA

效果图：

（效果是android studio的preview效果，其中stroke按钮中间是透明的，而不是灰色。）

btn_normal.xml

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

btn_round.xml

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

btn_stroke.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke
        android:color="#E20951"
        android:width="1dp" />
    <corners android:radius="10dp" />
</shape>

btn_gradient.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:startColor="#2AF598"
        android:endColor="#009EFD" />
    <corners android:radius="10dp" />
</shape>

btn_circle.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient android:startColor="#2AF598" android:endColor="#009EFD"/>
    <corners android:radius="999dp" />
</shape>

activity_buttons.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical"
    tools:context=".buttons.ButtonsActivity">

    <Button
        android:id="@+id/button"
        android:layout_width="200dp"
        android:layout_height="60dp"
        android:background="@drawable/btn_normal"
        android:text="Button"
        android:textAllCaps="false"
        android:textColor="#FFF"
        android:textSize="20sp" />

    <Button
        android:id="@+id/button2"
        android:layout_width="200dp"
        android:layout_height="60dp"
        android:layout_marginTop="10dp"
        android:background="@drawable/btn_round"
        android:text="Round"
        android:textAllCaps="false"
        android:textColor="#FFF"
        android:textSize="20sp" />


    <Button
        android:id="@+id/button3"
        android:layout_width="200dp"
        android:layout_height="60dp"
        android:layout_marginTop="10dp"
        android:background="@drawable/btn_stroke"
        android:text="Stroke"
        android:textAllCaps="false"
        android:textColor="#E20951"
        android:textSize="20sp" />


    <Button
        android:id="@+id/button4"
        android:layout_width="200dp"
        android:layout_height="60dp"
        android:layout_marginTop="10dp"
        android:background="@drawable/btn_gradient"
        android:text="Gradient"
        android:textAllCaps="false"
        android:textColor="#FFF"
        android:textSize="20sp" />

    <Button
        android:id="@+id/button5"
        android:layout_width="88dp"
        android:layout_height="88dp"
        android:layout_marginTop="10dp"
        android:background="@drawable/btn_circle"
        android:text="GO"
        android:textColor="#FFF"
        android:textSize="20sp" />


</LinearLayout>