android - 如何在纸牌游戏中使用网格布局

Question

我正在开发具有十二张牌的存储卡游戏，三排由四张牌组成。为此，布局由三个线性布局组成，每个布局包含四个 TextView 。

如何使用网格布局以另一种方式进行操作？

这是我创建卡片行的布局 xml:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:orientation="horizontal"
    android:weightSum="4">

    <ImageView
        android:id="@+id/iv_a"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:scaleType="centerInside"
        android:src="@drawable/card" />

    <ImageView
        android:id="@+id/iv_b"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:scaleType="centerInside"
        android:src="@drawable/card" />

    <ImageView
        android:id="@+id/iv_c"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:scaleType="centerInside"
        android:src="@drawable/card" />

    <ImageView
        android:id="@+id/iv_d"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:scaleType="centerInside"
        android:src="@drawable/card" />

</LinearLayout>

Answer 1

对于这种情况，您可以使用 GridView。我将非常简化的代码放在这里，因此您可以根据需要使用和更改它们。这个 GridView 只有 12 个 ImageView。

1. 为 GridView 创建适配器类:

MyGridViewAdapter.java

public class MyGridViewAdapter extends BaseAdapter {

    private Context context;
    private List<Integer> drawables;


    MyGridViewAdapter(Context context) {
        this.context = context;
    }

    void setDrawables(List<Integer> drawables)
    {
        this.drawables = drawables;
    }

    public int getCount() {
        return drawables.size();
    }

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

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

    // create new ImageViews for each item referenced by the Adapter
    public View getView(int position, View convertView, ViewGroup parent) {

        // main layout of each item of gridView:
        RelativeLayout relativeLayout=new RelativeLayout(context);
        relativeLayout.setLayoutParams(new GridView.LayoutParams((int)dpToPx(context, 100),
                (int)dpToPx(context, 100)));

        // images:
        ImageView imageView = new ImageView(context);
        imageView.setImageResource(R.drawable.ic_launcher_background);
        imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
        imageView.setLayoutParams(new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT,
                RelativeLayout.LayoutParams.MATCH_PARENT));
        relativeLayout.addView(imageView);

        return relativeLayout;
    }

    private float dpToPx(Context context, float dp) {
        return dp * context.getResources().getDisplayMetrics().density;
    }
}

1. 将 GridView 添加到您的 Activity 布局:

activity_test.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    tools:context=".TestActivity"
    android:orientation="vertical">

    <GridView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/gridView"
        android:numColumns="auto_fit"
        android:gravity="center"
        android:columnWidth="100dp"
        android:stretchMode="columnWidth"
        android:choiceMode="singleChoice"
        android:drawSelectorOnTop="true"
        android:focusable="true"
        android:clickable="true"
        android:horizontalSpacing="10dp"
        android:verticalSpacing="10dp"
        android:layout_margin="10dp"/>

</LinearLayout>

1. 在您的 Activity 中使用这些代码:

测试 Activity .java

public class TestActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_test);

        // list of 12 images:
        List<Integer> drawables=new ArrayList<>();
        for(int i=0; i<12; i++)
        {
            drawables.add(R.drawable.ic_launcher_background);
        }

        // gridView adapter:
        MyGridViewAdapter adapter = new MyGridViewAdapter(this);
        adapter.setDrawables(drawables);

        // gridView:
        GridView gridView = findViewById(R.id.gridView);
        gridView.setAdapter(adapter);
        gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {

                // what happen when you click on each item
            }
        });
    }
}

结果:

祝你好运!