Android main_activity simple Games pattern e.g. for Cardgame

Question

I've never thought I would run into so many troubles to get this done.

I want to display content let's say 2 rows and 4 columns. In each cell is a picture with a different size and different aspect ratio. All 8 cells should fill the whole screen.

I want now those 8 images are displayed correctly (shrinked/scaled) on a Smartphone with a resolution of 1920x1080px and a Smartphone with a resolution of 480x320px. In both cases the 8 pictures should fill the whole screen.

Can someone be so kind and post these few lines of codes?

Or do I need to do this all programmatically, checking the screenresolution, checking the dpi and then re scaling each image?

thanks a lot

this isnt working for me:

    <GridLayout
        android:id="@+id/gridLayout1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:columnCount="2"
        android:rowCount="2" >

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="left|top"
            android:src="@drawable/img1" />

        <ImageView
            android:id="@+id/imageView1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="left|top"
            android:src="@drawable/img2" />
    </GridLayout>

I tried almost any kind of combination using

android:layout_width="match_parent" fill_parent or wrap_content

Answer 1

So I finally got around to working with this, and you are right the GridLayout for some reason seemed a bit off. I wrote and tested the following code, however, and it works for what you need. You will just need to change the images to what you need, obviously.

XML:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:weightSum="2"
    android:orientation="vertical"
    android:id="@+id/grid">

    <RelativeLayout
        android:id="@+id/top_row"
        android:layout_width="match_parent"
        android:layout_height="0dp" 
        android:layout_weight="1"
        android:orientation="horizontal" />

    <RelativeLayout
        android:id="@+id/bottom_row"
        android:layout_width="match_parent"
        android:layout_height="0dp" 
        android:layout_weight="1"
        android:orientation="horizontal" />

</LinearLayout>   

And then you can dynamically add in your views

RelativeLayout topLayout = (RelativeLayout) findViewById(R.id.top_row);
RelativeLayout bottomLayout = (RelativeLayout) findViewById(R.id.bottom_row);

Point point = new Point();
getWindowManager().getDefaultDisplay().getSize(point);
int width = point.x;
RelativeLayout.LayoutParams params;

    for(int i = 0; i < 8; i++){
        params = new RelativeLayout.LayoutParams(width/4, RelativeLayout.LayoutParams.MATCH_PARENT);
        ImageView image = new ImageView(this);
        image.setId(i+1);
        image.setVisibility(View.VISIBLE);
        image.setImageResource(R.drawable.ic_launcher);
        image.setScaleType(ScaleType.FIT_XY);

        if(i < 4){
            if(i == 0)
                params.addRule(RelativeLayout.ALIGN_LEFT);
            else
                params.addRule(RelativeLayout.RIGHT_OF, i);

            image.setLayoutParams(params);
            topLayout.addView(image);
        }
        else if(i >=4){
            if(i == 4)
                params.addRule(RelativeLayout.ALIGN_LEFT);
            else
                params.addRule(RelativeLayout.RIGHT_OF, i);

            image.setLayoutParams(params);
            bottomLayout.addView(image);
        }

    }

That should do it as far as what you have asked for :)