Android GridView last column getting cut

Question

I have a GridView holding TextViews in my app and for some reason the last column is getting it's edge cut (see screenshot below). I'm guessing it has something to do with the little bit of gap in the left side of the GridView, but I don't know whats causing it.

What am I doing wrong here?

I've made the GridView background a bit darker than the fragment background.

My Code:

layout/fragment.xml:

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
                                         xmlns:app="http://schemas.android.com/apk/res-auto"
                                         xmlns:tools="http://schemas.android.com/tools"
                                         android:layout_width="match_parent"
                                         android:layout_height="match_parent"
                                         android:background="#ADD178"
                                         tools:context="com.example.myapp.Fragment"
                                         android:id="@+id/constraintLayout">
<android.support.v7.widget.CardView
    android:id="@+id/current_card"
    android:layout_width="73dp"
    android:layout_height="89dp"
    app:cardBackgroundColor="#E917BC"
    app:layout_constraintLeft_toLeftOf="@+id/constraintLayout"
    android:layout_marginStart="16dp"
    app:layout_constraintTop_toTopOf="@+id/constraintLayout"
    android:layout_marginTop="16dp">

    <TextView
        android:id="@+id/current_card_letter"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:textSize="40dp"
        android:gravity="center"
        android:textColor="#000000"
        tools:layout_editor_absoluteX="0dp"
        tools:layout_editor_absoluteY="0dp"/>
    </android.support.v7.widget.CardView>

<GridView
    android:id="@+id/all_cards_grid_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:numColumns="auto_fit"
    android:columnWidth="60dp"
    android:horizontalSpacing="5dp"
    android:verticalSpacing="5dp"
    android:stretchMode="spacingWidthUniform"
    android:background="#30000000"
    app:layout_constraintLeft_toLeftOf="@+id/constraintLayout"
    android:layout_marginStart="8dp"
    app:layout_constraintTop_toBottomOf="@+id/current_card"
    android:layout_marginTop="8dp"
    app:layout_constraintRight_toRightOf="@+id/constraintLayout"
    android:layout_marginEnd="8dp"
    app:layout_constraintBottom_toBottomOf="@+id/constraintLayout"
    android:layout_marginBottom="8dp"/>

</android.support.constraint.ConstraintLayout>

getView from the Adapter:

@Override
public View getView(final int position, View convertView, ViewGroup parent) {
    TextView textView;
    if (convertView == null) {
        textView = new TextView(mContext);
        textView.setPadding(CARD_PADDING, CARD_PADDING, CARD_PADDING, CARD_PADDING);
        textView.setLayoutParams(new GridView.LayoutParams(160, 160));
        textView.setTextSize(40);
        textView.setTextColor(Color.BLACK);
        textView.setGravity(Gravity.CENTER);
    } else {
        textView = (TextView) convertView;
    }

    textView.setBackgroundResource(getItem(position).getThumbnailID());
    textView.setText(getItem(position).getLetter());

    return textView;
}

Answer 1

Remove android:layout_marginStart and android:layout_marginEnd attributes, and they will stop being pushed outside of bounds.

Answer 2

You're wanting columnWidth to be 60dp and by using auto_fit num_columns property the GridView measures column count by that. In your adapter you are then forcing the item size which then doesn't match with the GridView width and number of columns.

Here is one way to calculate the actual columnWidth which will fit. Not 100% sure if the math here is correct, but hopefully this might give you a lead to solve your issue.

If you want items to be rectangle you could be passing the calculated width to the adapter and use that for the view layout param width and height.

Activity:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    final GridView gv = (GridView) findViewById(R.id.all_cards_grid_view);
    gv.post(new Runnable() {
        @Override
        public void run() {
            gv.setColumnWidth((gv.getWidth() - (gv.getNumColumns() * gv.getHorizontalSpacing())
                    - gv.getHorizontalSpacing() * 2) / gv.getNumColumns());
            gv.setAdapter(new TestAdapter(MainActivity.this));
        }
    });
}

public class TestAdapter extends BaseAdapter {

    private static final int CARD_PADDING = 10;

    private Context mContext;

    public TestAdapter(Context context) {
        mContext = context;
    }

    @Override
    public View getView(final int position, View convertView, ViewGroup parent) {
        TextView textView;
        if (convertView == null) {
            textView = new TextView(mContext);
            textView.setPadding(CARD_PADDING, CARD_PADDING, CARD_PADDING, CARD_PADDING);
            //textView.setLayoutParams(new GridView.LayoutParams(200, 200));
            textView.setTextSize(40);
            textView.setTextColor(Color.BLACK);
            textView.setBackgroundColor(Color.BLUE);
            textView.setGravity(Gravity.CENTER);
        } else {
            textView = (TextView) convertView;
        }

        textView.setText("A");

        return textView;
    }

    @Override
    public long getItemId(int position) {
        return 0;
    }

    @Override
    public boolean hasStableIds() {
        return false;
    }

    @Override
    public Object getItem(int position) {
        return null;
    }

    @Override
    public int getCount() {
        return 20;
    }
}

Xml:

<GridView
    android:id="@+id/all_cards_grid_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingTop="5dp"
    android:paddingBottom="5dp"
    android:background="#30000000"
    android:columnWidth="60dp"
    android:numColumns="auto_fit"
    android:horizontalSpacing="0dp"
    android:stretchMode="spacingWidthUniform"
    android:verticalSpacing="5dp"/>