Android--自定义Button的样式以及动态渐变效果

本文介绍了如何在Android中自定义Button的样式,包括使用drawable文件创建静态样式,以及实现动态渐变效果。通过创建自定义drawable资源文件custombutton.xml,设置选择器内容,详细阐述了自定义Button的过程。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

       之前开发使用过自定义样式的Button,使用挺简单的,但也很常用,因此总结一下。

      1,使用drawable文件自定义静态的Button样式

首先,自定义一个drawable文件custombutton.xml:

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

 <!-- 边框颜色值-->  
 <item>
    <shape>
          <!--圆角 -->
          <corners android:radius="20dp"></corners>
          <!--边框颜色-->
          <solid android:color="#fff"></solid>
    </shape> 
</item>
    <!-- 主题背景颜色值--> 
<item android:bottom="1dp" android:right="1dp" android:top="1dp" android:left="1dp"><!--设置四个边框(根据需要选择对应边框)-->
    <shape> 
       <gradient android:centerX="0.5" android:centerY="0.5" /><!--与底层的垂直距离(阴影的效果)-->
       <padding android:left="2dp" android:top="2dp" android:right="2dp android:bottom="2dp" />
       <!-- 圆角 --> 
       <corners android:radius="20dp"/>
       <solid android:color="ffffff"/><!--设置button的边框里内容的背景色-->
    </shape> 
</item>
</layer-list>
然后在xml布局文件中:

<Button
    android:layout_width="wrap_content"
    style="?android:attr/borderlessButtonStyle"
    android:layout_height="wrap_content"
    android:background="@drawable/custombutton"
    android:text="这是测试按钮"/>
如果添加下边这一句会去掉Button的默认底色,只留下文字,我们使用自定义的话不需要添加这一句,只需要给Button的背景添加我们自定义的custombutton。
style="?android:attr/borderlessButtonStyle


       2,Button实现动态渐变效果

先写一个选择器内容是:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <!-- 定义当button 处于pressed 状态时的形态。-->
        <shape>
            <gradient android:startColor="#8600ff" /><!--内容实现渐变-->
            <stroke android:width="2dp" android:color="#000000" /><!--边框宽度和颜色-->
            <corners android:radius="5dp" /><!--圆弧半径-->
            <padding android:left="10dp" android:top="10dp"
                android:bottom="10dp" android:right="10dp" />
        </shape>
    </item>
    <item android:state_focused="true">
        <!-- 定义当button获得focus时的形态-->
        <shape>
            <gradient android:endColor="#eac100" />
            <stroke android:width="2dp" android:color="#333333"  />
            <corners android:radius="8dp" />
            <padding android:left="10dp" android:top="10dp"
                android:bottom="10dp" android:right="10dp" />
        </shape>
    </item>
</selector>
为button添加选择器,布局文件:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    tools:context="com.a51ckck.custombutton.MainActivity">
    <TextView
        android:id="@+id/tv_main_show"
        android:background="#f0f000"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="你好习哥!!"
        android:textColor="#ff0000"
        android:gravity="center"
         />
    <Button
        android:id="@+id/bt_main_click"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="click"
        android:background="@drawable/dynamic"
        android:text="点击按钮"
        android:layout_centerInParent="true"
       />
</RelativeLayout>
最后需要在Activity中为Button添加焦点:

public class MainActivity extends AppCompatActivity {

    private TextView mTextView;
    private Button mButton;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mTextView= (TextView) findViewById(R.id.tv_main_show);
        mButton= (Button) findViewById(R.id.bt_main_click);
        setData();
    }

    private void setData() {
        mButton.setFocusable(true);
        mButton.setFocusableInTouchMode(true);
        mButton.requestFocus();
        mButton.requestFocusFromTouch();
    }

    public void click(View view) {
        if(view!=null){
            mTextView.setText("你好彭嫂!!!");
        }
    }
}
虽然不复杂,但是确是常使用的,所以掌握它是非常有必要的,最终来看一下效果图:


        














评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值