Click here to Skip to main content
15,881,852 members
Articles / Mobile Apps / Android

Customized Android ListView with Image and Text

Rate me:
Please Sign up or sign in to vote.
4.64/5 (43 votes)
17 Jan 2013CPOL6 min read 398.1K   26K   96  
Creating a customized ListView in Android
<?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:background="@drawable/list_selector"
    android:orientation="horizontal"
    android:padding="5dip" >

    <!-- ListRow Left sied Thumbnail image -->

    <LinearLayout
        android:id="@+id/thumbnail"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_marginRight="5dip"
        android:padding="3dip" >


        <ImageView
            android:id="@+id/list_image"
            android:layout_width="60dip"
            android:layout_height="60dip"
            android:layout_gravity="top"
            android:contentDescription="@string/app_name"
            android:src="@drawable/sunny" />

    </LinearLayout>

    <!-- Rightend Arrow -->
    <ImageView
        android:id="@+id/imageView1"
        android:contentDescription="@string/app_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:src="@drawable/arrow" />

    <!-- City-->
    <TextView
        android:id="@+id/tvCity"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/list_image"
        android:layout_toRightOf="@+id/list_image"
        android:layout_marginLeft="75dip"
        android:layout_centerVertical="true"
        android:paddingBottom ="9dip"
        android:text="@string/strCity"
        android:textColor="#040404"
        android:textSize="25dip"
        android:textStyle="bold"
        android:typeface="sans" />
    
    <!-- Weather Information-->

    <TextView
        android:id="@+id/tvCondition"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/tvCity"
        android:layout_alignLeft="@+id/tvCity"
		android:layout_alignBottom="@+id/list_image"
        android:paddingTop="5dip"
        android:layout_centerHorizontal="true"
        android:text="@string/strWeather"
        android:textColor="#343434"
        android:textSize="15dip" />


    <TextView
        android:id="@+id/tvTemp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
		android:layout_marginRight="20dip"
		android:layout_alignTop="@+id/tvCity"
        android:layout_toLeftOf="@+id/imageView1"
        android:text="@string/strTemp"
        android:textSize="30dip" />

</RelativeLayout>

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer Honeywell International
India India
Software Developer, Cinephile, Dromomaniac, Animal lover, Self proclaimed Photographer not necessarily in the same order.

Comments and Discussions