How do I give a custom style that would enable me to put in corners and a drawable in the same in a button. The current way I am implementing this gives me an error:
Main Implemented background:
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#drawable/comment"
android:state_focused="false"
android:state_pressed="false"
android:state_selected="false"/>
<item android:drawable="#drawable/comment_pressed"
android:state_focused="false"
android:state_pressed="true"
android:state_selected="false"/>
</selector>
comment.xml:
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="#color/purple"/>
<corners android:radius="4dp"/>
</shape>
comment_pressed:
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="#drawable/abs__list_selector_background_transition_holo_light"/>
<corners android:radius="4dp"/>
</shape>
Here the #drawable/abs__list_selector_background_transition_holo_light is a drawable from the Sherlock library. And I do know that the error is from here. Is there anyway that I could achieve this ?? Curved edges plus a drawable item ?
If you look at the resources used in the Sherlock library you will see that abs__list_selector_background_transition_holo_light contains the following:
<transition xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/abs__list_pressed_holo_light" />
<item android:drawable="#drawable/abs__list_longpressed_holo" />
</transition>
Which refers to the following 9Patch images:
abs__list_pressed_holo_light
abs__list_longpressed_holo
The <corners android:radius="x"/> attribute is used for <shape> items, and has no meaning for 9Patch drawables.
To get around this, you could either;
create your own 9Patch drawables with radiused corners in a graphic editor, and use these instead of the default ones in the Sherlock library.
or
replace the 9Patch items in the <transition> with your own "rectangle" <shape> items. Set the color of these <shape> items to mimic the colors used in the 9Patches. You would then be able to use the <corners> attribute with these '' items.
Edit:
You need to understand that the abs__list_pressed_holo_light and abs__list_longpressed_holo files in the Sherlock library are not solid color hex values. They are nine-patch png bitmaps. Where you wrote;
<solid android:color="#drawable/abs__list_selector_background_transition_holo_light"/>
...in your xml, you were actually pointing at two bitmaps instead of at a color value.
Of the two possible solutions I suggested previously, I think the second option is probably best in your case. Here is a step by step of how you would do it.
1) Create two <shape> drawables and save them in your drawable folder:
my_holo_light_blue_shape
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="#9933B5E5"/>
<corners android:radius="4dp"/>
</shape>
my_holo_dark_blue_shape
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="#CC0099CC"/>
<corners android:radius="4dp"/>
</shape>
2) Create your own <transition> drawable and once again save it in your drawable folder:
my_holo_blue_transition
<transition xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/my_holo_light_blue_shape" />
<item android:drawable="#drawable/my_holo_dark_blue_shape" />
</transition>
3) You can then use your new <transition> drawable for the pressed state in your selector:
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#drawable/comment"
android:state_focused="false"
android:state_pressed="false"
android:state_selected="false"/>
<item android:drawable="#drawable/my_holo_blue_transition"
android:state_focused="false"
android:state_pressed="true"
android:state_selected="false"/>
</selector>
Related
Having defined drawable with given png for each items in the drawable for different states, if want to having border around the png for that item, how to do it? re-cut the png is not option here.
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:state_focused="true"
android:drawable="#drawable/box_checked_png” />
<item android:state_checked="false" android:state_focused="true"
android:drawable="#drawable/white_box_png” />
<item android:state_checked="false"
android:drawable="#drawable/white_box_png” />
<item android:state_checked="true"
android:drawable="#drawable/box_checked_png” />
</selector>
The method which i find best is to add a background to the check box.
This is a rectangle drawable background.xml (put into res/drawable folder).
Let's say you are making a shape like this one :
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
<solid android:color="#ffffff" />
<stroke android:width="1dip" android:color="#4fa5d5"/>
</shape>
And where you have your check box, you just set the background made before:
<CheckBox android:text="Some me" android:background="#drawable/background"/>
Newbie in Android.
I have the following defined in res/drawable/ for a button in a menu that's defined in style.xml
<style name="menu_icon">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">#dimen/menu_item_height</item>
<item name="android:background">#drawable/menu_item_bg_sel</item>
</style>
Now, menu_item_bg_sel in drawable has two different color gradients for 2 states that I am interested in- pressed and selected.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<layer-list>
<item>
<shape>
<gradient android:angle="180"
android:endColor="#color/background_menu_gray_selected2"
android:centerColor="#color/background_menu_gray_selected1"
android:startColor="#color/background_menu_gray_selected" />
</shape>
</item>
</layer-list>
</item>
<item android:state_selected="true">
<layer-list>
<item>
<shape>
<gradient android:angle="180" android:endColor="#color/background_menu_home2"
android:centerColor="#color/background_menu_home1"
android:startColor="#color/background_menu_home" />
</shape>
</item>
</layer-list>
</item>
<item android:drawable="#color/transparent"/>
However, when I press the button (that transient state) the button still creates the gradient taking colors from the selected_state only.
What am I doing wrong? Any ideas?
state_selected is commonly used when navigating using d-pads or maybe a pen like what Samsung Notes so I suggest not to use state_selected since when you press automatically it will be selected or gain focus although selected and focus are kind or different. I suggest to use state_pressed, state_focused and state_hovered instead.
For more info click here
You can use this code. You can copy paste this code into one drawable file. You can assign different drawable files or define shapes in this file itself for the different states.I have assigned a drawable file for the focused state as an example.
simple_button_states.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_focused="true"
android:drawable="#drawable/rounded_edittext_focused"
/>
<!--pressed -->
<item
android:state_pressed="true" />
<!--selected -->
<item
android:state_selected="true" />
<!-- focused -->
<item
android:drawable="#drawable/rounded_edittext_unfocused"/>
</selector>
round_edittext_focused.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android"
>
<solid android:color="#FFFFFF" />
<stroke
android:width="2dp"
android:color="#color/CornflowerBlue" />
<corners
android:topLeftRadius="4dp"
android:topRightRadius="4dp"
android:bottomLeftRadius="4dp"
android:bottomRightRadius="4dp"
/>
</shape>
Finally assign the background of the actual button as the drawable file that you have declared above.
<Button
android:layout_width="150dp"
android:layout_height="wrap_content"
android:background="#drawable/simple_button_states"
/>
Hope this helps
I had this working perfectly, although I need to change my code to listSelector, and now I don't know how to do it in order to maintain the border on left side.
In all listview lines I had one border:
border.xml
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#E30E0E"/>
</shape>
</item>
<item android:left="5dip">
<shape android:shape="rectangle">
<solid android:color="#E3E3E3"/>
</shape>
</item>
</layer-list>
This sets the left side of each line, a border with color. But, as you can see, it has a default Solid color for background. With this code, whenever the user click on the item of the listview he doesn't understand if he has already clicked or not, because it has this solid color which doesn't change onState().
To make this working, I needed to create a listSelector with background gradients on state select plus state pressed.
selector.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/listview_gradient_bg"/>
<item android:state_pressed="true"
android:drawable="#drawable/listview_gradient_bg_hover" />
<item android:state_selected="true"
android:state_pressed="false"
android:drawable="#drawable/listview_gradient_bg_hover" />
</selector>
So, my question is: there's any way to "link" this two different piece of code?
Try to put this
<item android:left="5dip">
<shape android:shape="rectangle">
<solid android:color="#E3E3E3"/>
</shape>
</item>
into the listview_gradient_bg and listview_gradient_bg_hover drawables, then link the selector to each line in the adapter.
I am trying to draw border in one side only to ImageButton object,
like in CSS: border-left: 2px solid black;.
Is there any way to do that with style only? (Without inserting a blank view between them)
Thank you!
EDIT:
I used the <selector> tag with the ImageButton.
After alot of searching, I found way to do that.
Create xml file that containce the border style (border_style.xml):
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape xmlns:android="http://schemas.android.com/apk/res/android"android:shape="rectangle">
<!-- The border color -->
<solid android:color="#000" />
</shape>
</item>
<item android:left="1dp">
<shape xmlns:android="http://schemas.android.com/apk/res/android"android:shape="rectangle">
<!-- The fill color-->
</shape>
</item>
</layer-list>
then in the selector, you write like that:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<!-- Press Event -->
</item>
<item android:state_focused="true">
<!-- Focuse Event -->
</item>
<item android:drawable="#drawable/border_style.xml" />
</selector>
You do not able to do like css. You need to create a xml and put the xml in android drable folder and send the image-button background
And rectangle drawable back.xml (put into res/drawable folder):
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
<solid android:color="#ffffff" />
<stroke android:width="1dip" android:color="#4fa5d5"/>
</shape>
I'm trying to assing a color selector to an extended class of LinearLayout, so, i think its like if we speak about linearLayout.
i followed the instructions on this post, the answer talking about shapes.
Now i have 3 xml on drawables folders:
normal.xml file
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<solid android:color="#ffffffff" />
</shape>
pressed.xml file
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" >
<solid android:color="#00000000" />
</shape>
and finally, bg.xml file
<?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/pressed" />
<item android:state_focused="true" android:drawable="#drawable/pressed" />
<item android:state_selected="true" android:drawable="#drawable/pressed" />
<item android:drawable="#drawable/normal" />
</selector>
I am accessing this in the following way:
Drawable d = getResources().getDrawable(context.getResources().getIdentifier("mypackageuri.tProject:drawable/bg", null, null));
view.setBackgroundDrawable(d);
The "normal" state its fine, with the color set at "normal.xml", but no way with the other ones, I press my view and nothing happens, it's not changing color in any way...
I can't see what i'm doing wrong...
Thank you
Your view needs to be clickable in order to get the state pressed when you click on it.
Use :
view.setClickable(true);
or in the layout xml :
android:clickable="true"