Question

我在Android中支持多个屏幕的拼图UI有问题！期望的拼图是这样的：

Puzzle

我使用GridView并在每个单元格中设置图像。（每个单元格都有一个独特的图像）我不知道如何在不使用屏幕分辨率的情况下设置Gridview及其单元格（行高/列宽）的尺寸！ :( 图像的纵横比为1：1，必须在单元格中拉伸。

我做了什么：

row_grid.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="300dp"
        android:layout_height="100dp"
        android:padding="0dp" >

        <ImageView
            android:id="@+id/item_image"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:scaleType="fitXY"
            android:src="@drawable/icon2" >
        </ImageView>
</FrameLayout>

activity_main.xml中

<FrameLayout 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"
    android:background="@drawable/katy">

    <GridView
        android:id="@+id/gridView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:horizontalSpacing="0dp"
        android:numColumns="2"
        android:stretchMode="columnWidth"
        android:verticalSpacing="0dp" >

    </GridView>

    <TextView
        android:id="@+id/textView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        android:text="TextView"
        android:textSize="30sp" />

</FrameLayout>

MainActivity.java

package com.example.test;

import java.util.ArrayList;

import android.R.dimen;
import android.R.integer;
import android.os.Bundle;
import android.app.Activity;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Point;
import android.view.Display;
import android.view.Menu;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.widget.Button;
import android.widget.FrameLayout;
import android.widget.GridView;
import android.widget.TextView;


public class MainActivity extends Activity {
    GridView gridView;
    ArrayList<Item> gridArray = new ArrayList<Item>();
    CustomGridViewAdapter customGridAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        //Remove App TitleBar
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        final TextView txt = (TextView) findViewById(R.id.textView1);
        txt.setText(Integer.toString(width)+" x "+Integer.toString(height));


        Bitmap block  = BitmapFactory.decodeResource(this.getResources(), R.drawable.icon1);
        Bitmap block2 = BitmapFactory.decodeResource(this.getResources(), R.drawable.icon2);
        Bitmap block3 = BitmapFactory.decodeResource(this.getResources(), R.drawable.icon3);
        Bitmap block4 = BitmapFactory.decodeResource(this.getResources(), R.drawable.icon4);

        gridArray.add(new Item(block));
        gridArray.add(new Item(block2));
        gridArray.add(new Item(block3));
        gridArray.add(new Item(block4));

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

        ViewGroup.LayoutParams layoutParams = gridView.getLayoutParams();
        layoutParams.height = 300; //this is in pixels
        layoutParams.width  = 300; //this is in pixels
        gridView.setLayoutParams(layoutParams);


        customGridAdapter = new CustomGridViewAdapter(this, R.layout.row_grid, gridArray);
        gridView.setAdapter(customGridAdapter);
    }


    @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;
    }

}

结果：

result

如何使其独立于屏幕尺寸和分辨率？！：（

编辑：我试图动态更改GridView的宽度，但发生致命异常！

package com.example.test;

import java.util.ArrayList;

import android.R.dimen;
import android.R.integer;
import android.os.Bundle;
import android.app.Activity;
import android.content.res.Resources;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Point;
import android.view.Display;
import android.view.Menu;
import android.view.View;
import android.view.ViewGroup;
import android.view.Window;
import android.widget.Button;
import android.widget.FrameLayout;
import android.widget.GridView;
import android.widget.LinearLayout;
import android.widget.TextView;


public class MainActivity extends Activity {
    GridView gridView;
    ArrayList<Item> gridArray = new ArrayList<Item>();
    CustomGridViewAdapter customGridAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        //Remove App TitleBar
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //Get Screen Dimensions
        Display display = getWindowManager().getDefaultDisplay();
        Point size = new Point();
        display.getSize(size);
        int width = size.x;
        int height = size.y;

        final TextView txt = (TextView) findViewById(R.id.textView1);
        txt.setText(Integer.toString(width)+" x "+Integer.toString(height));

        Bitmap block  = BitmapFactory.decodeResource(this.getResources(), R.drawable.icon1);
        Bitmap block2 = BitmapFactory.decodeResource(this.getResources(), R.drawable.icon2);
        Bitmap block3 = BitmapFactory.decodeResource(this.getResources(), R.drawable.icon3);
        Bitmap block4 = BitmapFactory.decodeResource(this.getResources(), R.drawable.icon4);

        gridArray.add(new Item(block));
        gridArray.add(new Item(block2));
        gridArray.add(new Item(block3));
        gridArray.add(new Item(block4));

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

        //###### Change Height of cells #####//
        LinearLayout rg = (LinearLayout) findViewById(R.layout.row_grid);
        ViewGroup.LayoutParams rgparam = rg.getLayoutParams();
        rgparam.height = rgparam.width;
        rg.setLayoutParams(rgparam);          

        customGridAdapter = new CustomGridViewAdapter(this, R.layout.row_grid, gridArray);
        gridView.setAdapter(customGridAdapter);
    }


    @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;
    }

}

我也测试了这个：

    customGridAdapter = new CustomGridViewAdapter(this, rg.getId(), gridArray);

Answer 1

查看相对布局。我相信它会解决你的问题。您可以指定图像所在的位置以及图像所在的位置。因此，在上图中，方框2位于方框1的右侧，并与父视图的顶部对齐。方框1将与父母的顶部和左边对齐。

Answer 2

Try with below code and check if its working or not?  



        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:tools="http://schemas.android.com/tools"
                android:layout_width="100dp"
                android:layout_height="100dp"
                android:padding="0dp" >

                <ImageView
                    android:id="@+id/item_image"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:scaleType="fitXY"
                    android:src="@drawable/ic_launcher" >
                </ImageView>

            </LinearLayout>

    -------------------------------

    <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"
        android:background="@drawable/background" >

        <GridView
            android:id="@+id/gridView1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:horizontalSpacing="0dp"
            android:numColumns="3"
            android:stretchMode="columnWidth"
            android:verticalSpacing="0dp" >
        </GridView>

    </RelativeLayout>

用于在多个屏幕中创建拼图的Android gridview

2 个答案: