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?
Related
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>
I have a problem of using selector that it does not work as what I expect. I wanna click on it then it gives me reaction and I select it(By long click but I probably do it through programmatic way) then it gives me another reaction. However, it reacts nothing in result....
reaction part:
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="10"
android:padding="5dp"
android:background="#drawable/border_bottom"
>
<LinearLayout
android:layout_weight="9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#drawable/selector_row">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/grey"
android:text="#string/tel"/>
<TextView
android:id="#+id/telText"
android:layout_width="wrap_content"
android:textSize="18sp"
android:layout_height="wrap_content"
android:text="#string/blank"/>
</LinearLayout>
<ImageButton
android:layout_weight="1"
android:id="#+id/tel_call"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="#drawable/ic_action_call"
android:background="#drawable/border_left"/>
</TableRow>
selector_row.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="#color/semitransparent_grey"></item>
<item
android:state_selected="true"
android:drawable="#color/semitransparent_blue"></item>
<item
android:drawable="#color/transparent"></item>
</selector>
Thank you to all brothers trying hard to answer me. I have got the answer....just simply by setting android:clickable="true" at LinearLayout. Ha, it's silly.....
I remember dude who provide relating information but I ignored... sorry to him.
Create an XML file and place it in the drawable folder. Open it and write the following code:
<selector
xmlns:android="http://schemas.android.com/apk/res/android"
>
<item
android:drawable="YOUR IMAGE OR COLOR"
android:state_pressed="true"/>
<item
android:drawable="YOUR IMAGE OR COLOR"
android:state_selected="true"/>
<item
android:drawable="YOUR IMAGE OR COLOR"
android:state_focused="true"/>
</selector>
Then in your main XML file, place android:background="#drawable/selector.xml"
What are you expecting? A reaction only when it's clicked?
Try removing removing:
android:state_selected="true"
Edit:
This should be your selector:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/my_drawable" android:state_selected="true"></item>
<item android:drawable="#drawable/my_drawable" android:state_pressed="true"></item>
<item android:drawable="#drawable/my_drawable"></item>
</selector>
What is the behaviour that you are experiencing?
Edit:
<LinearLayout
android:layout_weight="9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#drawable/selector_row"
android:duplicateParentState=true>
I don't know if it actually solves the problem
I am trying to put ON/OFF toggle images for Switch Button. But it doesn't reflect. Does the Switch button provide feature to add two selector images?
Below is my code :
<Switch
android:id="#+id/switchbutton"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentRight="true"
android:layout_gravity="right"
android:layout_marginRight="10dip"
android:layout_weight="0"
android:background="#drawable/bgtoggle"
android:checked="true"
android:clickable="false"
android:focusable="false"
android:gravity="right|center_vertical"
android:visibility="gone"
tools:ignore="NewApi" />
res/drawable/bgtoggle.xml
<?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/switch_on" android:state_checked="true"/>
<item android:drawable="#drawable/switch_off" android:state_checked="false"/>
<item android:drawable="#drawable/switch_off"></item>
</selector>
Hi I am using listview which have multiple items adding dynamically..
I want to change the text color of listitem any idea
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#659EC7">
<ImageView android:id="#+id/icon" android:layout_width="72px"
android:layout_height="wrap_content"
android:layout_marginTop="5px" />
<TwoLineListItem xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingTop="5px"
android:paddingBottom="5px">
<TextView android:id="#+id/item1" android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView android:id="#+id/item2" android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:paddingTop="30px" />
<View
android:layout_width="fill_parent"
android:layout_height="1dp"
android:background="#android:color/darker_gray"/>
</TwoLineListItem>
</LinearLayout>
I am using 2linelistIem
Here is the code I wrote and used:
It keeps the android style for all other states. it just overlays the transparent state with your desired color:
Layer list drawable for list view with custom background
as you can see in my question there is a minor bug with the focused state, but it is still the best solution i ever saw :D
Use this type of technique to change the color dynamically:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:drawable="#color/black" /> <!-- focused -->
<item android:state_focused="true" android:state_pressed="true" android:drawable="#color/black" /> <!-- focused and pressed-->
<item android:state_pressed="true" android:drawable="#color/green" /> <!-- pressed -->
<item android:drawable="#color/black" /> <!-- default -->
</selector>
I have file lst_custom_view.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/RelativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top|left"
android:background="#drawable/list_choose"
android:orientation="horizontal">
<TextView
android:id="#+id/textView1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_gravity="center"
android:layout_marginLeft="20dp"
android:ellipsize="marquee"
android:marqueeRepeatLimit="marquee_forever"
android:scrollHorizontally="true"
android:singleLine="true"
android:textColor="#ff000000"
android:textSize="22dp" />
</RelativeLayout>
And Listview in Main.xml
<ListView
android:id="#+id/lstView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_weight="1"
android:background="#android:color/transparent"
android:cacheColorHint="#android:color/transparent"
android:divider="#drawable/menu_phancach"
android:dividerHeight="2dp"
android:visibility="visible">
</ListView>
I use Selector with Background of Relativelayout with name list_choose.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="#drawable/menu_content" />
<item android:state_selected="true"
android:state_pressed="false"
android:drawable="#drawable/menu_content_hover" />
<item android:state_pressed="true"
android:drawable="#drawable/menu_content_hover" />
</selector>
it's show me the background of RelativeLayout menu_content_hover when i Press on items listview, but not selected with background menu_content_hover. I want it change background menu_content_hover when user press on items and selected ,change backround menu_content when user scroll list(unselected) or choose another items.I used simpleCursorAdapter. Any Help? Thanks for all your help.
The selector should be like this:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="#drawable/background_pressed" />
<item android:state_focused="true"
android:drawable="#drawable/background_focused" />
<item android:state_selected="true"
android:drawable="#drawable/background_selected" />
<item android:drawable="#drawable/background_default"/>
</selector>