支持输入删除的自定义标签布局

项目需求要用到自定义标签,需要支持如下功能

  • 输入文字,点击回车键自动生成一个标签。
  • 支持多行,支持自动换行,支持自适应。
  • 支持连续选中并删除已添加的标签
    效果图如下:


    gif.gif

这里主要继承了FlexboxLayout布局。
需要注意的有三点: 看代码中的注释

mEditText.setOnEditorActionListener(new TextView.OnEditorActionListener() {
            @Override
            public boolean onEditorAction(TextView v, int actionId, KeyEvent event) {
                String keyWord = mEditText.getText().toString().trim();
                if (actionId == EditorInfo.IME_ACTION_UNSPECIFIED || (event != null && event.getKeyCode() == KeyEvent.KEYCODE_ENTER)) {
                    if (TextUtils.isEmpty(keyWord)) {
                        return true;
                    }
                    //因为在点击键盘按键的时候按下和抬起都会调用一次onEditorAction, 所以要区分一下,保证只在某一次执行时触发我们的代码
                    switch (event.getAction()) {
                        case KeyEvent.ACTION_UP:
                            createNewLabel(keyWord);
                            mEditText.setText("");
                            break;
                    }

                }
                return true;
            }
        });
//监听删除按键
        mEditText.setOnKeyListener(new View.OnKeyListener() {
            @Override
            public boolean onKey(View v, int keyCode, KeyEvent event) {
                if (keyCode == KeyEvent.KEYCODE_DEL) {
                    switch (event.getAction()) {
                        //一定要用action_down,用action_up会有问题。在删除输入框中最后一个字的时候会导致最后一个标签自动被选中,
                        case KeyEvent.ACTION_DOWN:
                            String keyWord = mEditText.getText().toString().trim();
                            if (TextUtils.isEmpty(keyWord)) {
                                int childCount = getChildCount();
                                if (childCount >= 2) {
                                    View view = getChildAt(childCount - 2);
                                    if (!view.isSelected()) {
                                        mLabelDrawble.setBounds(new Rect(0, 0, view.getWidth(), view.getHeight()));
                                        view.setSelected(true);
                                    } else {
                                        lableTxtList.remove(indexOfChild(view));
                                        removeView(view);
                                    }
                                }
                                return true;
                            } else {
                                return false;
                            }
                    }
                }
                return false;
            }
        });
        //这里复制新建一个Drawable对象,否则mLabelDrawble的状态会是最后一个标签的状态,这样在软键盘弹出等触发ui重绘的情况下,会导致背景错乱。
        //所以要保证每一个标签都拥有独立的Drawable
        Drawable bg = getNewDrawable(mLabelDrawble);

/**
     * drawable 复制
     *
     * @param drawable
     * @return
     */
    public  Drawable getNewDrawable(Drawable drawable) {
        return drawable.getConstantState().newDrawable();
    }

源代码

你可能感兴趣的:(支持输入删除的自定义标签布局)