开发者

Android Custom ListViewItem Layout

I dont quite get the layout of my List View Item doesnt show like I want it to. I hope somone would give me some hints since i cannot make it work for quite some time now. What i want is as follows:

Android Custom ListViewItem Layout

Here is my approach:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android开发者_JAVA百科="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="20dip"
android:padding="6dip">
<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="3dip">
        <TextView
            android:id="@+id/nametext"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
        />
</LinearLayout>
<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="7dip">
        <ImageView
            android:id="@+id/photo"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_marginRight="6dip"
            android:src="@drawable/icon" />
        <LinearLayout
            android:orientation="vertical"
            android:layout_width="0dip"
            android:layout_weight="1"
            android:layout_height="fill_parent">
            <TextView
                android:id="@+id/toptext"
                android:layout_width="fill_parent"
                android:layout_height="0dip"
                android:layout_weight="1"
                android:gravity="center_vertical"
            />
            <TextView
                android:layout_width="fill_parent"
                android:layout_height="0dip"
                android:layout_weight="1"
                android:id="@+id/middletext"
                android:singleLine="true"
                android:ellipsize="marquee"
            />
            <TextView
                android:layout_width="fill_parent"
                android:layout_height="0dip"
                android:layout_weight="1"
                android:id="@+id/bottomtext"
                android:singleLine="true"
                android:ellipsize="marquee"
            />
        </LinearLayout>
        <ImageView
            android:id="@+id/stars"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_marginLeft="6dip"
            android:src="@drawable/icon" />
</LinearLayout>

Any help would be appreciated. I already tried different sizes and a RelativeLayout. No change. It doesnt look anythik like i thought it should.

edit three blanks missing

edit2 added pic


You could do this with LinearLayouts, but you'll need three nested layouts:

  1. A vertical LinearLayout containing everything.
  2. A horizontal LinearLayout containing everything aside from the heading.
  3. A vertical LinearLayout containing the non-heading TextViews.

The inner vertical LinearLayout will probably need android:layout_weight="1" so it stretches to fill the available space but doesn't squeeze out the right-hand ImageView.

That's all very expensive, particularly when multiplied by the numerous views in a ListView. A RelativeLayout can get this done with only one layout.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"
    android:padding="6dip" >
    <TextView 
        android:id="@+id/textView1" 
        android:layout_alignParentTop="true" 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:gravity="center_vertical|center_horizontal" 
        android:textSize="40sp">
    </TextView>
    <ImageView 
        android:id="@+id/imageView1" 
        android:layout_below="@+id/textView1" 
        android:layout_alignParentBottom="true" 
        android:layout_alignParentLeft="true"
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:src="@drawable/icon" >
    </ImageView>
    <ImageView 
        android:id="@+id/imageView2" 
        android:layout_below="@+id/textView1"
        android:layout_alignParentBottom="true" 
        android:layout_alignParentRight="true" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content" 
        android:src="@drawable/icon" >
    </ImageView>
    <TextView 
        android:id="@+id/textView2" 
        android:layout_below="@+id/textView1"
        android:layout_toRightOf="@+id/imageView1" 
        android:layout_toLeftOf="@+id/imageView2" 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:gravity="center_horizontal" 
        android:text="TextView" >
    </TextView>
    <TextView 
        android:id="@+id/textView3" 
        android:layout_below="@+id/textView2"
        android:layout_toRightOf="@+id/imageView1" 
        android:layout_toLeftOf="@+id/imageView2" 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:gravity="center_horizontal" 
        android:text="TextView" >
    </TextView>
    <TextView 
        android:id="@+id/textView4" 
        android:layout_below="@+id/textView3"
        android:layout_toRightOf="@+id/imageView1" 
        android:layout_toLeftOf="@+id/imageView2" 
        android:layout_width="fill_parent" 
        android:layout_height="wrap_content" 
        android:gravity="center_horizontal" 
        android:text="TextView" >
    </TextView>
</RelativeLayout>

Edited for formatting and to add:

This is the result. Of course, text and image sizes need adjusted, but the basic result is what you've described.

Android Custom ListViewItem Layout


Im not sure if you really want to have a 3dip headline and 7dip content... if you want the stuff inside the outer linearlayout vertical arranged, use

android:orientation="vertical"

in the parent LinearLayout. to arrange the three items in the content part of your layout, you might use android:weight or android:alignParentLeft / Right.

I fear im not sure waht you want to do, so i can not edit your layout :(

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