Add layout above ListView

Question

I currently have a ListView set up that is populated with JSON data from my website. I want to add a layout above the ListView, but still make it scrollable with the ListView.

Here is my current ListView layout (listview_layout.xml):

<LinearLayout
    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">

    <ListView
        android:id="@+id/listview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:dividerHeight="0dp"
        android:divider="@null" />

</LinearLayout>

Here is the onCreateView() method from the fragment that loads the JSON data into the adapter and then into the ListView:

public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    View view = inflater.inflate(R.layout.listview_layout, container, false);
    final ListView listView = (ListView) view.findViewById(R.id.listview);

    final ArrayList<User> userArray = new ArrayList<User>();

    final RestAdapter restAdapter = new RestAdapter.Builder().setEndpoint(URL).build();

    final ApiEndpointInterface apiService = restAdapter.create(ApiEndpointInterface.class);

    apiService.getUsers(new Callback<UserData>() {

        @Override
        public void success(UserData userData, Response response) {
            final UserAdapter adapter = new UserAdapter(getActivity(), userArray);
            userArray.addAll(userData.getData());
            listView.setAdapter(adapter);
            adapter.notifyDataSetChanged();
        }

        @Override
        public void failure(RetrofitError retrofitError) {
            retrofitError.printStackTrace();
        }
    });

    return view;
}

Here is the layout I want to above the ListView:

<LinearLayout
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_marginBottom="30dp">

    <ImageView
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:background="@drawable/ic_user"
        android:adjustViewBounds="true"
        android:scaleType="centerCrop"
        android:layout_gravity="center_vertical" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="User"
        android:textSize="18sp"
        android:layout_gravity="center_vertical" />

</LinearLayout>

How can I add this layout above the ListView and have it scroll with the ListView (not a sticky/fixed layout)?

To illustrate, here is what I need. Notice the scrollbar (red) is over the whole screen, not just the ListView:

Add layout as headerview of listview – IntelliJ Amiya Sep 02 '15 at 01:34 — IntelliJ Amiya, Sep 02 '15 at 01:34

score 0 · Answer 1 · answered Sep 01 '15 at 23:49

0

You can create ListViews with different layouts, and just add a header layout at the top of your list.

http://www.survivingwithandroid.com/2014/08/android-listview-with-multiple-row.html

That seems to have a good guide.

answered Sep 01 '15 at 23:49

MrPlow

1,214
10
9

score 0 · Answer 2 · answered Sep 02 '15 at 00:03

Here's another suggestion:

Use an include tag, to include your layout into listview_layout.xml:

<LinearLayout
    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"
    orientation="vertical">

    <include layout="@layout/title_header_layout"></include>
    <ListView
        android:id="@+id/listview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:dividerHeight="0dp"
        android:divider="@null" />

</LinearLayout>

You can also use a RelativeLayout instead of a LinearLayout to reduce the depth of the View hierarchy.

Also some notes below:

Make sure that you set your ListView's layout_height attribute to match_parent
Set your LinearLayout's orientation tag.

This doesn't get the desired effect. Only the ListView is scrollable, not the entire screen. — George, Sep 02 '15 at 00:08
@George Sorry, I didn't see that. In that case, in your Adapter you will have to support two different view types. You can achieve that by overriding Adapter.getItemViewTypeCount (returning 2), and in Adapter.getView, you will inflate the correct item layout (header vs actual item) depending on the position. — WindsurferOak, Sep 02 '15 at 00:17

score 0 · Answer 3 · answered Sep 02 '15 at 00:08

0

One more suggestion. You can add the header view as part of a view in your listview as your first element in your listview by making it custom list view.

For ex-

LinearLayout.setAdapter(new CustomAdapter());
class CustomAdapter(
 public view getview(){
}
}

I ahve done this kind of thing for displaying adviews on top of thelistview.

answered Sep 02 '15 at 00:08

RajSharma

1,941
3
21
34

Can you explain more? – George Sep 02 '15 at 00:24

Add layout above ListView

3 Answers3