zoukankan      html  css  js  c++  java
  • Android 仿微信朋友圈添加图片

    github地址(欢迎下载Demo)

     

    https://github.com/zhouxu88/WXCircleAddPic

    老习惯,先上图,着急用的朋友,直接带走Demo,先拿来用吧,毕竟老板催的紧,先把工作完成了,再看也来得及,是吧!

    仿微信添加图片.gif
    1、首先这是用GridView实现的
    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#fff"
        android:orientation="vertical">
        
    
        <!--展示上传的图片-->
        <GridView
            android:id="@+id/gridView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="15dp"
            android:columnWidth="60dp"
            android:horizontalSpacing="10dp"
            android:numColumns="auto_fit"
            android:verticalSpacing="10dp" />
        
    </LinearLayout>

    Adapter

    package com.dearxy.wxcircleaddpic;
    
    import android.content.Context;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.ImageView;
    
    import com.bumptech.glide.Glide;
    
    import java.util.List;
    
    
    /**
     * 展示上传的图片的GridView的适配器
     * <p>
     * 作者: 周旭 on 2017/6/21/0021.
     * 邮箱:374952705@qq.com
     * 博客:http://www.jianshu.com/u/56db5d78044d
     */
    
    public class GridViewAdapter extends android.widget.BaseAdapter {
        
        private Context mContext;
        private List<String> mList;
        private LayoutInflater inflater;
    
        public GridViewAdapter(Context mContext, List<String> mList) {
            this.mContext = mContext;
            this.mList = mList;
            inflater = LayoutInflater.from(mContext);
        }
    
        @Override
        public int getCount() {
            //return mList.size() + 1;//因为最后多了一个添加图片的ImageView 
            int count = mList == null ? 1 : mList.size() + 1;
            if (count > MainConstant.MAX_SELECT_PIC_NUM) {
                return mList.size();
            } else {
                return count;
            }
        }
    
        @Override
        public Object getItem(int position) {
            return mList.get(position);
        }
    
        @Override
        public long getItemId(int position) {
            return position;
        }
    
        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            convertView = inflater.inflate(R.layout.grid_item, parent,false);
            ImageView iv = (ImageView) convertView.findViewById(R.id.pic_iv);
            if (position < mList.size()) {
             //代表+号之前的需要正常显示图片
                String picUrl = mList.get(position); //图片路径
                Glide.with(mContext).load(picUrl).into(iv);
            } else {
                iv.setImageResource(R.mipmap.zj);//最后一个显示加号图片  
            }
            return convertView;
        }
    }  
    MainActivity
    /**
     * 仿微信朋友圈添加图片的效果
     */
    public class MainActivity extends AppCompatActivity {
    
        private static final String TAG = "MainActivity";
        private Context mContext;
        private GridView gridView;
        private ArrayList<String> mPicList = new ArrayList<>(); //上传的图片凭证的数据源
        private GridViewAdapter mGridViewAddImgAdapter; //展示上传的图片的适配器
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            mContext = this;
            gridView = (GridView) findViewById(R.id.gridView);
            initGridView();
        }
    
        //初始化展示上传图片的GridView
        private void initGridView() {
            mGridViewAddImgAdapter = new GridViewAdapter(mContext, mPicList);
            gridView.setAdapter(mGridViewAddImgAdapter);
            gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
                @Override
                public void onItemClick(AdapterView<?> parent, View view,
                                        int position, long id) {
                    if (position == parent.getChildCount() - 1) {
                        //如果“增加按钮形状的”图片的位置是最后一张,且添加了的图片的数量不超过5张,才能点击
                        if (mPicList.size() == MainConstant.MAX_SELECT_PIC_NUM) {
                            //最多添加5张图片
                            viewPluImg(position);
                        } else {
                            //添加凭证图片
                            selectPic(MainConstant.MAX_SELECT_PIC_NUM - mPicList.size());
                        }
                    } else {
                        viewPluImg(position);
                    }
                }
            });
        }
    
        //查看大图
        private void viewPluImg(int position) {
            Intent intent = new Intent(mContext, PlusImageActivity.class);
            intent.putStringArrayListExtra(MainConstant.IMG_LIST, mPicList);
            intent.putExtra(MainConstant.POSITION, position);
            startActivityForResult(intent, MainConstant.REQUEST_CODE_MAIN);
        }
    
        /**
         * 打开相册或者照相机选择凭证图片,最多5张
         *
         * @param maxTotal 最多选择的图片的数量
         */
        private void selectPic(int maxTotal) {
            PictureSelectorConfig.initMultiConfig(this, maxTotal);
        }
    
        // 处理选择的照片的地址
        private void refreshAdapter(List<LocalMedia> picList) {
            for (LocalMedia localMedia : picList) {
                //被压缩后的图片路径
                if (localMedia.isCompressed()) {
                    String compressPath = localMedia.getCompressPath(); //压缩后的图片路径
                    mPicList.add(compressPath); //把图片添加到将要上传的图片数组中
                    mGridViewAddImgAdapter.notifyDataSetChanged();
                }
            }
        }
    
        @Override
        protected void onActivityResult(int requestCode, int resultCode, Intent data) {
            super.onActivityResult(requestCode, resultCode, data);
            if (resultCode == RESULT_OK) {
                switch (requestCode) {
                    case PictureConfig.CHOOSE_REQUEST:
                        // 图片选择结果回调
                        refreshAdapter(PictureSelector.obtainMultipleResult(data));
                        // 例如 LocalMedia 里面返回三种path
                        // 1.media.getPath(); 为原图path
                        // 2.media.getCutPath();为裁剪后path,需判断media.isCut();是否为true
                        // 3.media.getCompressPath();为压缩后path,需判断media.isCompressed();是否为true
                        // 如果裁剪并压缩了,以取压缩路径为准,因为是先裁剪后压缩的
                        break;
                }
            }
            if (requestCode == MainConstant.REQUEST_CODE_MAIN && resultCode == MainConstant.RESULT_CODE_VIEW_IMG) {
                //查看大图页面删除了图片
                ArrayList<String> toDeletePicList = data.getStringArrayListExtra(MainConstant.IMG_LIST); //要删除的图片的集合
                mPicList.clear();
                mPicList.addAll(toDeletePicList);
                mGridViewAddImgAdapter.notifyDataSetChanged();
            }
        }
    }

    总结:其实原理就是把数据的size+1,做为添加按钮的放置,然后判断下有9张图就不显示添加按钮,并且size也不+1,就这样,一个带添加按钮的GridView就好了~有什么不懂得可以留言。

     

  • 相关阅读:
    Python3-接口自动化-6-unittest模块的各个属性说明
    Python3-接口自动化-5-JSON和字典的区别
    Python3-接口自动化-4-GET和POST请求
    Python3-接口自动化-3-接口自动化项目目录框架
    数据库2
    IO多路复用
    协程--代码注释篇
    协程--理论篇
    线程--代码注释篇
    线程--理论篇
  • 原文地址:https://www.cnblogs.com/zhujiabin/p/9017073.html
Copyright © 2011-2022 走看看