I am setting the default look of all buttons in my application as follows. When I do this, nothing happens on click of the buttons, even though I have defined all functions correctly. In fact, when I comment out the line <item name="android:buttonStyle">#style/button</item>, the button clicks work fine (but of course, they use the default android style). Application theme is also defined in the manifest: android:theme="#style/AppTheme"
Can someone please tell me why this is happening? Thanks.
button_shape.xml in res/drawable:
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<corners
android:radius="10dp" />
<gradient
android:angle="90"
android:startColor="#6AA4ED"
android:endColor="#927BED"/>
<padding
android:left="10dp"
android:right="10dp"
android:top="12dp"
android:bottom="12dp" />
</shape>
styles.xml:
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="AppBaseTheme" parent="android:Theme.Light">
</style>
<style name="AppTheme" parent="AppBaseTheme">
<item name="android:buttonStyle">#style/button</item>
</style>
<style name="button">
<item name="android:background">#drawable/button_shape</item>
</style>
Change your
<style name="button">
<item name="android:background">#drawable/button_shape</item>
</style>
to
<style name="button" parent="#android:style/Widget.Button">
<item name="android:background">#drawable/button_shape</item>
</style>
adding the correct parent property will make you buttons click-able.
For different states of button you can use
<?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="#color/MyButtonDarkGray"
android:endColor="#color/MyButtonLightGray"
android:angle="270" />
<stroke
android:width="0dp"
android:color="#color/Gray" />
<corners
android:radius="3dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item android:state_focused="true" >
<shape>
<gradient
android:endColor="#color/LightGreen"
android:startColor="#color/DarkGreen"
android:angle="270" />
<stroke
android:width="0dp"
android:color="#color/Gray" />
<corners
android:radius="3dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item>
<shape>
<gradient
android:endColor="#color/LightGreen"
android:startColor="#color/DarkGreen"
android:angle="270" />
<stroke
android:width="0dp"
android:color="#color/Gray" />
<corners
android:radius="3dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
</selector>
Related
I'm trying to apply a theme to my entire android application, which for now only changes the looks of all the buttons in the app. Currently I have no errors, and the app will launch in my virtual machine(I'm using eclipse). My problem is that despite not having any errors, the theme is not applied to the app. Here's how I have everything set up:
res/color/custom_button.xml:
<?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="#color/yellow1"
android:endColor="#color/yellow2"
android:angle="270" />
<stroke
android:width="3dp"
android:color="#color/grey05" />
<corners
android:radius="3dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item android:state_focused="true" >
<shape>
<gradient
android:endColor="#color/orange4"
android:startColor="#color/orange5"
android:angle="270" />
<stroke
android:width="3dp"
android:color="#color/grey05" />
<corners
android:radius="3dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item>
<shape>
<gradient
android:endColor="#color/white1"
android:startColor="#color/white2"
android:angle="270" />
<stroke
android:width="3dp"
android:color="#color/grey05" />
<corners
android:radius="3dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
</selector>
res/values/styles.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources >
<style name="PurdueButtons" parent="android:style/Widget.Button">
<item name="android:background">#color/custom_button</item>
</style>
<style name="PurdueTheme" parent="android:Theme.Holo">
<item name="android:buttonStyle">#style/PurdueButtons</item>
</style>
</resources>
Relative line from AndroidManifest:
android:theme="#style/PurdueTheme" >
All of my colors are defined in res/values/colors.xml, and I know I have this set up correctly. Eclipse seems to have no problem locating everything, so I am confused as to why the theme, mainly the changes I have made to the buttons, is not being applied.
i have buttons with rounded corners, how to make them looks like this :
do i need to define my own style? I don't want to change my code, only XML resources, if it possible how to apply this(border radius = 0) style to my buttons?
http://android-holo-colors.com/
This service generate Holo-styles for checked components(button is your case) and then you can download zip with xml's.
Use it to fast&easy implement, or code samples.
I think the only way for you to get what you want it to write XML to make it possible.
In the drawable folder, create an xml file that will represent the shape of your button.
for example
<?xml version="1.0" encoding="utf-8" ?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
<shape>
<solid
android:color="#ff00ff" />
<stroke
android:width="1dp"
android:color="#20f8f6" />
<corners
android:radius="6dp" /> // set to 0 or erase it for sharp corners
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item>
<shape>
<gradient
android:startColor="#ff00ff"
android:endColor="#992f2f"
android:angle="270" />
<stroke
android:width="1dp"
android:color="#992f2f" />
<corners
android:radius="6dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
</selector>
then you need to create a style in your styles.xml file
<resources>
<style name="button_text" >
<item name="android:layout_width" >fill_parent</item>
<item name="android:layout_height" >wrap_content</item>
<item name="android:textColor" >#ffffff</item>
<item name="android:gravity" >center</item>
<item name="android:layout_margin" >3dp</item>
<item name="android:textSize" >30dp</item>
<item name="android:textStyle" >bold</item>
<item name="android:shadowColor" >#000000</item>
<item name="android:shadowDx" >1</item>
<item name="android:shadowDy" >1</item>
<item name="android:shadowRadius" >2</item>
</style>
</resources>
and when you declare your button in the xml
<Button
android:background="#drawable/red_button"
android:id="#+id/button1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Styled Button"
style="#style/button_text" />
Check out this github post here.
Mainly check out the library provided there and added to that source code.
SnapShot:
add xml(example.xml) in folder drawable:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<corners android:topLeftRadius="4dip"
android:topRightRadius="4dip"
android:bottomLeftRadius="4dip"
android:bottomRightRadius="4dip"/>
<solid android:color="#1FC1BA"/>
</shape>
</item>
<item android:state_focused="true">
<shape android:shape="rectangle">
<corners android:topLeftRadius="4dip"
android:topRightRadius="4dip"
android:bottomLeftRadius="4dip"
android:bottomRightRadius="4dip"/>
<solid android:color="#26262C"/>
</shape>
</item>
<item android:state_pressed="true">
<shape android:shape="rectangle">
<corners android:topLeftRadius="4dip"
android:topRightRadius="4dip"
android:bottomLeftRadius="4dip"
android:bottomRightRadius="4dip"/>
<solid android:color="#1B978F"/>
</shape>
</item>
</selector>
on your folder layout(activity_main.xml) in the button
android:background="#drawable/example"
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="exampleText"
android:layout_gravity="center"
android:background="#drawable/example"
android:textColor="#ffffffff" />
I think below code is exactly what you are looking for.
<?xml version="1.0" encoding="utf-8" ?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape>
<gradient
android:startColor="#32a5cf"
android:endColor="#32a5cf"
android:angle="270" />
<stroke
android:width="7dp"
android:color="#9032a5cf"
/>
<corners
android:radius="6dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
</selector>
I know there are similar post to this but I couldn't find my answer in any of them. So, I have this drawable XML:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="true">
<bitmap
android:src="#drawable/bm_btn_background"
android:tileMode="repeat"
android:gravity="center" />
</item>
<item android:state_enabled="true">
<shape android:shape="rectangle">
<gradient
android:startColor="#a0e0b071"
android:endColor="#a0a67637"
android:angle="270" />
<stroke
android:width="1dp"
android:color="#5c3708" />
<corners
android:radius="5dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item android:state_pressed="true" >
<shape>
<gradient
android:startColor="#a0a67637"
android:endColor="#a0e0b071"
android:angle="270" />
<stroke
android:width="1dp"
android:color="#5c3708" />
<corners
android:radius="5dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
I am trying to create a button with a repeated image as background and a gradient applied to it. With this code I only see the background image, not the gradient nor the border and the rounded corners. Also, when I click the button, it doesn't change (the gradient is supposed to change). I don't know what is wrong with this code? If instead of a selector I use a layer-list, I get the desired result but it doesn't change either when I press the button. Thanks for your help!
Your code for the selector is wrong because:
You have two elements for the same state and as the selector encounters the first state(state_enabled) for the Bitmap element it will stop there and your gradient will never appear(for this you should use a layer-list that has as items the Bitmap and the gradient on top)
The selector will match states in order. As you press the Button the state_pressed will never be activated because the selector will match first the state_enabled that is on the first element(for this you should move the code for the state_pressed above the state_enabled elements).
In fact you should just remove the state_enabled and let the Bitmap + gradient be the default value for the Button. Bellow is your selector(I assumed you only want to change gradient on the image(but the image should appear even in the pressed state, if this isn't the wanted behavior leave only the gradient for the state_pressed)):
<?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>
<bitmap android:gravity="center" android:src="#drawable/bm_btn_background" android:tileMode="repeat" />
</item>
<item>
<shape>
<gradient android:angle="270" android:endColor="#a0e0b071" android:startColor="#a0a67637" />
<stroke android:width="1dp" android:color="#5c3708" />
<corners android:radius="5dp" />
<padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />
</shape>
</item>
</layer-list>
</item>
<item android:state_enabled="true">
<layer-list>
<item>
<bitmap android:gravity="center" android:src="#drawable/bm_btn_background" android:tileMode="repeat" />
</item>
<item>
<shape android:shape="rectangle">
<gradient android:angle="270" android:endColor="#a0a67637" android:startColor="#a0e0b071" />
<stroke android:width="1dp" android:color="#5c3708" />
<corners android:radius="5dp" />
<padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />
</shape>
</item>
</layer-list>
</item>
</selector>
Take a look on your state attrubute
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Non focused states -->
<item android:drawable="#drawable/nicebuttonround" android:state_focused="false" android:state_pressed="false" android:state_selected="false"/>
<item android:drawable="#drawable/nicebuttonround" android:state_focused="false" android:state_pressed="false" android:state_selected="true"/>
<!-- Focused states -->
<item android:drawable="#drawable/nicebuttonroundi" android:state_focused="true" android:state_pressed="false" android:state_selected="false"/>
<item android:drawable="#drawable/nicebuttonroundi" android:state_focused="true" android:state_pressed="false" android:state_selected="true"/>
<!-- Pressed -->
<item android:drawable="#drawable/nicebuttonroundi" android:state_pressed="true" android:state_selected="true"/>
<item android:drawable="#drawable/nice22i" android:state_pressed="true"/>
</selector>
For repeating background as image you just have to create 9 pitch images.
in my case i am using this. try it
<item android:state_pressed="true">
<shape>
<solid android:color="#color/mediumGray" />
<stroke
android:width="1px"
android:color="#color/darkGray" />
<padding
android:bottom="2dp"
android:left="1dp"
android:right="1dp"
android:top="2dp" />
<corners
android:bottomLeftRadius="7sp"
android:bottomRightRadius="7sp"
android:topLeftRadius="7sp"
android:topRightRadius="7sp" />
</shape>
</item>
<item android:state_focused="true">
<shape>
<solid android:color="#color/mediumGray" />
<stroke
android:width="1px"
android:color="#color/darkGray" />
<padding
android:bottom="2dp"
android:left="1dp"
android:right="1dp"
android:top="2dp" />
<corners
android:bottomLeftRadius="7sp"
android:bottomRightRadius="7sp"
android:topLeftRadius="7sp"
android:topRightRadius="7sp" />
</shape>
</item>
<item>
<shape>
<solid android:color="#color/lightGray" />
<stroke
android:width="1px"
android:color="#color/blackTransparent" />
<padding
android:bottom="2dp"
android:left="1dp"
android:right="1dp"
android:top="2dp" />
<corners
android:bottomLeftRadius="7sp"
android:bottomRightRadius="7sp"
android:topLeftRadius="7sp"
android:topRightRadius="7sp" />
</shape>
</item>
I have added extra transperent space to the right side of image using photoshop canvas size option and it works fine for me. download below image to see demo.
I use this layout for button color (blue):
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" >
<shape>
<solid
android:color="#449def" />
<stroke
android:width="1dp"
android:color="#2f6699" />
<corners
android:radius="3dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item>
<shape>
<gradient
android:startColor="#449def"
android:endColor="#2f6699"
android:angle="270" />
<stroke
android:width="1dp"
android:color="#2f6699" />
<corners
android:radius="4dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
</selector>
When i try to change the color ,it doesn't change!It remains blue whatever changes i do.
I use in strings.xml:
<style name="mybuttons">
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:textColor">#ffffff</item>
</style>
Here is a part from main.xml:
<Button
android:id="#+id/select_c"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/choose_c"
android:layout_marginTop="120dip"
android:background="#drawable/blue_button"
style="#style/mybuttons"
/>
You should specify items in selector with android:state_pressed and android:state_focused
You've not provided enough information to know what the problem is - where's the XML layout?
To use a selector drawable you need to create it (as you have done) but then apply it to your Button. I would expect to see an attribute like background="#drawable/my_selector_drawable" in there, to apply the button background to the button in your layout.
First off i want to say im attempting (and mostly succeeding) to use purely XML for styling purposes.
I ahve a list view, displaying the standard textview. Everyhting is working, including my custom xml defined drawables.
Except that my clear "buttons" turn green where transparent, as is the android 2.2 default. Is there any way to override this?
Attached below is the drawable code for the button. The Top colors for gradients are solid, bottoms are 100% transparent.
<?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="#color/butttop"
android:endColor="#color/buttbot"
android:angle="270"
android:dither="true"
/>
<!-- <stroke
android:width="1dp"
android:color="#color/stroke2" />-->
<corners
android:radius="20dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item android:state_focused="true" >
<shape>
<gradient
android:endColor="#color/focustop"
android:startColor="#color/focusbot"
android:angle="270" />
<!--<stroke
android:width="1dp"
android:color="#color/stroke1" />-->
<corners
android:radius="20dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
<item>
<shape>
<gradient
android:endColor="#color/butttop"
android:startColor="#color/buttbot"
android:angle="90" />
<!--<stroke
android:width="1dp"
android:color="#color/stroke1" />-->
<corners
android:radius="20dp" />
<padding
android:left="10dp"
android:top="10dp"
android:right="10dp"
android:bottom="10dp" />
</shape>
</item>
</selector>
next is the style pertaining to them, incase its needed. *Note: menubutt is the name of the above file.
<style name="DrawerItems1">
<item name="android:textSize">16px</item>
<item name="android:textColor">#FFFFFF</item>
<item name="android:shadowColor">#000000</item>
<item name="android:shadowDx">1</item>
<item name="android:shadowDy">1</item>
<item name="android:shadowRadius">3</item>
<item name="android:typeface">sans</item>
<item name="android:textStyle">bold</item>
<item name="android:background">#drawable/menubutt</item>
</style>
Answer found at https://stackoverflow.com/a/6201407/924939. Works for me.
You have to set android:listSelector="#drawable/listcolor" in ListView.
Then you define a drawable named listcolor.xml with a transparent solid color (or whatever you need), so that list item background will appear and default green or orange color will disappear:
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#00000000"/>
</shape>
This may also have to be mixed with the following code in your ListView:
android:cacheColorHint="#color/transparent"
android:background="#color/transparent"