Develop Reference

Android Relativelayout click background behaviour

So i have a RecyclerView and it is populated by my custom layout (code below). I have made a background drawable and set it on the root of my custom layout so that when user clicks the item, the background colour changes. There is also an options button (3 dots) on every item's layout, which is also clickable and also needs to change the background colour when clicked.
The problem is, when i set my drawable as background for the options menu the whole layout doesn't change colour when clicked (screens below)
When i set the background on options menu as "?android:attr/selectableItemBackground", everything works fine.
Code for my layout:
<RelativeLayout xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="60dp"
android:background="#drawable/item_click"
android:layout_marginBottom="2dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:paddingLeft="16dp"
android:id="#+id/item_icon"
android:src="#drawable/ic_folder" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="72dp"
android:layout_centerVertical="true">
<TextView
android:id="#+id/item_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#333333"
android:text="Caption"
android:textSize="13sp" />
<TextView
android:id="#+id/item_description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#333333"
android:text="Description"
android:textSize="13sp" />
</LinearLayout>
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:foregroundGravity="center_vertical"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:id="#+id/item_menu"
android:src="#drawable/ic_ellipsis_v"
android:background="#drawable/item_click" />
</RelativeLayout>
Code for the drawable:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_focused="true"
android:state_pressed="true"
android:drawable="#color/primary_100" />
<item
android:state_focused="false"
android:state_pressed="true"
android:drawable="#color/primary_100" />
<item
android:drawable="#android:color/white" />
</selector>
Item selected when the background of the options menu is set to "?android:attr/selectableItemBackground" (I want the whole row to change colour to blue):
Item selected when the background of the options menu is set to my drawable:

Change the default state of your selector:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_focused="true"
android:state_pressed="true"
android:drawable="#color/primary_100" />
<item
android:state_focused="false"
android:state_pressed="true"
android:drawable="#color/primary_100" />
<item
android:drawable="#android:color/transparent" />
</selector>

Design a button, android?

I need to design a this type button which should have a background with another small image in the center and the text at the bottom.
While the current I am using is a textview as below
<TextView
android:id="#+id/homeButton1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#ffffff"
android:clickable="false"
android:focusable="false"
android:focusableInTouchMode="false"
android:gravity="center"
android:text="Button"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#drawable/button_color"
android:textStyle="bold" />
But i cannot put an image in its center.
If I use android:drawableTop
this is the image I get
How can this be feasible?

try compound drawables here is an example
<TextView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawableTop="#drawable/image"
android:gravity="center"
android:text="#string/text" />
output:

Put a bellow line to your TextView xml and change "img_src" to your image.
android:drawableTop="#drawable/img_src"
UPDATE 1 :
drawableTop only support to draw above the text.
If you want to draw image on the center, here is a sample code.
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/background_image" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/center_image" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView1"
android:text="TextView" />
</RelativeLayout>

Check this one, works exactly as you want
<Button
android:id="#+id/btn"
style="#style/MyButton"
android:drawableTop="#drawable/btn_my"
android:text="SomeText" />
btn_my.xml // add this inside drawable folder
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/ic_launcher"
android:state_focused="true"
android:state_pressed="true" />
<item android:drawable="#drawable/ic_launcher"
android:state_focused="false"
android:state_pressed="true" />
<item android:drawable="#drawable/ic_launcher" android:state_focused="true" />
<item android:drawable="#drawable/ic_launcher"
android:state_focused="false"
android:state_pressed="false" />
</selector>
copy the below into styles.xml
<style name="MyButton">
<item name="android:layout_gravity">center_vertical</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:gravity">center_horizontal</item>
<item name="android:drawablePadding">2dp</item>
<item name="android:textSize">16dp</item>
<item name="android:textStyle">bold</item>
<item name="android:textColor">#ff29549f</item>
<item name="android:background">#null</item>
</style>
Here is the OUTPUT

Images not Switching in Android Custom Toggle Button

