[Android] 通过GridView仿微信动态添加本地图片示例代码

下面我将为您详细讲解 “[Android] 通过GridView仿微信动态添加本地图片示例代码”的完整攻略。

1. 确定需求

在开始编写代码之前，我们需要明确自己的需求。本篇攻略的目的是通过GridView来仿照微信动态添加本地图片的功能。我们需要实现以下功能：

• 显示本地图片的缩略图
• 点击图片后可以查看其大图
• 长按图片后可以删除该图片
• 可以添加新的本地图片

2. 创建GridView布局

我们现在需要创建一个布局，用来显示我们的GridView。在XML文件中定义GridView，然后再为其创建一个adapter，将图片添加到GridView中。可以参考以下示例：

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

接下来我们需要创建GridView的adapter。在adapter中，我们需要重写getView方法。可以参考以下示例：

public class GridImageAdapter extends BaseAdapter {
    private Context mContext;
    private List<String> mImages;

    public GridImageAdapter(Context context, List<String> images) {
        this.mContext = context;
        this.mImages = images;
    }

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

    @Override
    public Object getItem(int position) {
        return mImages.get(position);
    }

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

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ImageView imageView;
        if (convertView == null) {
            imageView = new ImageView(mContext);
            imageView.setLayoutParams(new GridView.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, 250));
            imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
            imageView.setPadding(8, 8, 8, 8);
        } else {
            imageView = (ImageView) convertView;
        }

        Glide.with(mContext).load(mImages.get(position)).into(imageView);
        return imageView;
    }
}

3. 为GridView添加图片

现在我们已经完成了GridView和adapter的创建，接下来我们需要将图片添加到GridView中。为了添加图片，我们可以创建一个按钮，并且在按钮点击后打开文件选择器，并选取需要添加的图片。具体实现可以参考以下示例：

private List<String> mImages = new ArrayList<>();
private GridImageAdapter mAdapter;

// 创建添加按钮，并且设置点击事件
findViewById(R.id.btn_add).setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
        intent.setType("image/*");
        startActivityForResult(intent, 1);
    }
});

// 在 onActivityResult 方法中处理选取的图片，将图片添加到集合中，并刷新 GridView
@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    if (resultCode == RESULT_OK) {
        String path = getPath(this, data.getData());
        mImages.add(path);
        mAdapter.notifyDataSetChanged();
    }
}

// 获取文件的路径
public static String getPath(Context context, Uri uri) {
    String[] projection = { MediaStore.Images.Media.DATA };
    Cursor cursor = context.getContentResolver().query(uri, projection, null, null, null);
    int column_index = cursor.getColumnIndexOrThrow(MediaStore.Images.Media.DATA);
    cursor.moveToFirst();
    String filePath = cursor.getString(column_index);
    cursor.close();
    return filePath;
}

这里我使用了一个名为“btn_add”的按钮，当我们点击该按钮时，将会打开文件选择器，允许我们选择要添加的本地图片。然后在onActivityResult方法中，根据返回的Intent对象获取选择的文件路径，并将路径添加到mImages集合中，再刷新GridView即可。如此一来，我们已经实现了添加本地图片的功能。

4. 查看大图和删除图片

接下来，我们需要为GridView添加上 “查看大图” 和 “删除图片” 的功能。

查看大图

我们可以在adapter中，为每一个图片添加点击事件，并且在点击事件中跳转到显示大图的页面。具体实现可以参考以下代码：

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    ……
    imageView.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            Intent intent = new Intent(mContext, ImageActivity.class);
            intent.putExtra("imagePath", mImages.get(position));
            mContext.startActivity(intent);
        }
    });
    return imageView;
}

这里我创建了一个新的类名为ImageActivity，并将需要显示的图片路径通过Intent对象传递给ImageActivity。在ImageActivity中，我们可以将图片绘制到ImageView中，具体实现可以参考以下代码：

public class ImageActivity extends AppCompatActivity {
    private ImageView mImage;

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

        mImage = findViewById(R.id.image);

        String imagePath = getIntent().getStringExtra("imagePath");

        Glide.with(this).load(imagePath).into(mImage);
    }
}

删除图片

我们可以在adapter中，为每一个图片添加长按事件，并且在长按事件中弹出对话框，询问用户是否删除该图片。具体实现可以参考以下代码：

@Override
public View getView(int position, View convertView, ViewGroup parent) {
    ……
    imageView.setOnLongClickListener(new View.OnLongClickListener() {
        @Override
        public boolean onLongClick(View v) {
            AlertDialog.Builder builder = new AlertDialog.Builder(mContext);
            builder.setTitle("确认删除?");
            builder.setPositiveButton("是", new DialogInterface.OnClickListener() {
                @Override
                public void onClick(DialogInterface dialog, int which) {
                    mImages.remove(position);
                    mAdapter.notifyDataSetChanged();
                }
            });
            builder.setNegativeButton("否", null);
            builder.show();
            return true;
        }
    });
    return imageView;
}

这里我为ImageView添加了一个长按事件，并弹出对话框，询问用户是否删除该图片。在用户点击了“是”，并确定删除该图片后，我们可以通过mImages.remove(position)方法将该图片从数据源中删除，然后再调用mAdapter.notifyDataSetChanged()方法来刷新GridView即可。

至此，我们已经实现了“查看大图”和“删除图片”的功能，完成了我们的需求。