Apply gradient to rows in listview in android - android

i've a list view with different colors depending on if it's an even or odd row:
My custom adapter:
if ( position % 2 == 0)
convertView.setBackgroundResource(R.layout.listview_selector_even);
else
convertView.setBackgroundResource(R.layout.listview_selector_odd);
list_selector_even:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#layout/even_row" android:state_enabled="true"/>
<item android:drawable="#layout/even_row" android:state_pressed="true"/>
<item android:drawable="#layout/even_row" android:state_focused="true"/>
</selector>
list_selector_odd:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#layout/odd_row" android:state_enabled="true"/>
<item android:drawable="#layout/odd_row" android:state_pressed="true"/>
<item android:drawable="#layout/odd_row" android:state_focused="true"/>
</selector>
even_row:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#FFFFFF"/>
<padding android:left="3dp" android:top="3dp" android:right="3dp" android:bottom="3dp" />
</shape>
odd_row:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#F0F0F0"/>
<padding android:left="3dp" android:top="3dp" android:right="3dp" android:bottom="3dp" />
</shape>
I'm a little bit lost because i cant get the even and odd rows colors working with the gradient effect. For the preessed effect gradient i've the next code:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
<shape>
<gradient
android:startColor="#3E5260"
android:endColor="#3E5260"
android:angle="270" />
</shape>
</item>
</selector>
Thanks for the help!

You already check for the state in the selector, so for the gradient, you should do this instead:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="#3E5260"
android:endColor="#3E5260"
android:angle="270" />
</shape>
Also, either change the selectors to following and define a file for each selector item, or move the selector with all available states to the odd_row.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#layout/odd_row_pressed" android:state_pressed="true"/>
<item android:drawable="#layout/odd_row_focused" android:state_focused="true"/>
<item android:drawable="#layout/odd_row_enabled"/>
</selector>
This version ensures that odd_row_enabled.xml is chosen if the item is not pressed and not focused. If you want another layout if the item is not enabled, you have to add one more line (before the default line). Also, it ensures that odd_row_pressed.xml is chosen in case it is pressed and enabled, because the <item> for the state pressed comes before the other lines.

Related

Add custom color to touch feedback in android

To give users visual feedback when they touch a view, I do
<View
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground" />
But ?attr/selectableItemBackground is a gray color. I want to use a different color. To do that I do
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="schemas.android.com/apk/res/android">;
<item android:drawable="#color/mine" android:state_selected="true"></item>
<item android:drawable="#color/mine" android:state_pressed="true"></item>
<item android:drawable="#android:color/transparent"></item>
</selector>
but it does not work, even after I set clickable="true" for the view in question.
Follow the code
button_normal.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#color/button_light_green"/>
<corners android:radius="5dp" />
</shape>
button_selected.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#color/button_light_green_selected"/>
<corners android:radius="5dp" />
</shape>
button_background.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_selected"/>
<item android:state_focused="true" android:drawable="#drawable/button_selected"/>
<item android:drawable="#drawable/button_normal"/>
</selector>
assign button_background.xml as background for the button by changing the colors which u desire. Hope it works!!!

Android Ripple Effect Overridden by Selected State

After having been looking for a while I've not been able to find an answer to this...
I have a recycler view with items which when selected have a red background and white text (beforehand the background is white and text is black). To do this I am using a selector.
I have recently tried to add a ripple effect to this, but unless I long click on the item the background of the item goes straight to red without the ripple. I am assuming this is because the selector state state_selected overrides the ripple on sate_pressed?
Does anyone know if there is a way around this? Here is the selector code I use:
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#android:color/holo_red_dark" >
<item>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:drawable="#drawable/ripple"
android:state_pressed="true"/>
<item
android:drawable="#android:color/holo_red_dark"
android:state_selected="true"/>
<item android:drawable="#android:color/white"/>
</selector>
</item>
</ripple>
Thanks in advance!
To create a selector background that has a ripple effect and shows selected status I do the following:
Start by defining your highlight color, with some transparency:
values/colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="selector_color">#660000ff</color>
</resources>
You probably want to have compatibility pre-lollipop. Put a typical old-school selector inside drawable folder:
drawable/selector_background.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/selector_color" android:state_pressed="true"/>
<item android:drawable="#color/selector_color" android:state_selected="true"/>
<item android:drawable="#android:color/transparent"/>
</selector>
And then add the following layer drawable inside drawable-v21 folder:
drawable-v21/selector_background.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<selector>
<item android:state_selected="true"
android:drawable="#color/selector_color" />
<item android:drawable="#android:color/transparent" />
</selector>
</item>
<item>
<ripple android:color="#color/selector_color">
<item android:id="#android:id/mask">
<color android:color="#android:color/white" />
</item>
</ripple>
</item>
</layer-list>
Now you can use #drawable/selector_background for your selector.
So I have another case in which I had to use selector as well as layer list for that
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true">
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#color/colorRipple">
<item>
<layer-list>
<item>
<shape android:shape="rectangle">
<solid android:color="#color/grey_very_light" />
</shape>
</item>
<!-- ripple color -->
<item android:bottom="1dp">
<shape android:shape="rectangle">
<solid android:color="#color/c_unread_notifications_item" />
</shape>
</item>
</layer-list>
</item>
</ripple>
</item>
<item>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#color/colorRipple">
<item>
<!-- ripple color -->
<layer-list>
<item>
<shape android:shape="rectangle">
<solid android:color="#color/grey_very_light" />
</shape>
</item>
<item android:bottom="1dp">
<shape android:shape="rectangle">
<solid android:color="#color/white" />
</shape>
</item>
</layer-list>
</item>
</ripple>
</item>
</selector>
This worked, for your need what you can do it just replace the item under ripple with your item shape if you don't have any layering.
Hope this helps
It will be better if you wrap your recyclerview item view in FrameLayout and set android:background="?selectableItemBackground" of FrameLayout and the child layout of FrameLayout background="#drawable/background"
background.xml
<item android:drawable="#color/red" android:state_selected="true"/>
<item android:drawable="#color/red" android:state_focused="true"/>
<item android:drawable="#color/red" android:state_pressed="true"/>
<item android:drawable="#color/white"/>
And then child layout must has attribute android:duplicateParentState="true"

