本文介绍Button控件。
点击查看"Button示例源码"。
1. Button基本使用
基本的Button定义大致如下:
<Button
android:id="@+id/bt_simple"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="12sp"
android:text="@string/bt_simple" />
1.2 Button事件的响应
有三种方法去处理Button响应事件。
1.2.1 在资源文件中声明
可以在Button的资源文件中通过"android:onClick"属性来指定Button的点击方法,然后再在Button所属的Activity或Fragment中实现该方法。
下面是"在资源文件中定义andriod:onClick"的示例:
<Button
android:id="@+id/bt_send"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/bt_send"
android:onClick="sendMessage"
android:textSize="12sp" />
下面是在Activity中实现的sendMessage()示例:
public void sendMessage(View v) {
Toast.makeText(this, "send message!", Toast.LENGTH_SHORT).show();
}
1.2.2 通过匿名内部类实现onClick监听事件
该方法是在获取Button对象之后,匿名实现View.OnClickListener接口,并将它作为Button对象的监听处理事件。
mBtnPost = (Button)findViewById(R.id.bt_post);
mBtnPost.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(getApplicationContext(), "post message!", Toast.LENGTH_SHORT).show();
}
});
1.2.3 通过Activity实现onClick监听事件
该方法是Button所属的类直接实现View.OnClickListener接口,然后将该类作为Button对象的监听处理事件。
public class ButtonTest extends Activity
implements View.OnClickListener {
private Button mBtnTransmit;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
mBtnTransmit = (Button)findViewById(R.id.bt_transmit);
mBtnTransmit.setOnClickListener(this);
...
}
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.bt_transmit:
Toast.makeText(this, "transmit message!", Toast.LENGTH_LONG).show();
break;
default:
break;
}
}
...
}
2. 自定义Button样式
2.1 使用Android系统自带的Button样式
在定义Button时,使用android自带的Button样式。如下所示:
<Button
android:id="@+id/bt_style"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/bt_style"
style="?android:attr/borderlessButtonStyle"
android:textSize="12sp" />
说明:上面是创建一个无边框按钮。需要在Button所属的Activity或Application中声明android:theme="@android:style/Theme.Holo"属性才有效!
2.2 通过图片自定义Button背景图
首先,在定义Button时,通过"android:background"属性指定Button的背景图。
<Button
android:id="@+id/bt_sync"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/bt_sync"
android:background="@drawable/button_custom"
android:textSize="12sp"
/>
说明:android:background="@drawable/button_custom",这意味着按钮的背景是drawable下的button_custom文件。下面是button_custom.xml的内容。
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Android系统在处理下面的状态时,是按照它们定义的先后顺序进行处理的 -->
<!-- 按钮按下 -->
<item android:drawable="@drawable/ic_sync_red"
android:state_pressed="true" />
<!-- 按钮获取焦点 -->
<item android:drawable="@drawable/ic_sync_green"
android:state_focused="true" />
<!-- 默认 -->
<item android:drawable="@drawable/ic_sync_grey" />
</selector>
说明:需要注意的是,系统会根据状态定义的先后顺序对这些状态进行处理!ic_sync_red.png, ic_sync_green.png, ic_sync_grey.png是drawable目录下的三种图片。
2.3 通过shape自定义Button背景图
第一步和上面一样。首先,在定义Button时,通过"android:background"属性指定Button的背景图。
<Button
android:id="@+id/bt_diy"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/bt_diy"
android:background="@drawable/button_style1"
android:textSize="12sp" />
接着,实现button_style1.xml。它的内容如下:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 按下的效果 -->
<item android:state_pressed="true">
<shape>
<!-- gradient表示渐变,startColor是起始色,endColor是结束色,
type是线性渐变类型(默认类型),angle是渐变角度 -->
<gradient android:startColor="#0e3264" android:endColor="#225193"
android:type="linear" android:angle="270" />
<!-- stroke是边缘颜色,width表示边缘宽度,color是边缘颜色 -->
<!-- stroke可用于实现边缘模糊,反光等效果 -->
<stroke android:width="2dip" android:color="#062249" />
<!-- corner是四个圆角的大小 -->
<corners android:radius="5dp" />
<!-- padding是按钮文字和边缘的距离 -->
<padding android:left="10dp" android:top="10dp"
android:right="10dp" android:bottom="10dp" />
</shape>
</item>
<!--获取焦点的效果 -->
<item android:state_focused="true">
<shape>
<gradient android:startColor="#053b47" android:endColor="#146a7c"
android:angle="270" />
<stroke android:width="1dip" android:color="#02272f" />
<corners android:radius="5dp" />
<padding android:left="10dp" android:top="10dp"
android:right="10dp" android:bottom="10dp" />
</shape>
</item>
<!-- 默认效果 -->
<!-- 注意:默认效果没有stroke,而按钮效果有stroke;这样可以实现类似按下的动态效果 -->
<item>
<shape>
<gradient android:startColor="#275525" android:endColor="#75ac73"
android:type="linear" android:angle="90"
android:centerX="0.5" android:centerY="0.5" />
<corners android:radius="5dip" />
<padding android:left="10dp" android:top="10dp"
android:right="10dp" android:bottom="10dp" />
</shape>
</item>
</selector>
原文中已经给出了详细的介绍,这里就不再对各个标签的含义进行说明了。上面定义的按钮是渐变的,下面给出一个非渐变(实心)按钮的定义。
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 按下的效果 -->
<item android:state_pressed="true">
<!-- shape是圆角矩形 -->
<shape android:shape="rectangle">
<!-- corner是四个圆角的大小 -->
<corners android:radius="8dp"/>
<!-- solid指明该按钮是实心效果,而不是渐变等其他效果 -->
<solid android:color="#9a2424"/>
<!-- stroke是边缘颜色,width表示边缘宽度,color是边缘颜色 -->
<!-- stroke可用于实现边缘模糊,反光等效果 -->
<stroke android:width="2dip" android:color="#830a0a" />
<!-- padding是按钮文字和边缘的距离 -->
<padding android:bottom="5dp" android:left="5dp"
android:right="5dp" android:top="5dp"/>
</shape>
</item>
<item android:state_focused="true">
<shape android:shape="rectangle">
<corners android:radius="8dip"/>
<solid android:color="#d96e26"/>
<stroke android:width="2dip" android:color="#93420d" />
<padding android:bottom="5dp" android:left="5dp"
android:right="5dp" android:top="5dp"/>
</shape>
</item>
<item>
<shape android:shape="rectangle">
<corners android:radius="8dip"/>
<solid android:color="#db7910"/>
<padding android:bottom="5dp" android:left="5dp"
android:right="5dp" android:top="5dp"/>
</shape>
</item>
</selector>
下面是一个白色矩形边框的定义。
<!-- dashGap是虚线间隔。如果是0,则是实线 -->
<!-- width是线宽。-->
<!-- color是线的颜色 -->
<item>
<shape android:shape="rectangle">
<corners android:radius="4dip"/>
<solid android:color="#000000"/>
<stroke
android:dashGap="0dp"
android:width="2dp"
android:color="@android:color/white" />
</shape>
</item>