【手把手教】Android图片选取显示(PictureSelecter+GridView)

1.先看最终效果

1.描述

最近在开发中遇到这样的一个场景：即选取照片后利用网格列表显示图片，且图片有个数限制，对于超过限定个数的照片，永远显示最新的九个，类似于微信朋友圈九宫格

2.解决

选取照片的方式有很多种，这里用的依旧是强大的PictureSelecter，对于网格布局采用GridView

demo做了数据持久化，利用了sp存储

3.详细代码

3.1 MainActivity代码

package com.example.newpicturedemo;

import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
import android.content.Context;
import android.content.Intent;
import android.content.SharedPreferences;
import android.database.sqlite.SQLiteDatabase;
import android.os.Bundle;
import android.view.View;
import android.widget.GridView;
import android.widget.ImageView;
import com.google.gson.Gson;
import com.google.gson.reflect.TypeToken;
import com.wildma.pictureselector.PictureBean;
import com.wildma.pictureselector.PictureSelector;
import java.lang.reflect.Type;
import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {
    private ImageView mimage_head;
    private String path;
    private ArrayList<Icon> mData = null;
    private ArrayList<Icon> mData2 = null;
    private GridView grid_photo;
    private MainAdapter mAdapter = null;

    private int num = 0;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mimage_head = findViewById(R.id.picture2);
        grid_photo = (GridView) findViewById(R.id.grid_photo);
        mData = new ArrayList<Icon>();
        SharedPreferences sp = getSharedPreferences("SP", Context.MODE_PRIVATE);
        String value = sp.getString("picture", "");
        if (value==""){
            return;
        }else{
            Gson gson = new Gson();
            Type type = new TypeToken<ArrayList<Icon>>(){}.getType();
            ArrayList<Icon> list = gson.fromJson(value,type);
            for (int i=0;i<list.size();i++){
                mData.add(list.get(i));
            }
            mAdapter = new MainAdapter(this, mData);
            grid_photo.setAdapter(mAdapter);
        }


    }

    public void cl(View view) {
        PictureSelector.create(MainActivity.this, PictureSelector.SELECT_REQUEST_CODE)
                .selectPicture();
    }

    @Override
    protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        if (requestCode == PictureSelector.SELECT_REQUEST_CODE) {
            if (data != null) {
                PictureBean pictureBean = data.getParcelableExtra(PictureSelector.PICTURE_RESULT);
                //操作mData数组，使之存储最新的8张图片数据
                if (mData.size() > 8 || mData.size() == 8) {
                    mData.remove(7);
                    mData.add(0, new Icon(pictureBean.getPath(), "图标1"));
                } else {
                    mData.add(new Icon(pictureBean.getPath(), ""));
                }
                //利用Gson，将图片数组存入SharedPreferences
                Gson gson = new Gson();
                String str = gson.toJson(mData);
                SharedPreferences sp = getSharedPreferences("SP", Context.MODE_PRIVATE);
                sp.edit().putString("picture",str).apply();
                //读取SharedPreferences的值，转换成数组
                String value = sp.getString("picture", "");
                Type type = new TypeToken<ArrayList<Icon>>(){}.getType();
                ArrayList<Icon> list = gson.fromJson(value,type);
                mAdapter = new MainAdapter(this, list);
                grid_photo.setAdapter(mAdapter);
                }
            }
        }
    }

解释：主要利用了PictureSelecer进行图片拍照或者相册选取，选取后在onActivityResult拿到图片结果，利用mData数组操作显示最新8张图片这一功能，其后将数组利用Gson存入SP实现数据持久化。

3.2 MainAdapter代码

package com.example.newpicturedemo;

import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;

import com.bumptech.glide.Glide;

import java.io.File;
import java.util.ArrayList;
import java.util.List;

public class MainAdapter extends BaseAdapter {

    private ArrayList<Icon> icons;
    private Context context;

    public MainAdapter(Context context, ArrayList<Icon> icons) {
        super();
        this.context = context;
        this.icons = icons;
    }

    @Override
    public int getCount() {
        return icons.size();
    }

    @Override
    public Object getItem(int i) {
        return icons.get(i);
    }

    @Override
    public long getItemId(int i) {
        return 0;
    }

    @Override
    public View getView(int i, View view, ViewGroup viewGroup) {
        if (view == null) {
            view = View.inflate(context, R.layout.item_grid_icon, null);
        }
        ImageView imageView = view.findViewById(R.id.img_icon);
        Glide.with(context).load(new File(icons.get(i).getiId())).into(imageView);

        return view;
    }
}

3.3 Bean类Icon代码

package com.example.newpicturedemo;

public class Icon {
    private String iId;
    private String iName;

    public Icon() {
    }

    public Icon(String iId, String iName) {
        this.iId = iId;
        this.iName = iName;
    }

    public String getiId() {
        return iId;
    }

    public String getiName() {
        return iName;
    }

    public void setiId(String iId) {
        this.iId = iId;
    }

    public void setiName(String iName) {
        this.iName = iName;
    }
}

3.4 MainActivity布局代码

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <GridView
            android:id="@+id/grid_photo"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:numColumns="4" />
        <ImageView
            android:id="@+id/picture2"
            android:layout_width="150dp"
            android:onClick="cl"
            android:layout_gravity="center"
            android:layout_height="150dp"
            android:src="@mipmap/ic_add_image"/>

        <TextView
            android:visibility="gone"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:paddingTop="10dp"
            android:text="正面"
            android:layout_gravity="center"
            android:textColor="@color/black"
            android:textSize="18sp" />

    </LinearLayout>

</LinearLayout>

3.5 引入PictureSelccter依赖

implementation 'com.google.code.gson:gson:2.8.8'

PictureSelecter的坑，记得在AndroidManifest的Application里加入一句：android:requestLegacyExternalStorage="true"