使用ViewPager和RecyclerView实现微信表情包分页显示

在最近的一个项目中需要实现一个聊天发送表情的功能，表情包的显示要像微信那样显示（即分页显示），现在

对其实现功能做一个简单的实现，功能如下：

核心代码类在下面

 /**
     * 下方的表情
     */
    abstract class GroupChattingEmojiUIWrapper {

        protected Activity parentActivity = null;
        /**
         * 主Activity的layout预留给本布局的父布局
         */
        protected FrameLayout layoutbottomContentOfParent = null;

        private List<EmojiEntity> emojiEntityList = new ArrayList<>();

        private AutoScrollViewPager image_banner;
        private CirclePageIndicator image_banner_indicator;
        private int position;

        /**
         * recyclerView 布局对象
         */
        private RecyclerView emojiRecyclerView = null;


        public GroupChattingEmojiUIWrapper(final Activity context
                , final FrameLayout layoutbottomContent) {
            this.parentActivity = context;
            this.layoutbottomContentOfParent = layoutbottomContent;
            position = 0;
            //初始化表情列表的全部表情
            EmojiUtil.initEmojis(emojiEntityList);

            //初始化ViewPager和指示器
            image_banner = findViewById(R.id.image_banner);
            image_banner_indicator = findViewById(R.id.image_banner_indicator);
            setDataEmojiList(emojiEntityList);


//            this.emojiRecyclerView = new RecyclerView(context);

//            StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(8, StaggeredGridLayoutManager.VERTICAL);
//            emojiRecyclerView.setLayoutManager(layoutManager);
//            GroupChattingEmojiUIWrapper.EmojiAdapter emojiAdapter = new GroupChattingEmojiUIWrapper.EmojiAdapter(emojiEntityList);
//            emojiRecyclerView.setAdapter(emojiAdapter);

            // 将更多功能的gridview加入到输入框下方的更多功能父布局中
//            this.layoutbottomContentOfParent.addView(this.emojiRecyclerView, new FrameLayout.LayoutParams(
//                    FrameLayout.LayoutParams.MATCH_PARENT, FrameLayout.LayoutParams.MATCH_PARENT));
        }

        public void setDataEmojiList(List<EmojiEntity> emojiEntityList) {
            //图片显示ViewPager的适配器
            ViewPagerEmojiAdapter viewPagerEmojiAdapter = new ViewPagerEmojiAdapter(emojiEntityList);
            image_banner.setCycle(false);
            image_banner.setSlideBorderMode(AutoScrollViewPager.SLIDE_BORDER_MODE_NONE);
            image_banner.setAdapter(viewPagerEmojiAdapter);
            image_banner_indicator.setViewPager(image_banner, position);
        }

        public void auto() {
            if (this.isShowing()) {
                this.hide();
            } else {
                this.show();
            }
        }

        public void show() {
            this.layoutbottomContentOfParent.setVisibility(View.VISIBLE);
        }

        public void hide() {
            this.layoutbottomContentOfParent.setVisibility(View.GONE);
        }

        public boolean isShowing() {
            return (this.layoutbottomContentOfParent.getVisibility() == View.VISIBLE);
        }


        /**
         * ViewPagerAdapter
         */
        private class ViewPagerEmojiAdapter extends PagerAdapter {

            private List<EmojiEntity> emojiEntityList;
            private RecyclerView emojiRecyclerView;

            public ViewPagerEmojiAdapter(List<EmojiEntity> imageList) {
                this.emojiEntityList = imageList;
            }

            @Override
            public int getCount() {
                int imageListPagecount = ((emojiEntityList.size()) / 24) + 1;
//                return imageList == null ? 0 : imageList.size();
                return imageListPagecount;
            }

            @Override
            public boolean isViewFromObject(View view, Object object) {
                return view == object;
            }

            @Override
            public Object instantiateItem(ViewGroup container, int position) {
                View view = LayoutInflater.from(ChatActivity.this).inflate(R.layout.emoji_view_pager_item, null);
//                PhotoView image = view.findViewById(R.id.img);
//                Glide.with(ChatActivity.this)
//                        .load(imageList.get(position))
//                        .apply(new RequestOptions().dontAnimate()
//                                .skipMemoryCache(false)).into(image);
                List<EmojiEntity> emojiEntityListItem = new ArrayList<>();
                if (position == 0) {
                    EmojiUtil.initEmojiPagerOne(emojiEntityListItem);
                } else if (position == 1) {
                    EmojiUtil.initEmojiPagerTwo(emojiEntityListItem);
                } else if (position == 2) {
                    EmojiUtil.initEmojiPagerThree(emojiEntityListItem);
                } else if (position == 3) {
                    EmojiUtil.initEmojiPagerFour(emojiEntityListItem);
                }
                emojiRecyclerView = view.findViewById(R.id.emoji_item_recycler);
                StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(8, StaggeredGridLayoutManager.VERTICAL);
                emojiRecyclerView.setLayoutManager(layoutManager);
                GroupChattingEmojiUIWrapper.EmojiAdapter emojiAdapter = new GroupChattingEmojiUIWrapper.EmojiAdapter(emojiEntityListItem);
                emojiRecyclerView.setAdapter(emojiAdapter);
                container.addView(view);
                return view;
            }

            @Override
            public void destroyItem(ViewGroup container, int position, Object object) {
                container.removeView((View) object);
            }
        }


        class EmojiAdapter extends RecyclerView.Adapter<EmojiAdapter.ViewHolder> {

            private List<EmojiEntity> mEmojiEntity;

            class ViewHolder extends RecyclerView.ViewHolder {
                ImageView emojiIV;

                public ViewHolder(View view) {
                    super(view);
                    emojiIV = view.findViewById(R.id.chatting_plus_functions_gridview_item_imageView);
                }
            }

            public EmojiAdapter(List<EmojiEntity> emojiEntities) {
                mEmojiEntity = emojiEntities;
            }

            @Override
            public EmojiAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
                View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.chatting_plus_emoji_gridview_item, parent, false);
                EmojiAdapter.ViewHolder holder = new GroupChattingEmojiUIWrapper.EmojiAdapter.ViewHolder(view);
                return holder;
            }

            @Override
            public void onBindViewHolder(EmojiAdapter.ViewHolder holder, final int position) {
                final EmojiEntity emojiEntity = mEmojiEntity.get(position);
                holder.emojiIV.setImageResource(emojiEntity.getEmojiID());
                holder.emojiIV.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        //txtMsg.getText().append("hhh");
                        try {
                            //获取表情图片文件名
                            int resourceId = emojiEntity.getEmojiID();
                            // 在android中要显示图片信息，必须使用Bitmap位图的对象来装载
                            Bitmap bitmap = BitmapFactory.decodeResource(getResources(), resourceId);
                            //要让图片替代指定的文字就要用ImageSpan
                            ImageSpan imageSpan = new ImageSpan(ChatActivity.this, bitmap);
                            SpannableStringBuilder spannableStringBuilder = new SpannableStringBuilder(emojiEntity.getName());//图片的前缀名
                            spannableStringBuilder.setSpan(imageSpan, 0, 4, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
                            //在此地方做一个判断，如果光标是在最后就直接append添加到最后就可以了
                            if (txtMsg.getSelectionStart() == txtMsg.getText().length()) {
                                txtMsg.append(spannableStringBuilder);
                            } else {
                                //如果光标在中间就把这个富文本添加到字体行间，从而解决不能在文本中插入表情的问题
                                int index = txtMsg.getSelectionStart();
                                Editable editable = txtMsg.getText();
                                editable.insert(index, spannableStringBuilder);
                            }
                        } catch (Exception e) {
                            e.printStackTrace();
                        }
                    }
                });
            }

            @Override
            public int getItemCount() {
                return mEmojiEntity.size();
            }

        }
    }