在线性布局的ImageView下方将TextView居中

Question

I am trying to align text directly below each icon despite the text length being of different sizes. I'd prefer for everything to be centered on this line in this screenshot:

I have tried using both Linear and Relative layouts to get what I want with no success. This code is what I have now and is the closest to what I want:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android=
"http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="5dp" >

    <ImageView
        android:id="@+id/grid_item_image"
        android:layout_width="50dp" 
        android:layout_height="50dp"
        android:layout_marginRight="10dp"
        android:src="@drawable/football_logo" >
    </ImageView>

    <TextView 
        android:id="@+id/grid_item_label"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@+id/label"
        android:layout_weight="1"
        android:layout_marginTop="5dp"
        android:gravity="center"
        android:textSize="15sp">
    </TextView>
</LinearLayout>

Surely there is a better way to do this (Maybe a RelativeLayout with a LinearLayout around the Textview?). Any help would be appreciated... I'm fairly new to this.

Answer 1

If your icons are sized correctly (eg ~48 pixels in the drawable-mdpi folder) then you can dispense with the ImageView altogether and use android:drawableTop="@drawable/football_logo" in the TextView .

If you want to stick with your nested layouts approach, then use android:layout_gravity="center_horizontal" in the ImageView to center the ImageView horizontally.