Android: Layout problem for a listview

Question

I'm trying to add a title to my the elements of my listview. Right now all the information is populated from a static array which consists of several elements but basically now is an Image followed by several different textviews. I would like to have a title bar above the image and textviews but still contained with in the scrollview element (Does this make sense? I'm still trying to get programming jargon down, haha.) I've tried adding a relative layout/textview/tablerow above the imageview to no avail.

Here is the LayoutCode

<?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="?android:attr/listPreferredItemHeight"
    android:padding="6dip" >
    <ImageView
        android:id="@+id/icon"
        android:layout_width="100sp"
        android:layout_height="100sp"
        android:layout_marginRight="6dip"
        android:src="@drawable/car1" />
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="0dip"
        android:layout_weight="1"
        android:layout_height="fill_parent"
        >
        <TextView
            android:id="@+id/make"
            android:layout_width="fill_parent"
            android:layout_height="0dip"
            android:layout_weight="1"
            android:gravity="center_vertical"
            android:textColor="#000"
        />

    </LinearLayout>
</LinearLayout>

This is all contained in this:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <RelativeLayout android:orientation="vertical" android:background="@drawable/banner"
        android:layout_width="fill_parent" android:layout_height="50sp" android:gravity="center" >

    </RelativeLayout>
    <RelativeLayout android:orientation="vertical"
        android:background="#FFFFF0" android:layout_width="fill_parent"
        android:layout_height="wrap_content" android:gravity="fill_vertical">
        <Button android:text="Change Location" android:id="@+id/ListingsLocationbtn"
            android:layout_height="wrap_content" android:gravity="center"
            android:layout_width="100sp" android:layout_margin="3sp"></Button>
        <Button android:id="@+id/ListingsDetailsbtn" android:text="Details"
            android:layout_toRightOf="@+id/ListingsLocationbtn"
            android:layout_alignTop="@+id/ListingsLocationbtn"
            android:layout_alignBottom="@+id/ListingsLocationbtn"
            android:layout_height="match_parent" android:gravity="center|center_vertical"
            android:layout_width="100sp" android:layout_margin="3sp"></Button>
        <Button android:layout_height="wrap_content" android:id="@+id/ListingsFilterbtn"
            android:text="Filter Results" android:layout_alignParentRight="true"
            android:layout_width="100sp" android:gravity="center"
            android:layout_margin="3sp"></Button>
    </RelativeLayout>

    <RelativeLayout android:orientation="vertical"
        android:background="#FFFFF0" android:layout_width="fill_parent"
        android:layout_height="wrap_content" android:gravity="fill_vertical">
        <TextView android:id="@+id/zipcodeTV" android:paddingTop="2sp"
            android:layout_width="fill_parent" android:layout_height="wrap_content"
            android:textColor="#000"  android:textStyle="bold"/>
    </RelativeLayout>

    <ListView android:id="@+id/android:list" android:layout_width="fill_parent"
        android:layout_height="fill_parent" android:background="#FFFFF0" />
    <TextView android:id="@+id/android:empty"
        android:layout_width="fill_parent" android:layout_height="fill_parent"
        android:text="@string/main_no_items" android:textColor="#000" />

</LinearLayout>

*I deleted some of the textviews as my code didn't take over the entire page

enter image description here

Thanks in advance for the help :)!

What exactly is the problem? Error? Not using your list xml? — Spidy
– Spidy, Commented Jun 9, 2011 at 14:55
No error, I just can't get a title bar contained in the listview and above the image and textviews. The things I tried either cause it to be blank or error. Because in a perfect world I would populate that from an array too with the other information. — Nick
– Nick, Commented Jun 9, 2011 at 14:58
No, I use that as the header for the app. I probably did it wrong but I just wanted it to stay static at the top. — Nick
– Nick, Commented Jun 9, 2011 at 15:32
Can you post your code for the listview? I believe thats where the problem lies — Shaun
– Shaun, Commented Jun 9, 2011 at 15:55

wnafee · Accepted Answer · 2011-06-09 15:53:37Z

4

Try something 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="wrap_content"
        android:orientation = "vertical"
        android:padding="6dip" >
        <TextView
            android:id = "@+id/myTextBar"
            android:layout_width = "fill_parent"
            android:layout_height = "wrap_content"`
            android:text = "This is my text bar over my image and other info"/>
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation = "horizontal"
            android:padding="6dip" >
            <ImageView
                android:id="@+id/icon"
                android:layout_width="100sp"
                android:layout_height="100sp"
                android:layout_marginRight="6dip"
                android:src="@drawable/car1" />
            <LinearLayout
                android:orientation="vertical"
                android:layout_width="0dip"
                android:layout_weight="1"
                android:layout_height="fill_parent">
                <TextView
                    android:id="@+id/make"
                    android:layout_width="fill_parent"
                    android:layout_height="0dip"
                    android:layout_weight="1"
                    android:gravity="center_vertical"
                    android:textColor="#000"/>

            </LinearLayout>
        </LinearLayout>
    </LinearLayout>

enter image description here

If you want to do it with relative layout, this is how it would look like:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent" 
    android:layout_height = "wrap_content"
    android:padding="6dip">
    <TextView
        android:id = "@+id/title_bar_text"
        android:layout_width = "fill_parent"
        android:layout_height = "wrap_content"
        android:layout_alignParentTop = "true"
        android:text = "This is the title bar"
        android:gravity = "center_horizontal"/>
    <ImageView
        android:id="@+id/icon"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical = "true"
        android:layout_alignParentLeft="true"
        android:layout_below = "@id/title_bar_text"
        android:layout_marginRight="6dip"
        android:src="@drawable/icon" />

    <TextView
        android:id="@+id/make"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/icon"
        android:layout_below = "@id/title_bar_text"
        android:layout_alignParentRight="true"
        android:layout_alignBottom = "@id/icon"
        android:gravity="center_vertical"
        android:singleLine="true"
        android:ellipsize="marquee"
        android:textColor="#FFFFFFFF"
        android:textStyle="bold"
        android:layout_alignWithParentIfMissing="true"
        android:text = "This is the text beside the image"/>
 </RelativeLayout>

It looks like this:

enter image description here

edited Jun 9, 2011 at 15:53

answered Jun 9, 2011 at 15:10

wnafee

2,14616 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

wnafee Over a year ago

I would like to add that this is a quick and dirty thing, but ideally your whole code for this could be easily done with relative layouts and you would save yourself at 3 layout levels

Nick Over a year ago

Thanks for the response! I did the changes but now only the title bar appears and the other data is gone .

wnafee Over a year ago

try replacing the line: android:layout_height="?android:attr/listPreferredItemHeight" with this android:layout_height = "wrap_content". Does this fix it for you?

Nick Over a year ago

I didn't work, although it did make the different views larger it still only displays the title bar.

Nick Over a year ago

How would you do it with relative layout? Or would that be a pain to rework the entire thing

|

Collectives™ on Stack Overflow

Android: Layout problem for a listview

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related