Add text inside Button drawable in Android

Question

I've got Android project in Xamarin. What I need to do is to add text inside image (green dot) placed in Button.

As you see I am adding green dot as drawable. So maybe I should make custom drawable which will be combined TextView and Image?

This is how it looks now / what I am trying to achieve:

Button XML

<RelativeLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <Button
        android:id="@+id/button_synchronize"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/button_action"
        android:minHeight="60dp"
        android:maxHeight="60dp"
        android:layout_marginTop="15dp"
        android:layout_marginBottom="15dp"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        android:paddingLeft="20dp"
        android:paddingRight="60dp"
        android:layout_alignParentBottom="true"
        android:text="Synkronisering"
        android:drawableRight="@drawable/ic_green_dot"
        android:drawablePadding="3dp"
        android:gravity="center" />
</RelativeLayout>

Selector XML

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<layer-list>
<item>
<shape>
<solid android:color="@color/main_orange_color" />
<stroke android:width="1dp" android:color="@color/main_grey_color" />
<corners android:radius="4dp" />
<padding android:left="3dp" android:top="3dp" android:right="3dp" android:bottom="3dp" />
</shape>
</item>
</layer-list>
</item>
</selector>

Answer 1

You can start with a FrameLayout with width and height both set to wrap_content . Then, add the Button as the view in the bottom. Add the TextView with appropriate styles applied. Change its layout_gravity appropriately.

For more, please have a look at: http://blog.neteril.org/blog/2013/10/10/framelayout-your-best-ui-friend/

The secret of FrameLayout is how it layouts its children. Although normally designed to contain one item, it will happily stack up other element on top of each other. Thus FrameLayout is essentially a way to manipulate the Z-order of views on the screen.

Answer 2

You don't have to use Button . You can use any of RelativeLayout , LinearLayout , FrameLayout etc. and their combinations. When you assign an OnClickListener to them, they will act as a button already. So, let you Button be a Layout .