GridView-网格布局案例

         (1)图片1效果                                                                                                                  

 

(2)随机点击图片出现

    

(3)随机点击图片出现

  

页面布局content_main.xml用GridView显示

在GridViewTest里用SimpleAdapter将图片显示在content_main.xml页面上

package com.eson.gridview ;

import android.os.Bundle ;
import android.support.v7.app.AppCompatActivity ;
import android.view.View ;
import android.widget.AdapterView ;
import android.widget.GridView ;
import android.widget.ImageView ;
import android.widget.SimpleAdapter ;

import java.util.ArrayList ;
import java.util.HashMap ;
import java.util.List ;
import java.util.Map ;

public class GridViewTest extends AppCompatActivity {
    private ImageView imageView;
    private GridView grid ;
    int[] imageIds =new int []{
            R.drawable. bomb1, R.drawable. bomb2, R.drawable. bomb3,
            R.drawable. bomb4 , R.drawable. bomb5 , R.drawable. bomb6 ,
            R.drawable. bomb7 , R.drawable. bomb8 , R.drawable. bomb9 ,
            R.drawable. bomb10 , R.drawable. bomb11 , R.drawable. bomb12
    } ;

    @Override
    protected void onCreate (Bundle savedInstanceState) {
        super .onCreate(savedInstanceState) ;
        setContentView(R.layout. content_main );
        //创建一个List对象，List对象的元素是Map
        List> listItems= new ArrayList<>() ;
        for ( int i = 0 ; i < imageIds . length; i++) {
            Map map= new HashMap<>();
           map.put( "image" ,imageIds [i]) ;
            listItems.add(map) ;
        }
        //获取显示图片的ImageView
        imageView = (ImageView) findViewById(R.id. imageView );
        //创建一个SimpleAdapter
        SimpleAdapter simpleAdapter= new SimpleAdapter(this, listItems ,R.layout. content_main ,new String[]{ "image"} ,new int []{R.id. imageView}) ;
        grid = (GridView) findViewById(R.id. gridView01 );
        //为GridView设置Adapter
        grid .setAdapter(simpleAdapter) ;
        //添加列表项被选中的监听器
        grid .setOnItemSelectedListener( new AdapterView.OnItemSelectedListener() {
            @Override
            public void onItemSelected (AdapterView parent , View view , int position, long id) {
                imageView.setImageResource( imageIds [position]);
            }

            @Override
            public void onNothingSelected (AdapterView parent) {

            }
        });
        //添加列表项被单击的监听器
        grid .setOnItemClickListener( new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick (AdapterView parent , View view , int position, long id) {
               //显示被单击的图片
                imageView.setImageResource( imageIds [position]);
            }
        });
    }
}