In my android application, I am trying to make a simple toggle button switching between two images, actually a star to mark as favorites. States of the button are being changed but images are not switching for ON and OFF states. Image of the OFF state is being displayed by default continuously.
I have tried the following tutorials:
http://www.coderzheaven.com/2012/05/20/create-custom-toggle-button-android/
http://www.technotalkative.com/android-custom-toggle-button-example/
** togbtn_fav_custom.xml **
<item android:drawable="#drawable/ic_action_important" android:state_checked="true" android:state_pressed="true"/>
<item android:drawable="#drawable/ic_action_important" android:state_checked="true" android:state_focused="false"/>
<item android:drawable="#drawable/ic_action_not_important" android:state_checked="false" android:state_pressed="true"/>
<item android:drawable="#drawable/ic_action_not_important" android:state_checked="false" android:state_focused="false"/>
layout.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<LinearLayout
android:id="#+id/ll_back_single_dua_footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical" >
<Button
android:id="#+id/btn_play_pause_dua"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="#drawable/play_btn_custom" />
<TextView
android:id="#+id/tv_back_single_dua_footer_counter"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_horizontal"
android:singleLine="true"
android:text="#string/sample_counter"
android:textSize="23sp" />
<ToggleButton
android:id="#+id/tog_btn_favorite_dua"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/togbtn_fav_custom"
android:textOff=""
android:textOn=""
/>
</LinearLayout>
</LinearLayout>
Can anybody please guide me what am I missing?

Try to simplify your selector.xml like this:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/ic_action_not_important" android:state_checked="false"/>
<item android:drawable="#drawable/ic_action_important" android:state_checked="true"/>
</selector>
And as Achilles said, check line
android:background="#drawable/togbtn_fav_custom"
May be you need to set selector.xml as background?

ImageView state not changing

I've use a selector to change the drawable of an ImageView.
i.e. When the user press the image, the drawable should change.
In layout.xml:
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="73dp"
android:src="#drawable/ic_submit_selector" />
ic_submit_selector:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/ic_submit_pressed" android:state_focused="true" android:state_pressed="true"/>
<item android:drawable="#drawable/ic_submit_pressed" android:state_focused="false" android:state_pressed="true"/>
<item android:drawable="#drawable/ic_submit" android:state_focused="true"/>
<item android:drawable="#drawable/ic_submit_pressed" android:state_focused="false" android:state_pressed="false"/>
</selector>
But the drawable is not changing.

<ImageButton
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="73dp"
android:src="#drawable/ic_submit_selector" />
Not
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="73dp"
android:src="#drawable/ic_submit_selector" />

To extend Murtaza's correct answer, if you still wont be able to make it run, try replacing android:src with android:background.

Change ListView's text color on click

I have a customized ListView that each row of the list is composed by an ImageView and two TextView's. I want to change the text's color to white when a list's item is clicked (only in the clicked item). Also, I want to change back the color to black when the item is "unclicked" (when the "press" is released). I already made the item's background color change when it was clicked with the following list_item_bg.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_selected="false"
android:state_pressed="false"
android:drawable="#color/white" />
<item android:state_pressed="true"
android:drawable="#color/red_destaques" />
<item android:state_selected="true"
android:drawable="#color/red_destaques" />
</selector>
And the listitem_row.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="fill_parent"
android:layout_height="50dip"
xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="5dip"
android:maxHeight="50dip"
android:adjustViewBounds="true"
android:background="#color/list_item_bg">
<ImageView
android:layout_width="70dip"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:adjustViewBounds="true"
android:scaleType="fitStart"
android:src="#drawable/imagem_padrao_lista"
android:id="#+id/listItemLogo">
</ImageView>
<TextView
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_height="wrap_content"
android:text="TextView"
android:layout_width="wrap_content"
android:layout_toRightOf="#+id/listItemLogo"
android:layout_toLeftOf="#+id/listItemArrow"
android:textColor="#000000"
android:layout_marginLeft="5dip"
android:adjustViewBounds="true"
android:id="#+id/listItemTitle">
</TextView>
<TextView
android:layout_height="wrap_content"
android:text="TextView"
android:layout_width="wrap_content"
android:layout_toRightOf="#+id/listItemLogo"
android:layout_below="#+id/listItemTitle"
android:textColor="#333333"
android:layout_marginLeft="5dip"
android:adjustViewBounds="true"
android:id="#+id/listItemDescription">
</TextView>
<ImageView android:layout_height="wrap_content" android:layout_width="wrap_content" android:layout_alignParentRight="true" android:src="#drawable/setinha_navegacao" android:layout_centerVertical="true" android:id="#+id/listItemArrow"></ImageView>
</RelativeLayout>
I the text to change it's color exactly in the same manner that the background changes as shown in the above xmls. I would prefer doing this change by code if possible...

Create a new StateListDrawable like you did before but with black as default color and white when pressed.
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:color="#color/black" />
<item android:state_focused="true" android:color="#color/black" />
<item android:state_pressed="true" android:color="#color/black" />
<item android:color="#color/white" />
</selector>
Now for in the TextView change the text color to the new drawable:
android:textColor="#color/list_item_text"
More on StateListDrawables: http://developer.android.com/guide/topics/resources/drawable-resource.html#StateList