Android relative layout placement problems

Question

I have been having problems creating a relative layout in XML for a list item to be used for a series of items in a ListView. I have tried for hours and am tearing my hair out trying to get it to look how I want but cannot get everything to appear in the correct spot and not overlap or mis-align. I can get the first image and next two textviews in place but cannot get the last textview and imageview.

I have attached a wireframe style image of how I am trying for it to look and was wondering if someone could help me out?

• The ImageView on the right is a set icon of the full height of the row with padding around it?
• The two TextViews take up the majority of the width. The Address textview has the possibility of the text being long so it may need to get truncated if it runs out of space, or ideally have the font size shrink?
• The next TextView will just hold a small string of max 5 characters.
• The last ImageView is a small arrow to imply that this list item is clickable for more infomation. It needs to be centred like shown.
• I would like if the icon, last textview, and last image always be in the same place/alignment down the list.

If someone could offer some assistance on this I would be so grateful.

Cheers guys

Answer 1

I've done something similar (except the image on left)

It might help you:

<?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:gravity="center_vertical"
    android:minHeight="?android:attr/listPreferredItemHeight"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/TextView01"
        android:id="@+id/LinearLayout01"
        android:gravity="center_vertical"
        android:orientation="horizontal">
        <LinearLayout
            android:layout_width="0dip"
            android:layout_weight="1"
            android:paddingRight="8dip"
            android:layout_height="wrap_content"
            android:id="@+id/LinearLayout01"
            android:orientation="vertical">
            <TextView
                android:text="@string/Birthday"
                android:id="@+id/txtTitlevalue"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:singleLine="true"
                android:ellipsize="end"
                android:layout_weight="1"
                android:textAppearance="?android:attr/textAppearanceLarge"></TextView>
            <TextView
                android:text="1960-01-01"
                android:id="@+id/txtSubvalue"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="-4dip"
                android:singleLine="true"
                android:ellipsize="end"
                android:layout_weight="10"
                android:textAppearance="?android:attr/textAppearanceSmall"></TextView>
        </LinearLayout>
        <TextView
            android:text="2"
            android:id="@+id/txtNumber"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:textStyle="bold"
            android:layout_marginRight="10dip"
            android:layout_gravity="center_vertical|right"></TextView>
        <TextView
            android:text="weeks"
            android:id="@+id/txtUnit"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="10dip"
            android:layout_gravity="center_vertical|right"></TextView>
    </LinearLayout>
    <!-- <View
        android:background="@drawable/black_white_gradient"
        android:layout_width="fill_parent"
        android:layout_height="1dp"
        android:layout_marginTop="2dip"
        android:layout_marginBottom="2dip"
        android:clickable="true"
        android:focusable="true"
        android:layout_below="@+id/LinearLayout01" /> -->
</LinearLayout>

Answer 2

For anyone interested I managed to get this working. I know how much of a pain it is to go searching for an answer to a problem and it was never completely resolved.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/RelativeLayout"
android:layout_width="fill_parent"
android:layout_height="?android:attr/listPreferredItemHeight"
android:padding="6dip">
<ImageView
    android:id="@+id/Icon"
    android:layout_margin="5dip"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true" />
<TextView
    android:id="@+id/topLine"
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
    android:lines="1"
    android:layout_toRightOf="@+id/Icon"
    android:layout_toLeftOf="@+id/distance"
    android:textColor="@color/blacktext"
    android:textSize="20dip"
    android:text="Name" />
<TextView
    android:id="@+id/bottomLine"
    android:layout_height="wrap_content"
    android:layout_width="fill_parent"
    android:lines="1"
    android:layout_toRightOf="@+id/Icon"
    android:layout_below="@+id/topLine"
    android:layout_toLeftOf="@+id/distance"
    android:textColor="@color/blacktext"
    android:textSize="15dip"
    android:text="Address" />
<TextView 
    android:id="@+id/distance"
    android:layout_height="wrap_content"
    android:layout_toLeftOf="@+id/arrow"
    android:layout_centerVertical="true"
    android:layout_width="wrap_content"
    android:lines="1"
    android:textColor="@color/blacktext"
    android:textSize="12dip"
    android:text="100m" />
<ImageView 
    android:id="@+id/arrow"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:layout_margin="5dip"
    android:layout_alignParentRight="true"
    android:layout_centerVertical="true" 
    android:src="@drawable/redarrow"/>
</RelativeLayout>