GridView items are too small - Android

Question

I am following this tutorial, it is very simple, and yet my GridView images are much much smaller than the one in the tutorial. Does anything stand out as wrong code? Below I've included my main activity, my adapter class, and my xml with the GridView.

It should be like this:

Instead, mine is like this:

SitesActivity.java

package org.azurespot.cutelinks;

import android.os.Bundle;
import android.support.v7.app.ActionBarActivity;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.GridView;

import org.azurespot.R;

public class SitesActivity extends ActionBarActivity {

    private GridView gridView;

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

        // with fragments, make sure you include the rootView when finding id
        gridView = (GridView) findViewById(R.id.sites_grid);
        // Set the Adapter to GridView
        gridView.setAdapter(new GridViewSitesAdapter(this));
    }


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_sites, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

GridViewSitesAdapter.java

package org.azurespot.cutelinks;

import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;

import org.azurespot.R;

/**
 * Created by mizu on 2/11/15.
 */
public class GridViewSitesAdapter extends BaseAdapter {

    public Context mContext;

    public GridViewSitesAdapter(Context c) {
        mContext = c;
    }

    // Keep all Images in array
    public Integer[] mThumbIds = {
            R.drawable.cute_overload, R.drawable.attack_of_the_cute,
            R.drawable.zoo_borns, R.drawable.cutest_paw,
            R.drawable.mochimochiland, R.drawable.baby_mugging,
            R.drawable.cutest_food, R.drawable.tiny_cute_things,
            R.drawable.etsy_robot_plush
    };

    @Override
    public int getCount() {
        return mThumbIds.length;
    }

    @Override
    public Object getItem(int position) {
        return mThumbIds[position];
    }

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


    @Override
    public View getView(int position, View convertView, ViewGroup parent) {

        ImageView imageView = new ImageView(mContext);
        imageView.setImageResource(mThumbIds[position]);
        imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
        imageView.setLayoutParams(new GridView.LayoutParams(70, 70));
        return imageView;

    }
}

activity_sites.xml

<RelativeLayout 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"
    tools:context="org.azurespot.cutelinks.SitesActivity"
    android:background="#2198bb">


    <GridView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/sites_grid"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:horizontalSpacing="10dp"
        android:verticalSpacing="10dp"
        android:layout_margin="10dp"
        android:columnWidth="90dp"
        android:gravity="center"
        android:numColumns="auto_fit"
        android:stretchMode="columnWidth"
        android:background="@drawable/button_border">

        </GridView>

</RelativeLayout>

Answer 1

Why don't you just calculate the width of gridview item based on the screenwidth

columnWidth = (int) ((getScreenWidth() - ((AppConstant.NUM_OF_COLUMNS + 1) * padding)) / AppConstant.NUM_OF_COLUMNS);

Hope this sample line of code will help you understand. Let me know if you need any help on it.

Thanks :)