Android Button: Place Image in center and text at bottom
To align multiple symmetric buttons in Android View, each button having an image in the center and text at bottom, use the following code:
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<TableLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TableRow
android:layout_width="fill_parent"
android:layout_height="0dp"
android:weightSum="1"
android:layout_weight="0.5">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5">
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/button1"
android:background="@drawable/right_buttom_btn_line"
android:text="Botton 1"
android:textSize="18sp"
android:gravity="center|bottom"
android:singleLine="false"
android:paddingBottom="10dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/location"
android:layout_centerInParent="true"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5">
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/button2"
android:background="@drawable/right_buttom_btn_line"
android:text="Botton 2"
android:textSize="18sp"
android:gravity="center|bottom"
android:singleLine="false"
android:paddingBottom="10dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/settings"
android:layout_centerInParent="true"/>
</RelativeLayout>
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="0dp"
android:weightSum="1"
android:layout_weight="0.5">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5">
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/button3"
android:background="@drawable/right_buttom_btn_line"
android:text="Button 3"
android:textSize="18sp"
android:gravity="center|bottom"
android:paddingBottom="10dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/location"
android:layout_centerInParent="true"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5">
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/button4"
android:background="@drawable/right_buttom_btn_line"
android:text="Button 4"
android:textSize="18sp"
android:gravity="center|bottom"
android:paddingBottom="10dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/settings"
android:layout_centerInParent="true"/>
</RelativeLayout>
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="0dp"
android:weightSum="1"
android:layout_weight="0.5">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5">
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/button5"
android:background="@drawable/right_buttom_btn_line"
android:text="Button 5"
android:textSize="18sp"
android:gravity="center|bottom"
android:paddingBottom="10dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/location"
android:layout_centerInParent="true"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5">
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/button6"
android:background="@drawable/right_buttom_btn_line"
android:text="Button 6"
android:textSize="18sp"
android:gravity="center|bottom"
android:paddingBottom="10dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/settings"
android:layout_centerInParent="true"/>
</RelativeLayout>
</TableRow>
</TableLayout>
</LinearLayout>You can find the result in the screenshot below.




