0
votes

Grid View images not fit in hdpi and xhdpi. It properly fits in mdpi emulator and device.My image sizes are below(it follows 3:4:6:8 ratio).

ldpi 366*225 mdpi 488*300 //it properly fits on emulator and device screen hdpi 732*450 Xhdpi 976*600

1st Image(MDPI) fit on screen properly,2nd Image(XHDPI same as HDPI) not fit?

MDPI

XHDPI

MenuActivity:

GridView gridView = (GridView) findViewById(R.id.gridview);

    gridView.setAdapter(new ImageAdapter(this));


    gridView.setOnTouchListener(new OnTouchListener(){
        @Override
        public boolean onTouch(View v, MotionEvent event) {
            if(event.getAction() == MotionEvent.ACTION_MOVE){
                return true;
            }
            return false;
        }
    });

    gridView.setScrollBarStyle(View.SCROLLBARS_INSIDE_OVERLAY); 
    gridView.setVerticalScrollBarEnabled(false);

ImageAdapter.java:

public class ImageAdapter extends BaseAdapter {

    private Context mcontext;

    public ImageAdapter(Context c) {
        mcontext=c;
    }

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

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

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

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

        ImageView imageView ;

        if(convertView==null)
        {
            imageView = new ImageView(mcontext);
            //imageView.inflate(mcontext, R.layout.mainmenu_griditem,null);
            ImageView.inflate(mcontext, R.layout.mainmenu_griditem,null);

            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;

            Log.i("image","density->"+density);
            float dpHeight = outMetrics.heightPixels / density;
            Log.i("image","dpHeight->"+dpHeight);
            float dpWidth  = outMetrics.widthPixels / density;
            Log.i("image","dpWidth->"+dpWidth);

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

            Log.i("image","Image Width->"+width);
            Log.i("image","Image height->"+height);

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

            //imageView.setLayoutParams(new GridView.LayoutParams(width,height));


            imageView.setLayoutParams(new GridView.LayoutParams(width,height));





            //imageView.setLayoutParams(new GridView.LayoutParams(parent.getWidth()/2,parent.getHeight()/2));


            //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.setScaleType(ImageView.ScaleType.FIT_XY);
            //imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
            //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
    };
}

I tried lot but no help.

mainmenugriditem.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <ImageView android:id="@+id/mm_grid_image"
        android:layout_width="match_parent"
        android:layout_height="match_parent"

       />
    <TextView android:id="@+id/mm_grid_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:labelFor="@id/mm_grid_image"/>

</RelativeLayout>

Logcat Output for MDPI:(Emulator-7" WSVGA-tablet-1024*600:mdpi)

Logcat-MDPI

Logcat Output for XHDPI: (Emulator-Galaxy Nexus-4.65"-720*1280:xhdpi)

Logcat-XHDPI

2
Can you please post what you get when you log out width and height for both mdpi and xhdpi? I want to double check that the xhdpi value is double mdpi.Simon Zettervall
Updated my question with logcat output for mdpi and xhdpi and also my mainmenugriditem.xml file.Ramprasad
Also i have a doubt, Design image based on the four Resolutions(ldpi.mdpi,hdpi,xhdpi) or screen size?Ramprasad

2 Answers

0
votes

Hi have you created separated folder for different Screen sizes if not create it like this

Layout-small

Layout-large

Layout-xlarge

So then you copy your layout XML files in to these folders and check the preview in Palette window for Xhdpi the default screen size is 10" so that you can adjust your Grid view in the layout.

0
votes

I designed bitmap for MDPI resolution(because 1 px=1 dp in MDPI). Then convert to other Resolution buckets using http://labs.skinkers.com/content/android_dp_px_calculator/

Modify following code:

Change this:

                Log.i("image","density->"+density);
                float dpHeight = outMetrics.heightPixels / density;
                Log.i("image","dpHeight->"+dpHeight);
                float dpWidth  = outMetrics.widthPixels / density;
                Log.i("image","dpWidth->"+dpWidth);

TO :

            float dpHeight = outMetrics.heightPixels;
            float dpWidth  = outMetrics.widthPixels;