GridView breaks while scrolling

Question

I am working on a custom launcher application. For this reason I created a custom GridView that displays all installed applications.

The problem is that when I scroll through the apps, the gridview has a weird behavior. Sometimes it will break the horizontal alignment because of a multiline application name. Sometimes the scrolling bounds go crazy and you end up scrolling outside the gridview.

Here is a video of the problems I describe above. I am using the following code.

public class CustomGridView extends BaseAdapter{
    private Context mContext;
    private List<Application> app;
    public CustomGridView(Context c, List<Application> app) {
        super();
        mContext = c;
        this.app = app;
    }
    @Override
    public int getCount() {
        return app.size();
    }
    @Override
    public Object getItem(int position) {
        return app.get(position).appPkg;
    }
    @Override
    public long getItemId(int position) {
        return 0;
    }
    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder view;
        if (convertView == null) {
            LayoutInflater inflater = (LayoutInflater) mContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            convertView = inflater.inflate(R.layout.grid_item, null);

            view = new ViewHolder();

            view.appName = (TextView) convertView.findViewById(R.id.grid_text);
            view.appIcon = (ImageView) convertView.findViewById(R.id.grid_image);

            convertView.setTag(view);
        } else {
            view = (ViewHolder) convertView.getTag();
        }

        view.appName.setText(app.get(position).appName);
        view.appIcon.setImageDrawable(app.get(position).appIcon);

        return convertView;
    }



    static class ViewHolder
    {
        ImageView appIcon;
        TextView appName;
    }
}

For the grid_item I use the following.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent"
              android:orientation="vertical"
              android:padding="10dp"
              android:layout_marginBottom="10dp"
              android:gravity="fill_horizontal|center_horizontal">

    <ImageView
            android:layout_height="62dp"
            android:id="@+id/grid_image"
            android:layout_width="62dp"
            android:layout_gravity="center_horizontal"/>

    <TextView
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:id="@+id/grid_text"
            android:layout_marginTop="2dp"
            android:textSize="12sp"
            android:ellipsize="marquee"
            android:gravity="center|center_horizontal" android:textAlignment="center"
            android:layout_gravity="center_horizontal"/>

</LinearLayout>

And here is the activity layout

<GridView
        android:id="@+id/gridView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:columnWidth="80dp"
        android:gravity="center"
        android:numColumns="auto_fit"
        android:stretchMode="columnWidth" android:layout_marginLeft="5dp" android:layout_marginRight="5dp"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true" android:layout_alignParentTop="true">
</GridView>

Answer 1

The problem with the height of TextView. So, make TextView single line like:

android:singleLine="true"

or, If u want 2 or 3 lines for some of the items, then make all the items have 2 or 3 lines like:

android:minLines="2"