Button raised effect not working when background image attached - android

I am creating a simple button as follows :
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/edSearch"
android:id="#+id/btnSearch"
android:layout_marginTop="30dp"
android:drawableTop="#drawable/ic_action_search"
android:textSize="16sp"
android:text="Search"
android:background="#color/md_green_500"
android:textColor="#fff"
/>
Now, when i try add any image in background like :android:background="#drawable/img123" then button raise effect does not work. is there any way i can achieve raise effect with background image ?

You can create a selector drawable for this. You need to provide 3 different images for this so that the button can toggle those images as per the state.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="false"
android:state_pressed="false"
android:drawable="#drawable/image_normal" />
<item android:state_focused="false"
android:state_pressed="true"
android:drawable="#drawable/image_pressed" />
<item android:state_focused="true"
android:state_pressed="false"
android:drawable="#drawable/image_focused" />
</selector>
Also inspite of that you can use ImageButton which will keep your image in center of button and the effects will be default as per operating system.

Related

onClick() imageview shows a gray background

I have a simple ImageView with transparent image with onclick function:
<ImageView
android:id="#+id/settings"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#id/btnLL"
android:layout_alignParentEnd="true"
android:layout_marginBottom="12dp"
android:layout_marginEnd="12dp"
android:src="#drawable/options"
android:onClick="ClickSettings"/>
The problem is, when I click (touch) the image, a gray square background appears for a second and then it disappears. Seems like some click effect.
How can I remove this?
I tried to use ImageButton instead, also tried to use background from xml selector in drawable :
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="#android:color/transparent" />
<item android:state_pressed="true" android:drawable="#android:color/transparent" />
<item android:drawable="#android:color/transparent" />
but the gray background is still appearing when I click the image.
You can add another state to your button and remap it with a transparent background :
<item android:state_focused="true" android:drawable="#android:color/transparent" />
You can check all the states here : https://developer.android.com/guide/topics/resources/drawable-resource.html#StateList
Best

Changing Button UI in Android

I am trying to customize a Button UI in Android.
I tried the following things:
btn.setBackgroundColor
btn.setBackgroundResource
btn.setBackgroundColor
But all of these are increasing the size of the Button, and because of that the Buttons near by can not be segregated (??).
Please suggest something.
If you want to apply a Hover effect then you have to do this in your XML where button layout is like
Button
android:id="#+id/xyz"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_marginTop="15dp"
android:background="#drawable/general_btn_hover_effect"
android:onClick="somefunction"
android:text="#string/search_number"
android:textColor="#ffffff"
android:textSize="20sp"
/>
Notice android:background="#drawable/general_btn_hover_effect" there and then in #drawable folder make a general_btn_hover_effect.xml and write this into it
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/blank_normal_bg" android:state_focused="true" android:state_pressed="false"/>
<item android:drawable="#drawable/blank_hover_bg" android:state_focused="true" android:state_pressed="true"/>
<item android:drawable="#drawable/blank_hover_bg" android:state_focused="false" android:state_pressed="true"/>
<item android:drawable="#drawable/blank_normal_bg"/>
</selector>
Changing background color can not change size of button. Maybe you changed size in xml layout. Check again

Cannot change focus/state for button png using selector element

Android Studio 0.3.7
Hello,
I have created 2 buttons png and patched using draw9patch.
The buttons will indicate whether the buttons is pressed or unpressed.
I have the following buttons_colours.xml in my values directory
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="false"
android:state_pressed="true"
android:drawable="#drawable/rd_btn_press"/> <!-- pressed -->
<item android:state_focused="true"
android:state_pressed="false"
android:drawable="#drawable/rd_btn"/> <!-- unpressed -->
<!-- Default -->
<item android:drawable="#drawable/rd_btn"/>
</selector>
In my layout for the button I have this:
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Start"
android:id="#+id/button"
android:layout_gravity="center_horizontal"
android:background="#drawable/rd_btn"/>
Problem 1: I get an element selector must be declared in my buttons_colours.xml
Problem 2: Not sure if this is related to problem 1, but the button never changes to my rd_btn_press state when I press it.
Many thanks for any suggestions,
you have set wrong background for the button. Replace #drawable/rd_btn with `buttons_colours :
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Start"
android:id="#+id/button"
android:layout_gravity="center_horizontal"
android:background="#drawable/buttons_colours"/>
also, I don't know why you have two states in your items in the selector. Here an example of working selector:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/rd_btn_press"
android:state_pressed="true" />
<item android:drawable="#drawable/rd_btn"
android:state_focused="true" />
<item android:drawable="#drawable/rd_btn" />
</selector>

what is the best way to set image to imageview

Hi I have created a relative layout. and align the imageview to the right of relativelayout. I set the background of relativelayout using selector. if i select thye relativelayout its color wil be green otherwise its color will be white. Now I want to set the image depending on the selection of scrollview. If scrollview is selected then i want to show imge1 if not then i want to show image2. How can I achieve this?
main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/selector">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/arrow_right"
android:layout_alignParentRight="true" />
</RelativeLayout>
selector.xml
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_focused="true"
android:state_pressed="false"
android:drawable="#drawable/grbk" />
<item
android:state_focused="true"
android:state_pressed="true"
android:drawable="#drawable/grbk" />
<item
android:state_focused="false"
android:state_pressed="true"
android:drawable="#drawable/grbk" />
<item
android:drawable="#drawable/whbk" />
</selector>
Thanks
Sunil
In the same way as for background. You should add android:duplicateParentState="true"
<ImageView
android:duplicateParentState="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/arrow_selector"
android:layout_alignParentRight="true" />
first set the color to all the list list view item and then put the selector in the list view ..i gess u know how to set the selector in list view
We can create another selector for imageview and pass that selector as background to imageview.
imageselector.xml
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_focused="true"
android:state_pressed="false"
android:drawable="#drawable/arow_selected" />
<item
android:state_focused="true"
android:state_pressed="true"
android:drawable="#drawable/arow_selected" />
<item
android:state_focused="false"
android:state_pressed="true"
android:drawable="#drawable/arow_selected" />
<item
android:drawable="#drawable/arow_unselect" />
</selector>
main.xml
<ImageView
android:id="#+id/arrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/imageselector"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="20dip"/>
</RelativeLayout>
Here is my suggestion..
once i set the background to the imageview, then when i want to change the transparent, i can do nothing...after check some website, i found i need to set the imageview's resourse instead of background...

Android - Skewed button

is it possible to create a skewed shape button?
(i.e like a stripe shape from bottom left of screen to top right of screen instead of the regular square or rectangle shape button)?
Something like this image http://www.codeproject.com/KB/silverlight/SilverLightFAQPart2/9.JPG
And I need to make sure the clickable area is also just the colored one.
Thanks,
Tee
You'd need to write your own class for that. Just subclass View and listen for the onClick events.
Try using a selector as background.
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello"
android:background="#drawable/my_button"
/>
And then make a my_button.xml in your drawable folder.
<?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/focused" />
<item android:state_focused="true" android:state_pressed="true" android:drawable="#drawable/focusedpressed" />
<item android:state_focused="false" android:state_pressed="true" android:drawable="#drawable/pressed" />
<item android:drawable="#drawable/defaultbutton" />
</selector>
Source: http://www.anddev.org/tinytutcustom_button_backgrounds-better_imagebutton-t4298.html

Categories

Resources