Button中使用颜色控制按钮点击时的形状和颜色

傷城~ 2022-08-09 17:59 192阅读 0赞

现在的手机app界面做的很是漂亮，这些主要是美工做的图片加上摆放的位置很合适，如果我们开发时没有美工来做图片，也可以通过代码，实现简单的效果，如：颜色、圆角等。小例子如下：

##     ##

## 一、通过加载图片实现，点击按钮，改变图片、颜色等状态 ##

activity\_main.xml中的代码：

res下drawable文件夹下btn\_select.xml中的代码：

<?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
    
        <item android:drawable="@drawable/btn_check_on_normal" android:state_pressed="true"></item>
        <item android:drawable="@drawable/stop" android:state_enabled="false"></item>
        <item android:drawable="@drawable/btn_check_off_normal"></item>
    
    </selector>

[项目中使用到的图片资源下载][Link 1]

MainActivity.java中的代码：

package com.test.buttondemo;
    
    import android.app.Activity;
    import android.os.Bundle;
    import android.view.View;
    import android.view.View.OnClickListener;
    import android.widget.Button;
    
    public class MainActivity extends Activity {
    
    	private Button selected, startId;
    
    	@Override
    	protected void onCreate(Bundle savedInstanceState) {
    		super.onCreate(savedInstanceState);
    		setContentView(R.layout.activity_main);
    
    		selected = (Button) findViewById(R.id.selectId);
    		startId = (Button) findViewById(R.id.startId);
    
    		startId.setOnClickListener(new OnClickListener() {
    
    			@Override
    			public void onClick(View v) {
    				// TODO Auto-generated method stub
    				if (startId.getText().toString().equals("启用状态")) {
    					selected.setEnabled(false);
    					selected.setText("不可使用");
    					
    					startId.setText("关闭状态");
    				} else {
    					selected.setEnabled(true);
    					selected.setText("可以使用");
    					startId.setText("启用状态");
    				}
    			}
    		});
    	}
    
    }

效果图：

![Center][]

## 二、将加载图片的地方改成使用代码实现 ##

res下drawable文件夹下btn\_select.xml中引用图片的属性android:drawable=“”改为使用代码实现，代码如下：

<?xml version="1.0" encoding="utf-8"?>  
    <selector xmlns:android="http://schemas.android.com/apk/res/android">  
      
        <item android:state_pressed="true">  
            <shape>  
                <solid android:color="#FFBBFF" />  
                <stroke android:width="1dp" android:color="#ffd43f3a" />  
                <corners android:radius="10dp" />  
            </shape>  
        </item>  
        <item android:state_enabled="false">  
            <shape>  
                <solid android:color="#a5d43f3a" />  
                <stroke android:width="1dp" android:color="#a5d43f3a" />  
                <corners android:radius="10dp" />  
            </shape>  
        </item>  
        <item>  
            <shape>  
                <solid android:color="#ffd9534f" />  
                <stroke android:width="1dp" android:color="#ffd43f3a" />  
                <corners android:radius="10dp" />  
            </shape>  
        </item>  
      
    </selector>

activity\_main.xml和MainActivity.java中的代码不变。

效果图如下：

![Center 1][]

## 说明： ##

shape用于设定形状，可以在selector，layout等里面使用，有6个子标签，各属性如下：  
  
corners:圆角，属性android:Radius="20dp" 设置四个角的半径  
solid：填充，设置填充的颜色  
stroke：描边：dashWidth和dashGap属性，只要其中一个设置为0dp，则边框为实现边框  
gradient：渐变  
padding：间隔，设置四个方向上的间隔  
size：大小，设置大小

[Link 1]: http://download.csdn.net/detail/u011159417/9239159
[Center]: /images/20220731/9891ee433b3844c5a2955ea3fea92a48.png
[Center 1]: /images/20220731/bbe22fa97474440ea9ae53a04e02bcc2.png