【Android UI】案例04配置控件点击效果(selector)

本例采用XML(selector)，配置控件点击效果的实现，即当控件被触发或点击获取到焦点时，出现样式上的改变，以便给以较好的用户体验与操作感。本例需要引入的核心知识点的selector.xml。请参考学习：http://www.jb51.cc/article/p-kxglgcyc-uy.html。本例用于演示点击效果的控件为TextView、Button。

【转载使用，请注明出处：http://blog.csdn.net/mahoking】
首先需要配置selector.xml文件，因为本例需要的测试控件包含TextView和Button，所以本案例需要配置两个XML文件，文件位于/res/drawable下。分别为：seletor_04_click_textview.xml、seletor_04_click_button.xml。
seletor_04_click_textview.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_pressed="true" android:color="#18A960" />
    <item android:state_focused="true" android:color="#18A960" />
    <item android:state_selected="true" android:color="#18A960" />
    <item android:color="@android:color/black"></item>
</selector>

seletor_04_click_button.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
   <item android:state_pressed="true" android:drawable="@drawable/button_pressed" />
   <item android:state_focused="true" android:drawable="@drawable/button_pressed"  />
   <item android:state_selected="true" android:drawable="@drawable/button_pressed" />
   <item android:drawable="@drawable/button_default"></item>
</selector>

seletor_04_click_textview.xml旨在改变TextView的字体颜色，seletor_04_click_button.xml旨在改变Button的背景图片，所以我们需要给Button准备两张不同的图片，以显示改变的效果。
然后是主布局文件activity_04_seletor.xml。需要特别注意的地方是：
TextView控件的配置(文本颜色)
android:textColor="@drawable/seletor_04_click_textview"
Button控件的配置(背景图片)
android:background="@drawable/seletor_04_click_button"

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical" >
   <TextView android:layout_height="wrap_content"
       android:layout_width="match_parent"
       android:layout_marginBottom="10dp"
       android:text="以下演示TextView，点击时文字颜色改变"
       android:gravity="center"/>
	
	<TextView android:layout_height="30dp"
       android:layout_width="match_parent"
       android:id="@+id/activity_04_seletor_textview"
       android:layout_marginTop="10dp"
       android:text="测试使用TextView"
       android:textSize="25dp"
       android:textColor="@drawable/seletor_04_click_textview"
       android:gravity="center"
       android:layout_marginBottom="40dp"/>
   
   <TextView android:layout_height="wrap_content"
       android:layout_width="match_parent"
       android:layout_marginTop="10dp"
       android:text="以下演示Button，点击时背景图片改变"
       android:textColor="@drawable/seletor_04_click_textview"
       android:layout_marginBottom="10dp"
       android:gravity="center"/>
   
   <Button android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:id="@+id/activity_04_seletor_button"
       android:gravity="center"
       android:background="@drawable/seletor_04_click_button"
       android:layout_marginBottom="60dp"/>
</LinearLayout>

最后编写Activity(SelectorActivity)如下，完成后运行该项目。

public class SelectorActivity extends Activity {

	private TextView  textView;
	private Button button;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_04_seletor);
		initViews();
	}
	
	/**
	 * 初始化视图
	 */
	private void initViews() {

		textView = (TextView) findViewById(R.id.activity_04_seletor_textview);
		button = (Button) findViewById(R.id.activity_04_seletor_button);
		MainOnClickListener clickListener = new MainOnClickListener();
		textView.setonClickListener(clickListener);
		button.setonClickListener(clickListener);
	}
	
	private class MainOnClickListener implements View.OnClickListener{

		@Override
		public void onClick(View v) {
			int viewId = v.getId();
			switch (viewId) {
			case R.id.activity_04_seletor_button:
				Toast.makeText(getApplicationContext(),"背景图片发生改变",Toast.LENGTH_SHORT).show();
				break;
			case R.id.activity_04_seletor_textview:
				Toast.makeText(getApplicationContext(),"文字颜色发生改变",Toast.LENGTH_SHORT).show();
				break;
			default:
				break;
			}
		}
		
	}
}

效果截图：

【转载使用，请注明出处：http://blog.csdn.net/mahoking】

【Android UI】案例04配置控件点击效果(selector)

相关推荐