Ad

Listview Adapter With Gridview Inside Linearlayout Showing Items Below Eachother Instead Of In Two Columns

- 1 answer

I'm creating a ListView custom adapter using a gridview inside a linear layout to display user profiles.

My XML design view shows them correctly. However, when I run the app, it's showing each item below each other instead of spread over 2 columns. Any idea on what I'm doing wrong?

Example

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <GridView
        android:id="@+id/grid_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:numColumns="2"
        android:stretchMode="columnWidth"
        android:gravity="center" />

    <ImageView
        android:id="@+id/rimage"
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:layout_margin="10dp"
        android:contentDescription="@string/todo"
        app:srcCompat="@drawable/thumb_default_icon_female" />

    <TextView
        android:id="@+id/rnick"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="10dp"
        android:text="@string/nick" />

    <TextView
        android:id="@+id/rcity"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginStart="10dp"
        android:text="@string/city" />
</LinearLayout>

Showing List Items

Ad

Answer

Your current list items logic is something like this:

Item 1--> LinearLayout
        -->GridView
        -->ImageView
        -->TextView
        -->TextView

Item 2--> LinearLayout
        -->GridView
        -->ImageView
        -->TextView
        -->TextView

So in actual case, your items are LinearLayouts taking up the whole width of the device's screen.

Instead of a ListView, you should use a GridView as your items' container and you should implement your customAdapter to use LinearLayout items:

Your GridView in your Activity's layout:

<GridView
    android:id="@+id/grid_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:numColumns="2"
    android:stretchMode="columnWidth"
    android:gravity="center" />

Your items' layout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical" android:layout_width="fill_parent"
android:layout_height="fill_parent">

<ImageView
    android:id="@+id/rimage"
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:layout_margin="10dp"
    android:contentDescription="@string/todo"
    app:srcCompat="@drawable/thumb_default_icon_female" />

<TextView
    android:id="@+id/rnick"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginStart="10dp"
    android:text="@string/nick" />

<TextView
    android:id="@+id/rcity"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginStart="10dp"
    android:text="@string/city" />

and set your adapter to your GridView directly. Make sure your adapter extends BaseAdapter (not ListAdapter);

yourGridView.setAdapter(yourCustomAdapter);

All in all, a better approach would be to use a RecyclerView with GridLayoutManager.

recyclerView.setLayoutManager(new GridLayoutManager(getContext(), 2));
            recyclerView.setHasFixedSize(true);
            recyclerView.setAdapter(adapter);

Here is a simple tutorial

Ad
source: stackoverflow.com
Ad