使用颜色做点击效果selector

设置选项与交互体验优化

最新推荐文章于 2021-05-25 22:47:44 发布

原创最新推荐文章于 2021-05-25 22:47:44 发布 · 174 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#移动开发

android 专栏收录该内容

96 篇文章

订阅专栏

本文详细介绍了如何通过设置按钮的点击效果、布局文件及颜色配置来优化用户体验，包括使用XML选择器设置不同状态下的背景颜色，以及在布局中加入各种功能选项如反馈、版本更新、关于我们等。

以设置的按钮为例:

点击效果文件selector_setting.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@color/white" android:state_pressed="false"/>
    <item android:drawable="@color/setting_item_press_bg" android:state_pressed="true"/>
</selector>

这里drawable直接使用自定义颜色来做colors.xml:

	<color name="white">#FFFFFF</color>
    <color name="setting_item_press_bg">#F0F0F0</color>

部局文件的一部分:setting.xml

<LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="20dp"
                    android:background="#ffff"
                    android:orientation="vertical" >

                    <ImageView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:src="@drawable/line" />

                    <!-- 意见反馈 -->

                    <RelativeLayout
                        android:id="@+id/set_commit"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal"
                        android:padding="12dp"
                        android:background="@drawable/selector_setting"
                         >

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="@string/set_feedback"
                            android:textColor="#000" />

                        <ImageView
                            android:layout_width="15dp"
                            android:layout_height="15dp"
                            android:layout_alignParentRight="true"
                            android:src="@drawable/arrow" />
                    </RelativeLayout>

                    <ImageView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="12dp"
                        android:src="@drawable/line" />

                    <!-- 版本更新 -->

                    <RelativeLayout
                        android:id="@+id/set_ver_update"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal"
                        android:background="@drawable/selector_setting"
                        android:padding="12dp" >

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="@string/set_version_update"
                            android:textColor="#000" />

                        <ImageView
                            android:layout_width="15dp"
                            android:layout_height="15dp"
                            android:layout_alignParentRight="true"
                            android:src="@drawable/arrow" />
                    </RelativeLayout>

                    <ImageView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="12dp"
                        android:src="@drawable/line" />

                    <!-- 关于我们 -->

                    <RelativeLayout
                        android:id="@+id/set_about"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal"
                        android:background="@drawable/selector_setting"
                        android:padding="12dp" >

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="@string/set_about_us"
                            android:textColor="#000" />

                        <ImageView
                            android:layout_width="15dp"
                            android:layout_height="15dp"
                            android:layout_alignParentRight="true"
                            android:src="@drawable/arrow" />
                    </RelativeLayout>

                    <ImageView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="12dp"
                        android:src="@drawable/line" />

                    <!-- 给我评分 -->
                    <!--
                     <RelativeLayout                 
                    android:layout_width="match_parent"
                	android:layout_height="wrap_content"
                	android:orientation="horizontal"
                	android:padding="12dp"
                	>
                	
                	<TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="给我评分"
                        android:textColor="#000" />
                	
                	<ImageView 
					   	android:layout_width="15dp"
					    android:layout_height="15dp"
					    android:src="@drawable/arrow"
					    android:layout_alignParentRight="true"
					    />
                </RelativeLayout>
                
                <ImageView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="12dp"
                    android:src="@drawable/line" />
                    -->


                    <!-- 修改密码 -->

                    <RelativeLayout
                        android:id="@+id/set_edit_password"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal"
                        android:background="@drawable/selector_setting"
                        android:padding="12dp" >

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="@string/set_modify_pass"
                            android:textColor="#000" />

                        <ImageView
                            android:layout_width="15dp"
                            android:layout_height="15dp"
                            android:layout_alignParentRight="true"
                            android:src="@drawable/arrow" />
                    </RelativeLayout>

                    <ImageView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="12dp"
                        android:src="@drawable/line" />

                    <!-- 应用推荐 -->

                    <RelativeLayout
                        android:id="@+id/set_app_center"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal"
                        android:background="@drawable/selector_setting"
                        android:padding="12dp" >
                        
                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="@string/set_app_center"
                            android:textColor="#000" />

                        <ImageView
                            android:layout_width="15dp"
                            android:layout_height="15dp"
                            android:layout_alignParentRight="true"
                            android:src="@drawable/arrow" />
                    </RelativeLayout>

                    <ImageView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:src="@drawable/line" />
                </LinearLayout>