I created a button with a 9patch image as a background. In the 9patch image I used the bottom and right lines to specify the content area/padding, to position the text on the button. This works well on a TextView, but on a Button the content lines seem to have no effect on the text position. Setting "paddingTop"/"paddingBottom" also seem to have no effect - only "padding" has any effect.
This is my layout XML:
<Button
android:layout_width="450dp"
android:layout_height="198dp"
android:text="Some text here"
android:gravity="center"
android:background="#drawable/my_button"/>
Is there any way to set the padding? Maybe I could use a different View instead of a Button? For example, I could try to just use a TextView and make it clickable, but I'm not sure what other side-effects this will have.
Explicitly setting android:padding="#null" solved my issue.
The issue seemed to be that a Button (or one of the styles in the theme I'm using) is setting the padding, which overrides all other padding in the button - padding in the background drawable, as well as paddingTop, paddingLeft etc.
My button layout is now defined like this:
<Button
android:layout_width="450dp"
android:layout_height="198dp"
android:text="Some text here"
android:gravity="center"
android:padding="#null"
android:background="#drawable/my_button"/>
My IDE (IntelliJ IDEA 11.1) picked up the #null as an error, even though it compiled. Setting it to -1px also worked.
If you use a 9-patch image as background, both the padding and the stretched areas are defined in the background.
It's quite graphic if you use the draw9patch tool: the padding is defined (indirectly) with the content area (lines on right and bottom):
http://developer.android.com/guide/developing/tools/draw9patch.html
Related
I create android button programmatically, and I put this butons in a TableRow, every thing work fine, but when I change the backgroudColor the colored button not respect the size as it do without the color:
My code is:
val btn = Button(this)
btn.isEnabled = false
btn.setBackgroundColor(Color.RED)
btn.layoutParams = TableRow.LayoutParams(150, 150)
When I don't use the setBackgroundColor the size is correct.
I don't understand why the size is changes, is there any way to change only the default gray color of the button, without the size is changes.
The default background for a button is not a solid color, but is rather a graphic (e.g. a nine-patch bitmap) that has paddings and margins built into it. Thus, when you replace that background image with a color, all of the built-in paddings and margins are thrown away.
Instead of setting a background color with setBackgroundColor() you could try using setBackgroundTintList() which should tint the existing background image with your chosen color(s).
Alternatively, you would need to manually set the margins and paddings after changing the background to the solid red color, something that is much more painful to do via code than it is in a layout XML file.
Example layout file:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Red Button"
android:backgroundTint="#a00"
android:textColor="#fff" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Default Button" />
</LinearLayout>
Which yields this rendering:
if your app theme is material-theme then there is a default paddings applied to the button. that's why the color fills the whole canvas of the button after you apply it. try to restore the padding (I believe it's 8dp for all edges).
I need to create a button with the background and place it on the picture. I tried to create LinearLayout Horizontal bet on it, and put the background image and button. but it looks not nice. Tell me how to do this?
No layout is needed here, any TextViews can have drawableLeft attribute. Use appropriate XML attributes to set picture, padding, gravity of the text, etc.
Use button's xml attributes to set a drawable according to your need, and in your case it is drawableLeft. See the example below to make a think like your purpose :
<Button
android:id="#+id/backButton"
android:drawableLeft="#drawable/back_btn"
android:background="#android:color/transparent"
android:text="#string/home_screen_sell_new_card_back_button_text"
android:textColor="#026281"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
And for the little enhancements, put paddings and other stuff.
Please refer to this image:
The Top image is a TextView with no compound drawable and the padding all around seems perfect.
The second image has a compound image using android:drawableRight="#drawable/ic_action_expand" and the image messes up all the padding.
How to get rid of this unwanted padding in the second image ?
Here's the XML
<TextView
android:id="#+id/moreinfo"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#color/translucent_black"
android:drawableRight="#drawable/ic_action_expand"
android:drawablePadding="#dimen/content_heading_padding"
android:singleLine="true"
android:padding="#dimen/content_heading_padding"
android:textSize="#dimen/content_size"
android:text="#string/more_info" />
As you can see in the XML i have used android:drawablePadding
Including or removing that line does changes the padding for the drawable but the mess that has happened for the textview still remains.
I have tried negative padding values for android:drawablePadding but it does not correct the issue.
One of the reasons could be that it must be set autoresizable(true) in your android manifest file set to autoresizable(true). Check your manifest.
Im trying to place an icon thats 16x16 pix within a normal button that I have in a layout. This button also uses another png for its background. The problem I have is not placing it within the button but placing it where I want. When I add it using the following code it places the drawable at the bottom but exactly on the edge of the image which looks terrible.
<Button
android:id="#+id/clearform"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/helpText"
android:layout_alignParentBottom="true"
android:layout_marginBottom="19dp"
android:typeface="monospace"
android:textColor="#FFFF00"
android:drawableBottom="#drawable/cross"
What I would like is to create a button in my layout that possibly has some padding from the bottom but there is no such method or xml attribute that does such a thing the way I would like. Its only left right top or bottom and when I added padding it only placed padding between the bottom of the text in the button and the top of the drawable.
So how can I accurately place an image within the button itself.
I think you can use android:padding for aligning to a greater extent & use android:paddingTop/Right/Left/Bottom to get the exact postion.It would be much easier.
Pretty much what the title says. I'm wanting the user to have the choice to customize the boarder of a 9 drawable I have. Is something like that possible or do I need to use a different method? Right now, I think it won't work and it will mess up the 9 patch.
Can you post a picture of your 9-patch? It might be possible to extract parts of it to another type of drawable, then layer the customizable part (drawn with user defined color) under the fixed portions using a layer-list.
[Update] Based on the pic you posted, I'd trash the layer list idea, but we can still work something out. The idea would be to remove the colored border and internal dark background from the 9-patch entirely (fill that area in with the shadow color and opacity). Then nest 3 layouts in each other. The first would use the 9-patch as a background. The second would use the user-defined color as a background. The third would use your panel color as a background. The 9-patch would provide the proper margins to position the second (user-color) layout, and then you'd just add a layout_margin attribute to the second panel to position the inner most layout a few dps in.
<LinearLayout
android:id="#+id/PanelOuter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/shadow_nine_patch">
<LinearLayout
android:id="#+id/PanelUserBorder"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/custom_border_width"
android:background="#color/dialog_border_color_default">
<LinearLayout
android:id="#+id/PanelContent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/custom_dialog_content_margin"
android:background="#color/dialog_inner_color">
</LinearLayout>
</LinearLayout>
</LinearLayout>
Of course, you'd be responsible for finding the PanelUserBorder view in code and calling setBackgroundColor() with the proper user-defined color.
maybe you could tint it by putting a 50% transparent view overtop the button.
after thinking about it i thought maybe you could transform the color by bitmap:
How to change Bitmap image color in android?