先看效果图,点击事件触发时背景变化,一般都是通过selector标签实现的。但是当我们经常要使用到的时候,我们想直接在布局文件中设置两个背景资源,点击时候一个,默认情况下一个,这样就很直观的在布局文件中看出来,而不需要建立大量的selector来实现。
这样的效果当然可以使用android:background设置一个Selector背景,但是这里不是。这里仅仅是自定义一个button。
<com.example.view.ButtonSelect
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginTop="20dp"
android:text="@string/hello_world"
android:background="@android:color/holo_green_light" />
其中的自定义控件是怎么改变背景的呢:
public class ButtonSelect extends Button {
public ButtonSelect(Context context, AttributeSet attrs) {
super(context, attrs);
init(context);
}
@SuppressLint("ClickableViewAccessibility")
private void init(Context context) {
setOnTouchListener(new OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_DOWN) {
setBackgroundResource(android.R.color.holo_red_light);
} else if (event.getAction() == MotionEvent.ACTION_CANCEL
|| event.getAction() == MotionEvent.ACTION_UP || !isPressed()) {
setBackgroundResource(android.R.color.holo_green_light);
}
return false;
}
});
}
}
可以看出,这里是监听了OnTouchListener事件,通过点击状态改变背景。通常情况下,手指离开了按键范围之后,需要取消事件,所以这里加入了isPressed()判断。当已经离开按键范围,就还原背景,否则只要手指不抬起来,按下的背景状态一直持续。触摸离开按键范围就还原背景也是普通的Button的基本情况。
接下来我们实现在布局文件中直接设置按键按下的背景。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<com.example.view.ButtonSelectRes
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginTop="20dp"
android:background="@drawable/bg_off"
android:text="@string/hello_world"
android:textColor="@android:color/black"
app:clickOnBackground="#FFF44000" />
</LinearLayout>
这里使用了自定义属性app:clickOnBackground,设置按下之后的背景变化成什么样子。
首先第一属性,在res/values/styles.xml中建立标签:<declare-styleable name="SelectBackground">;
<resources>
<!--
Base application theme, dependent on API level. This theme is replaced
by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
-->
<style name="AppBaseTheme" parent="android:Theme.Light">
<!--
Theme customizations available in newer API levels can go in
res/values-vXX/styles.xml, while customizations related to
backward-compatibility can go here.
-->
</style>
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
</style>
<declare-styleable name="SelectBackground">
<attr name="clickOnBackground" format="reference|color" />
</declare-styleable>
</resources>
这里使用了的控件自定义属性可以参考http://blog.csdn.net/dreamintheworld/article/details/45224807
设置了declare-styleable标签的style之后,就可以在布局文件中使用所定义的clickOnBackground属性。<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<com.example.view.ButtonSelectRes
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginTop="20dp"
android:background="@drawable/bg_off"
android:text="@string/hello_world"
android:textColor="@android:color/black"
app:clickOnBackground="#FFF44000" />
</LinearLayout>
这里直接使用app:clickOnBackground="#FFF44000" 。是因为在文件开始的地方已经定义了app的命名空间
xmlns:app="http://schemas.android.com/apk/res-auto"
在sdk17以后都可以直接使用res-auto了。方便了不少,不用填写包名等信息,统一使用一个字段;
这里的bg_off是一张图片。
自定义控件代码:
public class ButtonSelectRes extends Button {
private Drawable clickOffbg;
private Drawable clickOnbg;
public ButtonSelectRes(Context context, AttributeSet attrs) {
super(context, attrs);
init(context, attrs);
}
@SuppressLint("ClickableViewAccessibility")
private void init(Context context, AttributeSet attrs) {
initAttributeSet(context, attrs);
setOnTouchListener(new OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_DOWN) {
setBackground(clickOnbg);
} else if (event.getAction() == MotionEvent.ACTION_CANCEL
|| event.getAction() == MotionEvent.ACTION_UP || !isPressed()) {
setBackground(clickOffbg);
}
return false;
}
});
}
private void initAttributeSet(Context context, AttributeSet attrs) {
if (attrs == null) {
return;
}
int[] styles = R.styleable.SelectBackground;
TypedArray typedArray = context.obtainStyledAttributes(attrs, styles);
try {
int clickOnColor = typedArray.getColor(R.styleable.SelectBackground_clickOnBackground,
android.R.color.holo_red_light);
clickOnbg = new ColorDrawable(clickOnColor);
} catch (Exception e) {
clickOnbg = typedArray.getDrawable(R.styleable.SelectBackground_clickOnBackground);
}
typedArray.recycle();
}
@Override
protected void onFinishInflate() {
super.onFinishInflate();
clickOffbg = getBackground();
}
}
运行之后是这样的:
到此我们就可以直接的使用
android:background="@drawable/bg_off"
app:clickOnBackground="#FFF44000"
非常直观的可以看到点击前后的效果,也避免了过多的drawable文件。
至于是监听了onTouch事件,是因为如果监听点击事件是不容易修改背景的,也会导致在页面中的设置了点击事件被覆盖掉而不响应的问题。
博文来自CSDN:http://blog.csdn.net/dreamintheworld/article/details/45224337