如何制作4x4的imageviews网格？

Question

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

<ImageView
    android:id="@+id/imageView1"
    android:layout_width="wrap_content"
    android:layout_height="100dp"
    android:src="@drawable/music" />

<ImageView
    android:id="@+id/imageView2"
    android:layout_width="wrap_content"
    android:layout_height="100dp"
    android:src="@drawable/music" />

<ImageView
    android:id="@+id/imageView3"
    android:layout_width="wrap_content"
    android:layout_height="100dp"
    android:src="@drawable/music" />

<ImageView
    android:id="@+id/imageView4"
    android:layout_width="wrap_content"
    android:layout_height="100dp"
    android:src="@drawable/music" />

</TableLayout>

This is the original XML, i just need to add more. i have an imageView that's big , so it needs to be shrunk down and copied 16 times into a 4x4 grid. I can only get it to go 4 images in one column

Answer 1

I don't understand the problem with the large image, but I will tell you my suggestion:

there are multiple possible solutions:

1. Since you have 16 imageViews that you wish to create, you can use a GridView together with a BaseAdapter . If it's important for you to see it in the xml, use isInEditMode for a custo GridView, and set the adapter there to be your adapter with fake items. You should be aware of problems with the sizes of the columns/rows on the gridView , especially when changing orientations.

2. Another alternative could be the GridLayout

3. If you insist on using the TableLayout, you can have 4 TableRow instances, each has a weight of 1 . in each of them , add 4 imageViews and there each has a weight of 1.

Answer 2

Add 4 TableRow 's and put your ImageView 's into them.

Or you can create this grid from code. Like this:

LinearLayout container = null;
LayoutParams params = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT, 1);
for (int i = 0; i < 16; ++i) {
    if (i % 4 == 0) {
        container = new LinearLayout(getActivity());
        container.setOrientation(LinearLayout.HORIZONTAL);
        mGrid.addView(container);
    }
    LinearLayout view = (LinearLayout) mLayoutInflater
        .inflate(R.layout.view_item, container, false);
        //populate the view in loop
        view.setLayoutParams(params);
        container.addView(view);
    }