Skip to content

Giftedcat/DynamicPublishing

Folders and files

NameName
Last commit message
Last commit date

Latest commit

cbcd8cf · Sep 21, 2020

History

8 Commits
Sep 21, 2020
Sep 21, 2020
Mar 26, 2020
Jun 25, 2020
Mar 26, 2020
Jun 25, 2020
Sep 21, 2020
Mar 26, 2020
Mar 26, 2020
Mar 26, 2020
Jun 25, 2020

Repository files navigation

Android仿微信朋友圈发布动态功能

导入

implementation 'com.github.Giftedcat:DynamicPublishing:1.0.0'

使用

(一)初始化

helpr = PictureUseHelpr.init(this).
                setMaxNum(9).
                origin(mSelect).
                bindRecyclerView(rvImages, R.id.iv_thum);

(二)选择图片

helpr.pickImage(REQUEST_IMAGE);

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        if (requestCode == REQUEST_IMAGE) {
            if (resultCode == RESULT_OK) {
                List<String> select = data.getStringArrayListExtra(MultiImageSelector.EXTRA_RESULT);
                mSelect.clear();
                mSelect.addAll(select);
                adapter.notifyDataSetChanged();
            }
        }
    }

(三)显示大图

helpr.show(position);

一、前言

应工作上的要求,需要有一个类似于微信朋友圈发动态上传图片的功能,想起曾经已经做过了,但奈何不忍看自己以前写的代码的惨状,觉得重新封装一个使用方便,易于维护的类似功能的类,自己之后用起来也顺手,当然也方便一下大家,这样可以加快我们工作的效率,让我们有更多的时间学习(划水)。

image

功能上的话,目前有添加图片、查看大图、删除图片

二、效果图

先贴一下效果图吧

image

三、实现功能

库有用到butterknife和显示图片的glide 适配器用的rvadapter,加一个删除功能的气泡弹窗 引入一下相关依赖:

    api 'com.jakewharton:butterknife:10.2.1'
    annotationProcessor 'com.jakewharton:butterknife-compiler:10.2.1'

    implementation 'com.github.bumptech.glide:glide:4.5.0'
    annotationProcessor 'com.github.bumptech.glide:compiler:4.5.0'

    //气泡弹窗
    implementation 'me.kareluo.ui:popmenu:1.1.0'
    implementation 'com.zhy:base-rvadapter:3.0.3'

####(一)布局文件 主页面上的话,只有一个RecyclerView,他的LayoutManager设为GridLayoutManager,一行为3个

<?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"
    tools:context=".MainActivity">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/rv_images"
        android:paddingTop="15dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</LinearLayout>

子布局的话,有两个ImageView,一个是普通的图片,另外一个固定为那个添加的按钮

<?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="90dp"
    android:gravity="center"
    android:layout_marginBottom="10dp"
    android:layout_marginTop="10dp"
    android:orientation="horizontal">

    <ImageView
        android:id="@+id/iv_thum"
        android:visibility="gone"
        android:scaleType="centerCrop"
        android:layout_width="90dp"
        android:layout_height="match_parent" />

    <ImageView
        android:visibility="gone"
        android:id="@+id/iv_add"
        android:src="@mipmap/add_icon"
        android:scaleType="centerCrop"
        android:layout_width="90dp"
        android:layout_height="match_parent" />

</LinearLayout>

(二)Activity代码

先来看一下如何在我们的页面里使用我已经写好的这个adapter

首先初始化一下控件和adapter,给adapter设置一个点击添加图片的监听

    private void initView() {
        rvImages.setLayoutManager(new GridLayoutManager(this, 3));
        adapter = new NineGridAdapter(MainActivity.this, mSelectList, rvImages);
        adapter.setMaxSize(maxNum);
        rvImages.setAdapter(adapter);
        adapter.setOnAddPicturesListener(new OnAddPicturesListener() {
            @Override
            public void onAdd() {
                pickImage();
            }
        });
    }

选择图片页面的启动

    private void pickImage() {
        MultiImageSelector selector = MultiImageSelector.create(context);
        selector.showCamera(true);
        selector.count(maxNum);
        selector.multi();
        selector.origin(mSelectList);
        selector.start(instans, REQUEST_IMAGE);
    }

