Use ImageView with GridView to set the number of images displayed in rows and columns.

Question

I want to place an 8x8 grid of images, actually only 40x40px icons, in a GridView layout using the ImageView class.

I tried to play with the setLayoutParams and setScaleType methods of the ImageView class, but could not achieve the desired effect. Here's what I have, but I'm only experimenting with a 3x3 grid of small icons until I get it.

The main utility:

package com.topherwilso.ropasci; import android.os.Bundle; import android.app.Activity; import android.view.Menu; import android.widget.GridView; public class MainActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); GridView gv = (GridView) findViewById(R.id.gridview); gv.setAdapter(new ImageAdapter(getApplicationContext())); } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.main, menu); return true; } } 

And my ImageAdapter class:

 package com.topherwilso.ropasci; 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 android.widget.ImageView.ScaleType; public class ImageAdapter extends BaseAdapter { int[] images = { R.drawable.one, R.drawable.two, R.drawable.three, R.drawable.four, R.drawable.five, R.drawable.six, R.drawable.seven, R.drawable.eight, R.drawable.nine }; private Context context; public ImageAdapter(Context applicationContext){ context=applicationContext; } @Override public int getCount() { //Number of data elements to be displayed return images.length; } @Override public Object getItem(int position) { // TODO Auto-generated method stub return null; } @Override public long getItemId(int position) { // TODO Auto-generated method stub return 0; } @Override public View getView(int position, View convertView, ViewGroup parent) { ImageView iv; if(convertView != null){ iv = (ImageView) convertView; } else{ iv = new ImageView(context); iv.setLayoutParams(new GridView.LayoutParams(120, 120)); iv.setScaleType(ScaleType.CENTER); iv.setPadding(0, 0, 0, 0); } iv.setImageResource(images[position]); return iv; } } 

Here's what it looks like now

This is what I would like

Answer 1

Try below

 <?xml version="1.0" encoding="utf-8"?> <GridView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/gridview" android:padding="40dp" android:layout_width="fill_parent" android:layout_height="fill_parent" android:columnWidth="0dp" android:numColumns="3" // set the number of columns to 3 android:verticalSpacing="20dp" android:horizontalSpacing="20dp" android:gravity="center" /> 

http://developer.android.com/guide/topics/ui/layout/gridview.html

http://developer.android.com/reference/android/widget/GridView.html

Indication of the number of lines is not possible. You can use TableLayout instead of gridview if the above does not work. In your case, you have 9 icons, so setting column number 3 should work.

For TableLayout

http://developer.android.com/reference/android/widget/TableLayout.html