APP按键美化之圆角按键

新建按钮样式文件

在这里插入图片描述

正常状态 (btn_normal)

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

    <!-- 圆角的半径 -->
    <corners android:radius="30dp"/>

    <!-- 填充颜色 -->
    <solid android:color="#00ff00"/>

</shape>

按下状态(btn_pressed)

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

    <!-- 圆角的半径 -->
    <corners android:radius="30dp"/>

    <!-- 填充颜色 -->
    <solid android:color="#0662f5"/>

</shape>

再新建一个 (btn_selector)

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

    <!-- 正常状态 -->
    <item android:drawable="@drawable/btn_normal" android:state_pressed="false"/>

    <!-- 按下状态 -->
    <item android:drawable="@drawable/btn_pressed" android:state_pressed="true"/>

</selector>

使用按钮样式

android:background="@drawable/btn_selector"

结合前面所学知识,制作一个简单界面

<RelativeLayout 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:background="@drawable/bg_shopping_menu"
    tools:context=".MainActivity" >
    
    <ImageView 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/pic_rf"
        android:layout_centerInParent="true"
        />
    <ImageView 
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/card"
        android:layout_centerInParent="true"
        android:paddingLeft="120dp"
        />
	<Button 
	    android:layout_width="wrap_content"
	    android:layout_height="wrap_content"
	    android:background="@drawable/btn_selector"
	    android:text="刷卡"
	    android:layout_centerHorizontal="true"
	    android:layout_alignParentBottom="true"
	    android:layout_marginBottom="30dp"
	    />

	<RelativeLayout
	    android:layout_width="match_parent"
	    android:layout_height="wrap_content"
	    android:layout_alignParentLeft="true"
	    android:layout_alignParentTop="true"
	    android:background="#00ff00" >

	    <TextView
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:layout_marginLeft="15dp"
	        android:layout_marginTop="14dp"
	        android:text="智能家居" 
	        android:textSize="20dp"
	        />
	    <Button 
	        android:id="@+id/zhuce"
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:text="注册"
	        android:layout_alignParentRight="true"
	        android:layout_marginRight="20dp"
	        />
	    <Button 
	        android:layout_width="wrap_content"
	        android:layout_height="wrap_content"
	        android:text="查询信息"
	        android:layout_toLeftOf="@id/zhuce"
	        />
	</RelativeLayout>

</RelativeLayout>

正常状态

在这里插入图片描述

按下状态

在这里插入图片描述

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值