How to shift text on a button which is currently pressed? - android

I want to shift a little bit the text on the button that is currently pressed. In my case the button has custom background and the button will look much better if the text will be shifted.
I made two NinePath images with different paddings:
And set them using a selector:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/btn_pressed" android:state_pressed="true"/>
<item android:drawable="#drawable/btn"/>
</selector>
This doesn't work, the text remains on its position when the button is pressed (and the background is swapped).
Are my NinePath images OK? Is there any way to shift the text without setting touch listeners?
P.S. Same question was asked already but the "answer" is exactly the solution I tried: https://stackoverflow.com/a/7677098/694770

Your 9-patch images look good. That said, I came across this question because I had exactly the same problem, and my images didn't work either.
I ended up subclassing Button and messing with padding. More info here

Try this
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:text="Pressed state text" android:state_pressed="true"/>
<item android:text="Default text"/>
</selector>

Related

Image Button change size onClick

On Android Studio I made an image perform like a button. Though what I can't find anywhere is how do I make it so when I click on the image aka the button it becomes a bit smaller and when you release it comes back to original size. Ik that onClick you can perform functions and activities and what not but how do I change the actual button image so as I'm holding down the click button it gets smaller and when i release it comes back to its original size.
You can use selectors to achieve that. For example define this in your drawable folder:
selector_state_xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/button_bg_selected" android:state_selected="true"></item>
<item android:drawable="#drawable/button_bg_pressed" android:state_pressed="true"></item>
<item android:drawable="#drawable/button_bg_normal"></item>
</selector>
And use this as your View drawable:
<Button
android:id="#+id/your_button"
android:background="#drawable/selector_state_xml"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
An alternative could be using ScaleAnimation

Why does a Button loses its original behaviour after changing its color?

I am writing an Android app and now I am styling it. I am using a custom theme which is a child of Theme.Holo.Light. I really like Theme.Holo.Light because its buttons have a special effect when you click and hold it. Like the lower button in the picture below:
Not click:
click:
The upper button has been changed color. Now when I click on that button, it doesn't have that effect. I really don't understand why. Can anyone tell me why this happens and how can I get the same effect with a colored button?
And also, the colored button seems fatter.
This is because the button uses a selector to display different colors/effects/drawables based on the state of the click. You can check out the link on Color State List Resource.
To create your own you have to create a slecetor cml file and put it in your drawables folder.
For example.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/shape_btn_default_normal_gray" android:state_enabled="true" android:state_pressed="false"/>
<item android:drawable="#drawable/shape_btn_default_pressed_gray" android:state_pressed="true"/>
<item android:drawable="#drawable/shape_btn_default_disabled_gray"/>
</selector>
or with colors
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/dark_green" android:state_enabled="true" android:state_pressed="false"/>
<item android:drawable="#color/light_green" android:state_pressed="true"/>
<item android:drawable="#color/gray"/>
</selector>
To apply this you have to set the background drawable in your layout xml like this.
<Button
android:id="#+id/my_btn"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Some text"
android:background="#drawable/selector_btn_default_gray"/>
That is the "ripple effect" of material design.You have define you own style for that effect.Link below may help you or you may search for many other answers on StackOverflow. Material effect on button with background color
It does not loses its behavior you can see after click (in your second image) the button show same scale as the above have...so by default the background is set as to show that it is button (like with padding or so) and can changes to show oncklick effect...
So when you set your desire background to button...It takes complete change on what is on presently on it and then you have to manually set onclick effect..

Android make check in or check out button with style

I need to make a style like following screen shot
PLZ NEED HELP !!!!
I have tried using make custom style
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/buttion_inner_icon" android:state_checked="true"/>
<item android:drawable="#drawable/buttion_inner_icon" android:state_checked="false"/>
</selector>
But its not as I want
Please help me to make view same as screen shot
You have setted the same drawable when state_checked = true and state_checked = false.
You must have two differents drawables.
You can use a ToggleButton for this. In your xml file, set the text to an empty string, otherwise it will show 'on' and 'off'.
android:textOff=""
android:textOn=""
Then you have to add two drawables: one with the handle on the left side (so that 'check in' is visible, this is the unchecked state, name it for example 'check_in_unchecked'), and one with handle on the right side (so that 'check out' is visible, this is the checked state, name it for example 'check_in_checked'). After that, add a selector as background of your ToggleButton:
android:background="#drawable/selector_check_in"
selector_check_in will look like this:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/check_in_checked" android:state_checked="true"/>
<item android:drawable="#drawable/check_in_unchecked" android:state_checked="false"/>
</selector>

android - listview with custom shape

I want to make a listview that has a custom shape background for every item in it.
This is exactly how I want it to look.
When a list item is selected, the color of it is a little bit darker, and it has an extra corner in the right.
What is the best way to achive something like this?
I've tried to make 2 images, and add both to my selector
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:drawable="#drawable/clicked" />
<item android:state_pressed="true" android:drawable="#drawable/clicked" />
<item android:drawable="#drawable/normal" />
</selector>
And set the listview listselector to it..but is not showing as I expected, and also i'm sure is not the best way to do it...
What do you think is the best way to achive this?

how to change button color when it is clicked in android

By default when button is clicked something like orange color will surround the button for short time, that indicates buttons is clicked. But this feature is not working when button contains background image. This is happening in list view too.why ? Any Ideas? TIA
I used setBackgroundColor(Color.BLUE); But here the color is applied and not gone...
You need to use a selector as your background resource :
<?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_pressed" />
<item android:state_focused="true" android:drawable="#drawable/button_focus" />
<item android:drawable="#drawable/button_normal" />
</selector>
This selector makes use of 3 separate drawables to change the image of the button , you may use the same image for pressed and focuses.
You need to put this XML into your drawables directory and use it as a background for your button.
For another solution refer : Standard Android Button with a different color
i too had the same problem. so instead of setting the background color,i included three images of button in three different colors , so based on state focused,pressed,default the respective image will replace the other. and it looks like change in the color of the button.
**<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/c2"
android:state_pressed="true" />
<item android:drawable="#drawable/c1"
android:state_focused="true" />
<item android:drawable="#drawable/c1" />
</selector>**
above is the content of the xml file,which must be assigned to the background of the respective button
android:background="#drawable/drawable_button
hope this might be helpful for you

Categories

Resources