Grid view images not occupy whole activity

Question

I try to make Main Menu Activity with 4 images using Grid View like Image1. But the images not occupy whole space of Activity. Image2 shows my grid view. How to align the 4 images without scrolling and to fit all screen like Image1?

activity_main_menu.xml

<GridView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/gridview"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:numColumns="2"
    tools:context=".MainMenuActivity"
     />

MainMenuActivity.java

public class MainMenuActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main_menu);
            GridView gridView = (GridView) findViewById(R.id.gridview);
            gridView.setAdapter(new ImageAdapter(this));
    }
}

ImageAdapter.java

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

        ImageView imageView ;

        if(convertView==null)
        {
            imageView = new ImageView(mcontext);

            WindowManager wm = (WindowManager) mcontext.getSystemService(Context.WINDOW_SERVICE);

            Display display = wm.getDefaultDisplay();
            DisplayMetrics outMetrics = new DisplayMetrics ();
            display.getMetrics(outMetrics);

            float density  = mcontext.getResources().getDisplayMetrics().density;
            float dpHeight = outMetrics.heightPixels / density;
            float dpWidth  = outMetrics.widthPixels / density;

            int width=(int) (dpWidth/2);
            int height=(int) (dpHeight/2);


            imageView.setLayoutParams(new GridView.LayoutParams(parent.getWidth()/2,parent.getHeight()/2));
            imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);

            //imageView.setLayoutParams(new GridView.LayoutParams(width,height));
            //imageView.setLayoutParams(new GridView.LayoutParams(imageView.getWidth(),imageView.getHeight()));
            //imageView.setBackgroundColor(000000);
            //imageView.setLayoutParams(new GridView.LayoutParams(400,200));
            //imageView.setLayoutParams(new GridView.LayoutParams());
            //imageView.setPadding(40,40,40,40);
        }
        else
        {
            imageView=(ImageView)convertView;
        }

        imageView.setImageResource(mThumbIds[position]);
        return imageView;
    }


    // references to our images
    private Integer[] mThumbIds = {
            R.drawable.mainmenu1, R.drawable.mainmenu2,
            R.drawable.mainmenu3, R.drawable.mainmenu4
    };

Answer 1

Do this in your code:

 float density  = mcontext.getResources().getDisplayMetrics().density;
                float dpHeight = outMetrics.heightPixels / density;
                float dpWidth  = outMetrics.widthPixels / density;

                int width=(int) (dpWidth);
                int height=(int) (dpHeight);

                imageView.setLayoutParams(new GridView.LayoutParams(width,height));
                imageView.setBackgroundColor(000000);
                imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);

It will remove all spacing b/w images. you can disable the scrolling on gridview.

Link here

Link Here2

Answer 2

You need to specify a separate layout that will represent each item in your gridview. Most likely if you're trying to emulate your image1 you'll have to create a separate layout with a RelativeLayout as parent and an ImageView and TextView as children. Set the height and width of the imageview to match parent(with some padding), and position the TextView on top of the image.

You'll also have to modify your adapter to inflate this custom view and bind your data sources to it(images and text).