CODEWITHSUNDEEP
androidandroid-layoutlistitem
Chris
Chris

Reputation: 7855

Vertically center content of ListItem in ListView

I have a layouting problem with my android application:

I have a Listview consiting of items which are using the following layout:

<?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="fill_parent"
android:minHeight="40px"
android:orientation="horizontal">

 <TextView android:layout_gravity="center_vertical"  android:textSize="20px"       android:id="@+id/track_position" android:layout_width="wrap_content"  android:layout_height="wrap_content"></TextView>

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:orientation="vertical"
android:layout_gravity="center_vertical"
>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
 android:id="@+id/track_name"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:textAppearance="?android:attr/textAppearanceLarge"
  android:paddingLeft="8dip"
  android:textSize="14px"
/>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
 android:id="@+id/track_artist"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:textAppearance="?android:attr/textAppearanceLarge"
  android:paddingLeft="8dip"
  android:textSize="8px"

/>

This comes up with the following result: enter image description here

But i would like to have the tracks title and subtitle centered as well. like that: enter image description here

So AFAIK i did everything so that this would be the result.

Upvotes: 2

Views: 6457

Answers (3)

Joakim Berglund
Joakim Berglund

Reputation: 2871

You need

android:gravity="center_vertical"

On the LinearLayout containing the two textViews, like this:

<?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="fill_parent"
android:minHeight="40px"
android:orientation="horizontal">
<TextView
    android:layout_gravity="center_vertical"
    android:textSize="20px"
    android:id="@+id/track_position"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
</TextView>
<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:gravity="center_vertical"
    android:layout_gravity="center_vertical">
    <TextView
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/track_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:paddingLeft="8dip"
        android:textSize="14px" />
    <TextView
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/track_artist"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:paddingLeft="8dip"
        android:textSize="8px" />
</LinearLayout>
</LinearLayout>

Upvotes: 7

Squonk
Squonk

Reputation: 48871

Try using android:layout_centerVertical="true" for the track_position TextView.

EDIT: In light of Maaalte correctly pointing out that the above is for RelativeLayout, I found my layout I was thinking of which achieves what is needed...

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:padding="5dp">
    <TextView
        android:id="@+id/start_time_short"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:padding="10dp"
        android:textSize="16sp" >
    </TextView>
    <TextView 
        android:id="@+id/title"
        android:layout_toRightOf="@+id/start_time_short"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="5dp"
        android:paddingTop="3dp"
        android:textSize="16sp"
        android:ellipsize="end"
        android:singleLine="true" >
    </TextView>
    <TextView 
        android:id="@+id/description"
        android:layout_toRightOf="@+id/start_time_short"
        android:layout_below="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="5dp"
        android:paddingTop="3dp"
        android:textSize="16sp"
        android:ellipsize="end"
        android:singleLine="true" >
    </TextView>
</RelativeLayout>

In my case, this is a TV Guide entry and the lefthand TextView shows time (HH:mm) with the TV show's title and description to the right. Everything centres fine for me.

Upvotes: 5

SchurigH
SchurigH

Reputation: 379

I'm not familiar with this, just web styling. But if there is always 1 line for the track and the band, can't you just set a paddingTop value to the second LinearLayout block?

Upvotes: 0

Related Questions