Centering a linearlayout present inside a listview

Question

I have a listview which contains a linearlayout. I am trying to get the linearlayout to the center of the screen(horizontally) but it doesn't work.

How it looks -

Portrait -

enter image description here

Landscape -

enter image description here

I want the linearlayout(which has the text "text" and the two images) to come to the center of the screen(horizontally) in both the orientations.

I've tried using layout_gravity on the linearlayout but it doesn't work.

Here's my code -

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#EEEEEE" >

    <ListView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/parentListContainer">
    </ListView>

</LinearLayout>

Each listview item -

<?xml version="1.0" encoding="utf-8"?>
<!-- I want this layout centered. -->

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_centerHorizontal="true"
    android:layout_gravity="center">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:textStyle="bold"
        android:layout_marginStart="20dp"
        android:layout_marginLeft="20dp"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp"
        android:textColor="#000000"
        android:text="text"/>

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

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/ivBottle1"
                android:scaleType="fitXY"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:adjustViewBounds="true"/>

            <TextView
                android:id="@+id/tvBottle1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="top|center"
                android:text="vino"
                android:textSize="22sp" >
            </TextView>
        </LinearLayout>

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/ivBottle2"
                android:scaleType="fitXY"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:adjustViewBounds="true"/>

            <TextView
                android:id="@+id/tvBottle2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="top|center"
                android:text="vino"
                android:textSize="22sp" >
            </TextView>
        </LinearLayout>
    </LinearLayout>

</LinearLayout>

Please help.

EDIT: Neither gravity="center" works on the listview, nor does layout_gravity="center" on the linearlayout.

`android:gravity="center"` centers the contents of the linearlayout. I want the entire linearlayout iteself centered on screen. — aandis, Mar 27 '15 at 11:08
What about using `gravity="center"` on your item `LinearLayout`, together with `android:layout_width="match_parent"`? — joao2fast4u, Mar 27 '15 at 11:26
Ok that moved the two images to the center. But as expected with `gravity="center"`, it moved the "text" to the center of the two images as well. I want the text to stay above the first image. That's why I have been trying with `layout_gravity="center"` — aandis, Mar 27 '15 at 11:48
If you want that layout, you have to use a `RelativeLayout` that wraps your `TextView` and your images `LinearLayout`. Then tell the `TextView` to be above the first image. — joao2fast4u, Mar 27 '15 at 12:01
`layout_gravity="center"` attribute won't work if the parent `View` has a `width="wrap_content"`. It makes sense. If the parent is wrapping the content, the content itself does not have space to position inside the parent `View`. — joao2fast4u, Mar 27 '15 at 12:09
Agreed. But why doesn't `layout_gravity="center"` work on the linearlayout here? — aandis, Mar 27 '15 at 12:11

score 0 · Answer 1 · edited May 23 '17 at 11:52

0

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#EEEEEE" >

    <ListView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:id="@+id/parentListContainer">
    </ListView>

</LinearLayout>

See here for explanation : https://stackoverflow.com/a/3482757/4706693

edited May 23 '17 at 11:52

Community

1
1

answered Mar 27 '15 at 11:11

NSimon

5,212
2
22
36

I've tried this. Doesn't work. It should, but it just doesn't! – aandis Mar 27 '15 at 11:14
Then just try to change also the `layout_width` of your ListView to `wrap_content` – NSimon Mar 27 '15 at 11:17
Since your main linearLayout only has one child (the listView), have you tried to change its orientation to "horizontal"? – NSimon Mar 27 '15 at 11:25

score 0 · Answer 2 · answered Mar 27 '15 at 11:51

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceMedium"
    android:textStyle="bold"
    android:layout_marginTop="10dp"
    android:layout_marginBottom="10dp"
    android:textColor="#000000"
    android:text="text"/>

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

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/ivBottle1"
            android:scaleType="fitXY"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:adjustViewBounds="true"/>

        <TextView
            android:id="@+id/tvBottle1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="top|center"
            android:text="vino"
            android:textSize="22sp" >
        </TextView>
    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/ivBottle2"
            android:scaleType="fitXY"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:adjustViewBounds="true"/>

        <TextView
            android:id="@+id/tvBottle2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="top|center"
            android:text="vino"
            android:textSize="22sp" >
        </TextView>
    </LinearLayout>
</LinearLayout>

Centering a linearlayout present inside a listview

2 Answers2