为相对布局创建“按下状态”

时间:2014-12-18 12:17:23

标签: android android-layout android-xml android-custom-view android-ui

我已经构建了这个仪表板(参见图片附件) enter image description here

我要做的是为按钮创建一个“按下状态”。颜色变化对我来说很好。

仪表板按钮由5个相对布局组成,每个布局包含两个图像视图和两个文本视图。

下面列出的代码仅针对一个按钮,在这种情况下为“移动应用”:

<RelativeLayout
            android:id="@+id/appsHolder"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:background="@drawable/gradient_background"
            android:padding="5dp" >

            <!-- ListRow Left sied Thumbnail image -->

            <LinearLayout
                android:id="@+id/thumbnail"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_marginRight="5dip"
                android:padding="3dip" >

                <ImageView
                    android:id="@+id/list_image"
                    android:layout_width="150dip"
                    android:layout_height="150dip"
                    android:src="@drawable/ic_apps_dashboard" />
            </LinearLayout>

            <!-- Title Of Song -->

            <TextView
                android:id="@+id/title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignTop="@+id/thumbnail"
                android:layout_toRightOf="@+id/thumbnail"
                android:text="Mobile Apps"
                android:textColor="#000000"
                android:textSize="30dip"
                android:textStyle="bold"
                android:typeface="sans" />

            <!-- Artist Name -->

            <TextView
                android:id="@+id/subtitle"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_below="@id/title"
                android:layout_marginTop="1dip"
                android:layout_toRightOf="@+id/thumbnail"
                android:text="Preview the Viessmann apps..."
                android:textColor="#000000"
                android:textSize="30dip" />

            <!-- Rightend Duration -->


            <!-- Rightend Arrow -->

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"
                android:src="@drawable/ic_arrow_dashboard" />
        </RelativeLayout>

任何指导都会受到赞赏!

1 个答案:

答案 0 :(得分:3)

您必须编写自己的选择器:

http://developer.android.com/guide/topics/resources/color-list-resource.html

在res / drawable /文件夹中创建一个xml文件,并将其作为背景应用于按钮:

my_background_selector.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/background_gradient_pressed" />
   <item android:state_focused="true" android:drawable="@drawable/background_gradient_pressed" />
   <item android:state_selected="true" android:drawable="@drawable/background_gradient_pressed" />


   <item android:drawable="@drawable/background_gradient" />

 </selector>

然后只需将选择器应用为布局

的背景
<RelativeLayout
            android:id="@+id/appsHolder"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:background="@drawable/my_background_selector"
            android:padding="5dp" 
    ...
</RelativeLayout>

如果你想使用颜色,你也可以这样做:

<?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">

   <item android:state_pressed="true">
       <shape>
         <solid android:color="@color/pressed_color" />
       </shape>
   </item>


   <item>
     <shape>
        <solid android:color="#B8B8B8" />
     </shape>
   </item>

 </selector>