Beppe
Beppe

Reputation: 201

Set an image to whole of custom ListView

I'm making a messaging app. It works fine. In the conversation activity, I have a custom List View that inflates an xml layout as shown below:

but I want to put an image instead of green background like this:

this is my current xml:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#79ff93">

<ListView
    android:id="@+id/listMessages"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_above="@+id/divider"
    android:divider="@null"
    android:dividerHeight="0dp"
    android:padding="0dip"
    android:stackFromBottom="true"
    android:transcriptMode="alwaysScroll"
    tools:listitem="@layout/message_left" />

<RelativeLayout
    android:id="@+id/divider"
    android:layout_width="fill_parent"
    android:layout_height="1dip"
    android:layout_above="@+id/relSendMessage"
    android:background="@color/off_white" />

<RelativeLayout
    android:id="@+id/relSendMessage"
    android:layout_width="wrap_content"
    android:layout_height="48dp"
    android:layout_alignParentBottom="true"
    android:background="@android:color/white"
    android:paddingLeft="10dp">


    <EditText
        android:id="@+id/messageBodyField"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignBottom="@+id/sendButton"
        android:layout_alignTop="@+id/sendButton"
        android:layout_marginBottom="-4dp"
        android:layout_marginRight="10dp"
        android:layout_toLeftOf="@+id/sendButton"
        android:background="@android:color/white"
        android:hint="@string/message_hint"
        android:textColor="@android:color/black"
        android:textSize="14sp" />

    <Button
        android:id="@+id/sendButton"
        android:layout_width="72dp"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"
        android:layout_margin="4dp"
        android:background="@drawable/button_send" />
</RelativeLayout>

Thank you guys.

Upvotes: 0

Views: 91

Answers (4)

Pankaj Nimgade
Pankaj Nimgade

Reputation: 4549

in the layout change the attribute for the background which is ListView in this case

to this

android:background="@drawable/index_one"

you should see things something like this

enter image description here

Upvotes: 1

dgngulcan
dgngulcan

Reputation: 3149

Placing an ImageView above your ListView in your XML would do the trick.

Upvotes: 0

Doron Yakovlev Golani
Doron Yakovlev Golani

Reputation: 5480

You can use a drawable as your background. Any view can get a drawable background. For your case, perhaps it would be better to put it on the ListView and remove the android:background tag from the base view.

    <ListView 
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/chat_bg">

chat_bg can be either a png or an xml in your drawable folder. You need to consider different aspect ratios and screen sizes if you choose to use an image.

Upvotes: 2

Vitaliy A
Vitaliy A

Reputation: 3838

Just put your ListView inside RelativeLayout with height match parrent, and set background for this layout desierd image.

....
<RelativeLayout
    android:id="@+id/container"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_above="@+id/divider"
    android:background="@drawable/your_image" >

    <ListView
        android:id="@+id/listMessages"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:divider="@null"
        android:dividerHeight="0dp"
        android:padding="0dip"
        android:stackFromBottom="true"
        android:transcriptMode="alwaysScroll"
        tools:listitem="@layout/message_left" />

</RelativeLayout>
....

Upvotes: 0

Related Questions