android shape does not change size

Please help me for a layout on Android.
flat_btn_hover.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="#f45d5d"
android:centerColor="#f45d5d"
android:endColor="#f45d5d"/>
<size android:height="#dimen/activity_bottom_height_hover"/>
<stroke
android:width="2dp"
android:color="#f45d5d"/>
</shape>
flat_btn_bt_normal.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="#232323"
android:centerColor="#232323"
android:endColor="#232323"/>
<size android:height="#dimen/activity_bottom_height"/>
<stroke
android:width="1dp"
android:color="#3e3e3e"/>
</shape>
flat_btn_bt.xml :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:state_pressed="false" android:drawable="#drawable/flat_btn_bt_normal" />
<item android:state_focused="true" android:state_pressed="true" android:drawable="#drawable/flat_btn_bt_normal" />
<item android:state_focused="false" android:state_pressed="true" android:drawable="#drawable/flat_btn_hover" />
<item android:drawable="#drawable/flat_btn_bt_normal"/>
</selector>
Then, I set the background for the Button:
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/flat_btn_bt"/>
But when working, it changes the color and don't change size layout.
Can you tell me how to change the size?
The shape scales to the size of the container View proportionate to the dimensions defined here, by default.
Remove your size attribute

How do I create a selector with drawable and color

Here is the code I have that is presently not working. How do I get it to work? I don't want to use two files such as a shape file in addition to the selector file. Can I do this in one file?
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/img1" android:state_selected="true"/>
<item android:color="#color/my_col"/>
</selector>
I also tried
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/img1" android:state_selected="true"/>
<item><shape android:shape="rectangle">
<solid android:color="#color/my_col" />
</shape></item>
</selector>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false"><shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<solid android:color="#3f68c2" />
<corners android:radius="20dp" />
</shape></item>
<item android:state_pressed="true"><shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<solid android:color="#3f68c2" />
<corners android:radius="20dp" />
</shape></item>
It turns out mine works. I was calling the wrong drawable into the layout file.

Android Stock Button Make It Solid

Hi Im trying to make the android stock button a solid but still contain the little animation when press to change colour. Any help would be awesome. This is what I have so far.
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<stroke android:width="0dp" android:color="#000000" />
<solid android:color="#ffffff"/>
<corners android:radius="1px"/>
<padding android:left="5dp" android:top="3dp" android:right="5dp" android:bottom="3dp" />
</shape>
For the slection and click you can use selector exemple :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/clr_main_green_pressed" android:state_selected="true" android:state_window_focused="false"/>
<item android:drawable="#color/clr_main_green_pressed" android:state_selected="true"/>
<item android:drawable="#color/clr_main_green_pressed" android:state_pressed="true" android:state_selected="false"/>
<item android:drawable="#android:color/white" android:state_selected="false"/>
</selector>
Some shape/color/ changes exemple :
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<corners android:radius="12dp" />
<solid android:color="#android:color/white" />
<padding
android:bottom="0dp"
android:left="0dp"
android:right="0dp"
android:top="0dp" />
</shape>
And use the two together exemple :
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#drawable/rounded_border"/>
<item android:drawable="#drawable/selector_button"/>
</layer-list>

Categories

Resources