拿到选择图片页面的返回数据,添加至List中

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        if (requestCode == REQUEST_IMAGE) {
            if (resultCode == RESULT_OK) {
                List<String> select = data.getStringArrayListExtra(MultiImageSelector.EXTRA_RESULT);
                mSelectList.clear();
                mSelectList.addAll(select);
                adapter.notifyDataSetChanged();
            }
        }
    }

(三)适配器代码

首先在构造函数中,往list里添加一个空串,为添加按钮占位。之后初始化一下删除气泡按钮跟大图显示的控件

    public NineGridAdapter(Context context, List<String> selectPath, RecyclerView rvImages) {
        super(context, R.layout.item_img, selectPath);
        this.context = context;

        selectPath.add("");
        initDeleteMenu();
        initTransfer(rvImages);
    }

两个控件初始化的代码

    /**
     * 初始化大图查看控件
     */
    private void initTransfer(RecyclerView rvImages) {
        transferee = Transferee.getDefault(context);
        config = TransferConfig.build()
                .setSourceImageList(getDatas())
                .setProgressIndicator(new ProgressBarIndicator())
                .setIndexIndicator(new NumberIndexIndicator())
                .setImageLoader(GlideImageLoader.with(context.getApplicationContext()))
                .setJustLoadHitImage(true)
                .bindRecyclerView(rvImages, R.id.iv_thum);
    }

    /**
     * 初始化图片删除小弹窗
     */
    private void initDeleteMenu() {
        menuView = new PopupMenuView(context, R.menu.menu_pop, new MenuBuilder(context));
        menuView.setSites(PopupView.SITE_TOP);
        menuView.setOnMenuClickListener(new OptionMenuView.OnOptionMenuClickListener() {
            @Override
            public boolean onOptionMenuClick(int position, OptionMenu menu) {
                getDatas().remove(deletePosition);
                if (!getDatas().get(getDatas().size() - 1).equals("")) {
                    //列表最后一张不是添加按钮时,加入添加按钮
                    getDatas().add("");
                }
                notifyDataSetChanged();
                return true;
            }
        });
    }

在item填充的函数中完成图片的显示,点击和长按的监听

    @Override
    protected void convert(ViewHolder viewHolder, String item, final int position) {
        ImageView ivThum = viewHolder.getView(R.id.iv_thum);
        ImageView ivAdd = viewHolder.getView(R.id.iv_add);
        if (item.equals("")) {
            //item为添加按钮
            ivThum.setVisibility(View.GONE);
            ivAdd.setVisibility(View.VISIBLE);
        } else {
            //item为普通图片
            ivThum.setVisibility(View.VISIBLE);
            ivAdd.setVisibility(View.GONE);
        }
        Glide.with(mContext).load(item).into(ivThum);
        ivThum.setOnClickListener(new PicturesClickListener(position));
        ivAdd.setOnClickListener(new PicturesClickListener(position));

        ivThum.setOnLongClickListener(new View.OnLongClickListener() {
            @Override
            public boolean onLongClick(View view) {
                deletePosition = position;
                //最上面的三个删除按钮是往下的  其他的都是往上的
                if (position < 3) {
                    menuView.setSites(PopupView.SITE_BOTTOM);
                } else {
                    menuView.setSites(PopupView.SITE_TOP);
                }
                menuView.show(view);
                return false;
            }
        });
    }

点击事件代码

    private class PicturesClickListener implements View.OnClickListener {

        int position;

        public PicturesClickListener(int position) {
            this.position = position;
        }

        @Override
        public void onClick(View view) {
            switch (view.getId()) {
                case R.id.iv_thum:
                    //点击图片
                    config.setNowThumbnailIndex(position);
                    config.setSourceImageList(getDatas());
                    transferee.apply(config).show();
                    break;
                case R.id.iv_add:
                    //点击添加按钮
                    if (listener != null)
                        listener.onAdd();
                    break;
            }
        }
    }

四、关于老v7项目的问题

前段时间也是刚把自己的项目从v7手动改为androidx的,忙活了半天,后来发现android studio有一键将v7项目改为新的androidx的项目,算是给自己记个笔记 78M(FMFGHPU%CF1GDL_POBM.png

About

Android仿微信朋友圈发布动态功能

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages