Create a button with custom layout android

Question

Image comments: Icon should go centered in the red bit. The text should go centered in the yellow bit.

I'm trying to create a button in android that looks pretty much like the above. I tried with the imagebutton, the normal button (with drawabletop and drawablebottom), but the text is not proper aligned then.

Do note that I prefer not to use shapes, as the final result will be ninepatch images (that come from photoshop). Although feel free an example there for documentation use.

Also note that it needs to be clickable.

I think i just need to create a custom XML for this below, and then somehow have a button make use of this. I just haven't figured out how/where i need to set the text and so on then.

Any advice on this is appreciated.

Answer 1

You could create the lower part as a separate button, and the above part as an imageview. In your layout file, place the top part above the bottom part. And finally, in your code, create a on clicklistener and assign the same listener to both the button and the image. Of course this would only cause the bottom part to act like a button(looking like it's pressed), but perhaps that's acceptable.

Answer 2

As you want to use Nine patch, create nine patch such a way that the content area is only in the middle of the yellow portion. I'm sure you know how to select content area for nine patch.

Answer 3

hiii....
While using Button... you can align your text as per your expectations using android:gravity="center" android:text="TestHere"`
Try using this... In my case this works f9... It does or doesn't help you plz let me know