I'm trying to use the the standard android button in my layout, but make the background transparent when not pressed, or making text left or right justified, or whatever custom modification I want. Is there some simple way I'm missing to inherit from the standard button but change a few properties? I've looked at the two posts below, and can't get them to work and am too new to leave comments on those pages, plus both of those solutions have problems anyway:
I've tried copying #android:drawable/btn_default source per How to disable the default Button color changing property on onClick, but all of the resources linked to from there are private. I tried to find the source for those private files, but some of them i can't find even if i go into the android sdk folder to get the raw files. Where can i find these files, if this is the way to edit the standard button? copying those private files is definately not ideal though, if the standard selected/pressed/whatever button changes in another api i'll still be using the old ones in this case and have inconsistent buttons...
Also, I've seen Standard Android Button with a different color which is good for making custom buttons in general, but how do I set it to be exactly like the standard button? i.e. what are the colors, are the gradients right, etc. Again, this has the problem that if standard button changes i'll still be using old values.
Use styles on your buttons:
<Button id= ... style="#style/myButton" />
values/styles.xml:
<style name="myButton" parent="#android:style/Widget.Button">
<item name="android:background">#drawable/myBackground</item>
</style>
To deal with various button states (e.g. pressed, etc) you'll need a selector drawable resource, example drawable/myBackground.xml:
<?xml version="1.0" encoding="utf-8" ?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Non focused states
-->
<item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="#drawable/button_unfocused" />
<item android:state_focused="false" android:state_selected="true" android:state_pressed="false" android:drawable="#drawable/button_unfocused" />
<!-- Focused states
-->
<item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="#drawable/button_focus" />
<item android:state_focused="true" android:state_selected="true" android:state_pressed="false" android:drawable="#drawable/button_focus" />
<!-- Pressed
-->
<item android:state_pressed="true" android:drawable="#drawable/button_press" />
</selector>
The drawable/button_press.xml could specify a gradient, shape, borders, etc, as you need.
An example button_press.xml that does a background gradient, rounded corners, and border:
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<stroke android:width="1dp" android:color="#FF404040" />
<corners android:radius="6dp" />
<gradient android:startColor="#FF9B00" android:centerColor="#FFB300" android:endColor="#FFCA00" android:angle="90" />
</shape>
The first part of CSmith's answer about using styles with parent="#android:style/Widget.Button" is the best way to change button properties like left or right justified text. However the rest of the answer describes how to create your own selectors, so I thought I'd add my solution to inherit selectors from the default button, and then just override specific ones you want to change:
just put android:drawable="#android:drawable/btn_default" for those selectors you want default behavior for, and then you can just specify custom fields for only those selectors you want to change. in my case of trying to have a button that inherits all the selectors but has a transparent background normally instead of the gray one, do the following (duplicating the first part of CSmith's answer here for clarity, thanks CSmith!):
Define a button using a custom style:
<Button id= ... style="#style/myButton" />
res/values/styles.xml:
<style name="myButton" parent="#android:style/Widget.Button">
<item name="android:background">#drawable/myBackground</item>
...other changes to default button...
</style>
then, to inherit all selectors and just overwrite the ones that show gray:
in res/drawable/myBackground.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_window_focused="false"
android:drawable="#drawable/transparent_btn" />
<item android:state_pressed="true"
android:drawable="#android:drawable/btn_default" />
<item android:state_focused="true"
android:drawable="#android:drawable/btn_default" />
<item android:drawable="#drawable/transparent_btn" />
</selector>
and, in res/drawable/transparent_btn.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="#android:color/transparent" />
</shape>
NOTE: this example doesnt worry about state_enabled, if you want specific behavior for whether a button is enabled or not just overwrite those selectors as well.
Related
I have two buttons in layout,let suppose button A and button B and I want that when user touch any of two button,their background color should change for that moment.
code
``
<item android:state_hovered="true"
android:drawable="#drawable/state_hovered"/>
<item android:state_pressed="true"
android:drawable="#drawable/state_pressed"/>
<item android:drawable="#drawable/state_deafult" />
``
State_pressed working...but state_hovered is not working.
So,please suggest a way to do so.
Thanks in advance.
Change color while button is pressed?
See an answer to this question, asked previosly in StackOverflow:
Create a my_button_background.xml file in drawable folder:
<?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/blue" />
<item android:state_focused="true" android:drawable="#color/gold" />
<item android:drawable="#color/grey" />
</selector>
And use this in layout file:
android:background="#drawable/my_button_background"
And read more about Android's Color State. Basically, you can assign colors, drawables, shapes, etc. to different states of views, such as enabled, disabled, focused, clicked, etc.
I currently have a set of ToggleButtons, enclosed by a RadioGroup, with each button referring to a selector that changes the color of the button state, and writing code to implement the radio-buttonesque behavior. This works great. (EDIT: I should mention that the selector is what the android:background element of the button is referred to)
The Selector is something like this
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/gold"
android:state_checked="true" />
<item android:drawable="#color/white" />
</selector>
Now I want a second set of buttons to have the exact same behavior. The catch is that this time, I want Images on some of them, not text.
There are lots of StackOverflow posts on how to change the Image based on the Button's state but I don't want to change the image based on the state. I want to change the color of the button based on the state (the images have transparent backgrounds).
I'm really trying to avoid modifying the button images themselves.
I believe the solution involves making a selector with a layer-list but this is new territory for me.
Create a xml named colors.xml in res/values folder:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="red">#ff0000</color>
<color name="green">#00ff00</color>
</resources>
In drawable folder, create a xml file my_btn_toggle.xml:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="false" android:drawable="#color/red" />
<item android:state_checked="true" android:drawable="#color/green" />
</selector>
and in xml section define your toggle button:
<ToggleButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/btntoggle"
android:background="#drawable/my_btn_toggle"/>
I think you are looking for tinting attributes - mentioned here.
In your case, try to set ColoStateList to android:tint attribute. In ColorStateList doc you have example that shows color selector - like drawable selector, but for colors.
(I'm not sure it's already support pre-Lollipop devices or you should do it programatically with PorterDuff filters for older versions.)
What apparently one needs to do is create a layered drawable in the selector like this:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true">
<layer-list>
<item android:drawable="#color/gold"
android:gravity="fill"/>
<item android:drawable="#drawable/image"
android:gravity="fill"/>
</layer-list>
</item>
<item android:state_checked="false">
<layer-list>
<item android:drawable="#color/white"
android:gravity="fill"/>
<item android:drawable="#drawable/image"
android:gravity="fill"/>
</layer-list>
</item>
</selector>
The standard approach to variable state button selectors is what Priyank mentions above. Just the graphic must be transparent and declared like above, such that it will be layered with a background color to pull off the color state change
I have a few buttons which I want to highlight only at the borders.
That is, I want the borders of the buttons to glow with a specific color on some action taken. How do I change the border programatically?
Is it possible with drawables? How?
You can have two drawables one for selected state and one for normal state, please go
through following link:
StateListDrawable
See here: http://developer.android.com/reference/android/widget/ImageButton.html
And also here: http://groups.google.com/group/android-developers/tree/browse_frm/thread/1906f24707594f67/17322a04f7af1a5b for Romain Guy's answer:
In res/drawable, create a file called for instance mybutton_background.xml
and put something like this inside:
<?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/button_background_focus" />
<item android:state_focused="true" android:state_pressed="true"
android:drawable="#drawable/button_background_pressed" />
<item android:state_focused="false" android:state_pressed="true"
android:drawable="#drawable/button_background_pressed" />
<item android:drawable="#drawable/button_background_normal" />
</selector>
Then set this drawable as the background of your button with
android:background="#drawable/mybutton_background"
I want to set colors for clicking instead of images. Doing so doesn't give any errors except for force-closing at runtime. Is it even possible to do this or can selector only be used for images?
Code I'm trying below:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:state_pressed="true" android:background="#00C0FF" />
<item android:state_focused="true" android:state_pressed="false" android:background="#0060FF" />
<item android:state_focused="false" android:state_pressed="true" android:background="#00C0FF" />
<item android:state_focused="false" android:state_pressed="false" android:background="#FFFFFF" />
</selector>
Not per the documentation
<item>
Defines a drawable to use during certain states, as described by its attributes. Must be a child of a <selector> element.
android:drawable
Drawable resource. **Required.** Reference to a drawable resource.
You can create a simple shape drawable to hold the color
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#33FF33"/>
</shape>
Is it even possible to do this or can selector only be used for images?
No, this doesn't make any sense (to me at least). Without a 'drawable', how will it know exactly 'what' to set to state_focused and state_pressed?
Why not just create some single colour drawables (bitmaps for example) and provide those as the drawables for each item?
When the user presses a ListView item (android:state_pressed="true") it flashes a shade of yellow (or you can press and hold).
What drawable is this? I've created my own selector because I want my own ListView item color , but I lose the pressed color.
There's an Android doc about skinning buttons that references #ffff0000, but this produces red.
Does anyone know what it is and how to reference it?
The default system resources can be found in <android-sdk>/platforms/android-<version>/data/res. In particular, the list selector is defined in drawable/list_selector_background.xml:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_window_focused="false"
android:drawable="#color/transparent" />
<!-- Even though these two point to the same resource, have two states so the drawable will invalidate itself when coming out of pressed state. -->
<item android:state_focused="true" android:state_enabled="false"
android:state_pressed="true"
android:drawable="#drawable/list_selector_background_disabled" />
<item android:state_focused="true" android:state_enabled="false"
android:drawable="#drawable/list_selector_background_disabled" />
<item android:state_focused="true" android:state_pressed="true"
android:drawable="#drawable/list_selector_background_transition" />
<item android:state_focused="false" android:state_pressed="true"
android:drawable="#drawable/list_selector_background_transition" />
<item android:state_focused="true"
android:drawable="#drawable/list_selector_background_focus" />
</selector>
The drawable that is shown on a press, list_selector_background_transition, is not a single color but two 9-patch images, a yellow and a white one, with an animated transition between them.
<transition xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#android:drawable/list_selector_background_pressed" />
<item android:drawable="#android:drawable/list_selector_background_longpress" />
</transition>
The thing your talking about is the Android OS built-in selector.
Make your own highlight with an xml-file in your drawable-folder like this:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:color="#YOURCOLOR" />
<item android:color="#FE896F" />
</selector>
Then in your XML-file there you have your ListView.
android:textColor="#drawable/highlight" //For text to appear like YOURCOLOR
//or if you wish the background
android:background="#drawable/highlight" //For the background to appear like YOURCOLOR
I hope this is it and tell me if this worked or not!
A color is defined as #AARRGGBB where AA represents the alpha (transparency) value, RR the amount of red, GG the amount of green, and BB the amount of blue. Thus #ffff0000 is solid and all red. If you want orange, you want to add some green, i.e: #ffffA500. Google for RGB color values to see pages of colors with their rgb values.
I have used a color picker tool in a photo editing application to find the outer and inner colors of the gradient and made my own.
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="#ffb300"
android:centerColor="#ffc800"
android:endColor="#ffb300"
android:angle="270"/>
</shape>