Home » Android » How to preview Android ListView with custom row and header layout

How to preview Android ListView with custom row and header layout

Posted by: admin April 23, 2020 Leave a comment

Questions:

I have created a list view with a custom layout for the header and rows items many times but what always annoys me is the UI preview in Android Studio does not show a preview. Obviously because the custom layouts are loaded programmatically by the ListView or CursorAdapter but what if I wanted to some how specify a header and footer layout in xml so that I could see a preview. Any one know how to do that?

How to&Answers:

You can use tools:listitem. Just add the tools namespace in the root of the layout

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    (...)

and then in your ListView set your list item layout

 <ListView
    android:id="@+id/mylistView"
    tools:listitem="@layout/my_list_item"
    (...)

enter image description here

Is also possible to set header/footer with listheader/listfooter.

Answer:

xmlns:tools="http://schemas.android.com/tools" namespace are using for development purposes(preview) and are not compiled in the application.

<ListView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/list"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    tools:listfooter="@layout/item_footer"
    tools:listheader="@layout/item_header"
    tools:listitem="@layout/item" />