我们在 布局中 很多时候会用到Button和ImageButton
但是系统自带的样式给我们的感觉就是没有多样性 而且很多的都是个千篇一律的格式和样式
那么怎么实现这两种控件的多元化呢
在这里先简单的介绍一下用法
一般的 普通按钮是可以添加背景图 布局是这样的
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/b"
android:text="Button按钮"
android:textColor="#ff0000"/>
上面代码中 “b”是在drawable-dpi中的png图片
具体效果就是这样的
这样的情况下 我们使用的按钮在点击的时候是没有点击效果的 就是说 点击的时候 图片还是这样的 就想是没有点一样
那么 怎么样才能实现 既能给按钮添加图片背景 又能实现点击的效果呢
这个时候我们需要准备两张图一张是没有点击的时候显示效果 另外一张是点击的时候要显示的效果
具体的布局中的代码是这样的
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/buttonxml"
android:text="带图片的文字按钮" />
在这里呢 background的属性就不是直接显示图片了 上面的代码中 buttonxml是一个xml的文件 这个文件是放在drawable目录下 具体代码是这样的:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/a" android:state_pressed="true"/>
<item android:drawable="@drawable/b" android:state_pressed="false"/>
</selector>
上面的代码中 a是点击前的显示图片 b 是点击后的图片
具体的效果是这样的
点击前的图片
点击后的样式就是这样的了
看出不一样了吧
其实ImageButton 在这个方面的实现也是一样的
下面我就只说一下布局 效果图就不展示了 麻烦
一般的布局是这样的
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#000000"
android:src="@drawable/blue" />
我要说的布局是这样的
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#000000"
android:src="@drawable/buttonxml" />
上面的那个 blue还是一个图片文件 下面的那个buttonxml是我上面写了代码的那个xml文件 同样的 把xml文件添加到drawable中 就可以实现点击的效果
当然 我们有时候还需要另外一种点击效果
那就是类似我们 在android中我们看到的 RadioButton的 样式 当我们点一次的时候 变成一种 再点击一次的时候 就变成另外一种 我现在做的效果是这样的
不点击的时候是这样的
当我们点击一次之后就变成这样
在点击一次的时候 就在变成 这样
其实这样的实现也是比较简单的
我们也是要在布局的 drawable 文件中添加 一个XMl的文件
这个文件的内容是这样的
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_enabled="true"
android:state_checked="true"
android:drawable="@drawable/alarm_check" />
<item
android:state_enabled="true"
android:state_checked="false"
android:drawable="@drawable/alarm_uncheck" />
</selector>
其中 alarm_check 就是 这个图 alarm_uncheck就是 这张图了 这两张图都是在PS中就能实现的
在布局文件中 我们要实现的布局大概 就是这样的
<RadioButton
android:id="@+id/voiceradioButton1"
android:layout_width="45dip"
android:layout_height="45dip"
android:layout_alignBottom="@+id/tongyin"
android:layout_toRightOf="@id/tongyin"
android:button="@drawable/radiobutton_xml" />
radiobutton就是上面的那个xml文件
这样 效果就出来了