首页 > 代码库 > 【Android UI】案例04配置控件点击效果(selector)
【Android UI】案例04配置控件点击效果(selector)
本例采用XML(selector),配置控件点击效果的实现,即当控件被触发或点击获取到焦点时,出现样式上的改变,以便给以较好的用户体验与操作感。本例需要引入的核心知识点的selector.xml。请参考学习:http://blog.csdn.net/mahoking/article/details/23690857。本例用于演示点击效果的控件为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)