具有背景图像文字定位的按钮

Question

I would like to position the text in my button like this:

At the moment the text is positioned in the bottom left corner of the button:

I have four rows of this type of buttons and in every row there is two buttons. Here is my code for one row of buttons:

         <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <Button
                android:id="@+id/main_fashion_button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/thumbnail_channel_fashion"
                android:text="Fashion"
                android:textColor="#FFFFFF"
                android:gravity="bottom"
                android:layout_weight="1"/>


            <Button
                android:id="@+id/main_science_button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:background="@drawable/thumbnail_channel_science"
                android:text="Science"
                android:textColor="#FFFFFF"
                android:gravity="bottom"
                android:layout_weight="1"/>


        </LinearLayout>

how can I add some padding to the left and below of the text without moving the background image? Margin seems to add white space around button and padding creates space between background image and button's edges.

Thanks for help!

Answer 1

You can use this

   <TextView
    android:id="@+id/main_fashion_button"
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:background="@mipmap/ic_launcher"
    android:text="Fashion"
    android:textColor="#FFFFFF"
    android:gravity="bottom"
    android:padding="10dp">

Answer 2

Check this out

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <ImageButton
        android:id="@+id/imageButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@null"
        android:src="@drawable/image" />

    <TextView
        android:id="@+id/imageViewText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_vertical|left"
        android:layout_alignBottom="@+id/imageButton"
        android:text="FASHION"
        android:padding="16dp"
        android:textColor="#fff" />

</RelativeLayout>