As the title, in a button I set a resource in the background (a square image).
The problem is that the button is now much higher than the classical buttons, how do I make it as high as the others?
I tried with 9.patch but have the same result...
This is the 9patch file (only the angle is important)
Code of the button :
<Button
android:id="#+id/buttonLogIn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:background="#drawable/button"
android:text="Log In"
android:textColor="#FFFFFF" />
Code of the 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/bottonep" /> <!-- pressed -->
<item android:drawable="#drawable/bottone" /> <!-- default -->
</selector>
i've solved with this
the ninepath must be smallest
<?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/btn_default_pressed_holo_dark" /> <!-- pressed -->
<item android:drawable="#drawable/btn_default_normal_holo_dark" /> <!-- default -->
</selector>
Related
I would like to adding some effects like color change to my android button when user focus/click the button
My android button layout is here :
<Button
android:id="#+id/btnUpload"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#color/btn_bg"
android:text="தகவல் அனுப்புக"
android:textColor="#color/white"
android:padding="20dp"
android:margin="20dp"
android:layout_alignParentBottom="true" />
You should check out the documentation regarding color state lists.
Create an XML file in your drawable folder with the name of btn_background and place the following code in the file:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:color="#ffff0000"/> <!-- pressed -->
<item android:state_focused="true"
android:color="#ff0000ff"/> <!-- focused -->
<item android:color="#ff000000"/> <!-- default -->
</selector>
After you have created this file, change the background attribute of your Button to point to the new background:
android:background="#color/btn_background"
Good luck and happy coding!
Hi I am using custom rating bar with custom images. I need to provide space between stars. When I increase minimum height and maximum height, star image remains same.
<RelativeLayout
android:id="#+id/RelativeLayout01"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:padding="5dp">
<TextView
android:id="#+id/allreviews"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:text="Rating"
android:layout_marginLeft="8dp"
android:textSize="14sp" />
<RatingBar
android:id="#+id/reviewallrating"
style="#style/customRatingBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="3dp"
android:layout_toRightOf="#+id/allreviews"
android:isIndicator="false"
android:numStars="5"
android:stepSize="0.1" />
</RelativeLayout>
styles:
#drawable/star_rating_bar_full
12dip
12dip
star_rating_bar_full.xml:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#+android:id/background"
android:drawable="#drawable/star_ratingbar_full_empty" />
<!-- <item android:id="#+android:id/secondaryProgress"
android:drawable="#drawable/star_ratingbar_full_empty" /> -->
<item android:id="#+android:id/progress"
android:drawable="#drawable/star_ratingbar_full_filled" />
</layer-list>
star_ratingbar_full_empty:
<?xml version="1.0" encoding="utf-8"?>
<!-- This is the rating bar drawable that is used to
show a filled cookie. -->
<selector
xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:state_window_focused="true"
android:drawable="#drawable/star_gray" />
<item android:state_focused="true"
android:state_window_focused="true"
android:drawable="#drawable/star_gray" />
<item android:state_selected="true"
android:state_window_focused="true"
android:drawable="#drawable/star_gray"/>
<item android:drawable="#drawable/star_gray" />
</selector>
star_ratingbar_fullfilled.xml:
<item android:state_pressed="true"
android:state_window_focused="true"
android:drawable="#drawable/yellow_star" />
<item android:state_focused="true"
android:state_window_focused="true"
android:drawable="#drawable/yellow_star" />
<item android:state_selected="true"
android:state_window_focused="true"
android:drawable="#drawable/yellow_star" />
<item android:drawable="#drawable/yellow_star" />
I used style="?android:attr/ratingBarStyle" in styles but still output remains same.
You could simply add some empty space to the left and right sides of your PNGs.
That is, increase the width of the grey and yellow PNGs in GIMP (or whatever graphic editor program you use).
Just the canvas, without stretching the star icon.
If you are using Drawable for the stars. Make sure your drawable have some left padding according to your requirement in the png image.
Otherwise through code its not working. Some days back I stuck with the same problem. I gone through by using the left padded image. Hope it will work.
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>
I am trying to create a button that has a default image, but when it is pressed it switches to a new image. I have used this tutorial along with this question but it will not work.
This is my info_button_selector.xml:
<?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/ic_menu_info_details2" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/ic_menu_info_details2" /> <!-- focused -->
<item android:drawable="#drawable/ic_menu_info_details" /> <!-- default -->
</selector>
This is the code with my ImageButton:
<ImageButton
android:id="#+id/apModeInfoButton"
android:layout_width="0dip"
android:background="#null"
android:layout_height="match_parent"
android:layout_weight="1.15"
android:clickable="true"
android:src="#drawable/info_button_selector" />
The button stays at the initial state looking like ic_menu_info_details the entire time.
I changed my info_button_selector.xml file to this:
<?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/ic_menu_info_details2" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/ic_menu_info_details2" /> <!-- focused -->
<item android:drawable="#drawable/ic_menu_info_details2" /> <!-- default -->
</selector>
The ic_menu_info_details2 image was the displayed the entire time, which is expected. This shows that the button IS using the XML file as its drawable resource, but why is it that the button does not change its image when pressed?
EDIT
Using Joss's answer below, the image still does not change, and is now stretched in a strange way. Note: Both images are exactly the same except the second image is scaled to be 60% the size. This might mean that it is working but I cannot tell as the view is stretched.
<ImageButton
android:id="#+id/apModeInfoButton"
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1.15"
android:clickable="true"
android:background="#drawable/info_button_selector" />
I used both of these versions of the XML file as well as different combinations of the images, all of the combinations resulted in the same sized image never changing.
<?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/ic_menu_info_details" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/ic_menu_info_details" /> <!-- focused -->
<item android:drawable="#drawable/ic_menu_info_details" /> <!-- default -->
</selector>
<?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/ic_menu_info_details2" /> <!-- pressed -->
<item android:state_focused="true"
android:drawable="#drawable/ic_menu_info_details2" /> <!-- focused -->
<item android:drawable="#drawable/ic_menu_info_details2" /> <!-- default -->
</selector>
Set that drawable to the ImageButton background rather than the src.
<ImageButton
android:id="#+id/apModeInfoButton"
android:layout_width="0dip"
android:background="#drawable/info_button_selector"
android:layout_height="match_parent"
android:layout_weight="1.15"
android:clickable="true" />
Edit to follow up the distortion problem:
Well what you can do is to have the layers separate.
Because the background is stretchable, set this to the BACKGROUND and separate the image which shouldn't stretch and set this to the SRC.
<ImageButton
android:id="#+id/apModeInfoButton"
android:layout_width="0dip"
android:src="#drawable/non_scaleable_image"
android:background="#drawable/gradient_bg"
android:layout_height="match_parent"
android:layout_weight="1.15"
android:clickable="true" />
This way, you could have a background as a gradient and have it stretch without loosing quality, and the SRC image would not resize and distort.
That is really what an ImageButton should be used for.
Alternatively, do what I suggested in the first answer, but use a Button instead. Let me know if this helps.
You should try using a completed different image for details2 and see if the image is in fact changing, but not being re-sized. I wouldn't expect a stateful button to re-size, maybe use two different images and set visibility.
I create button with background color but when i click on it, it's not show anything.
I need to show different color on button after click because user need to know button is
Click.
I don't understand how to do this?
Give me suggestion.
here is my button code.
<Button android:textSize="15px"
android:id="#+id/button9"
android:gravity="center|bottom"
android:textColor="#color/myWhiteColor"
android:drawableTop="#drawable/math"
android:text="#string/HomePage_Math"
android:background="#color/myMaroonColor"
android:layout_width="54dp"
android:layout_height="wrap_content" ></Button>
//XML file saved at res/drawable/button_bg.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:color="#ffff0000"/> <!-- pressed -->
<item android:state_focused="true"
android:color="#ff0000ff"/> <!-- focused -->
<item android:color="#ff000000"/> <!-- default -->
</selector>
//This layout XML will apply the color list to a View:
<Button android:textSize="15px"
android:id="#+id/button9"
android:gravity="center|bottom"
android:textColor="#color/myWhiteColor"
android:drawableTop="#drawable/math"
android:text="#string/HomePage_Math"
android:background="#drawable/button_bg"
android:layout_width="54dp"
android:layout_height="wrap_content" ></Button>
<?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/colorPrimaryDark" />
<item android:state_focused="true" android:drawable="#android:color/holo_green_dark" />
<item android:drawable="#color/colorCartButton" />
</selector>
This will work