android开发分享Android仿微信标签功能

微信中有对联系人添加标签的功能,如下图所示。 这里有三种状态的标签,分别的未选择,选中,编辑中,由于前两种标签不需要提供输入,所以用textview实现即可,编辑中的

微信中有对联系人添加标签的功能,如下图所示。

Android仿微信标签功能

这里有三种状态的标签,分别的未选择,选中,编辑中,由于前两种标签不需要提供输入,所以用textview实现即可,编辑中的标签用edittext来实现。而标签的形状就用shape来实现。

在drawable下新建xml文件,这里先上shape的xml文件。

tag_normal.xml

  <?xml version="1.0" encoding="utf-8"?>  <shape xmlns:android="https://schemas.android.com/apk/res/android"    android:shape="rectangle" >       <corners      android:bottomleftradius="10dp"      android:bottomrightradius="10dp"      android:topleftradius="10dp"      android:toprightradius="10dp" />      <stroke android:width="1dp" android:color="#66cdaa" />       <padding      android:bottom="4dp"      android:left="8dp"      android:right="8dp"      android:top="4dp" />     </shape>

tag_selected.xml

  <?xml version="1.0" encoding="utf-8"?>  <shape xmlns:android="https://schemas.android.com/apk/res/android"    android:shape="rectangle" >       <corners      android:bottomleftradius="10dp"      android:bottomrightradius="10dp"      android:topleftradius="10dp"      android:toprightradius="10dp" />      <stroke android:width="1dp" android:color="#66cdaa" />       <padding      android:bottom="4dp"      android:left="8dp"      android:right="8dp"      android:top="4dp" />     </shape>

tag_edit.xml

  <?xml version="1.0" encoding="utf-8"?>  <shape xmlns:android="https://schemas.android.com/apk/res/android"    android:shape="rectangle" >       <corners      android:bottomleftradius="10dp"      android:bottomrightradius="10dp"      android:topleftradius="10dp"      android:toprightradius="10dp" />    <!-- 这里实现虚线边框-->   <stroke android:dashwidth="5dp" android:dashgap="2dp" android:width="1dp" android:color="#e0e0e0" />       <padding      android:bottom="4dp"      android:left="8dp"      android:right="8dp"      android:top="4dp" />  </shape>

接着在在布局文件中新建一个linearlayout用以存放标签(如果要实现多行标签自适应添加,用自定义的flowlayout,代码网上很多。)

activity_main.xml

  <?xml version="1.0" encoding="utf-8"?>  <linearlayout xmlns:android="https://schemas.android.com/apk/res/android"    xmlns:tools="https://schemas.android.com/tools"    android:id="@+id/tag_container"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="horizontal"    tools:context="com.qtree.tagdemo.mainactivity">     </linearlayout>

      根据对微信标签的分析,这里可以这样实现,创建一个edittext,对其软键盘的enter和delete按键进行监听,当输入完成后按下enter则生成一个标签,添加到linearlayout中。然后如果当标签内文字为空时,按下删除键,就将它前一个标签的状态修改为选中状态。同样地,当点击未选择的标签也可以选中该标签进行删除。

详细实现如下

  package com.qtree.tagdemo;     import android.graphics.color;  import android.support.v7.app.appcompatactivity;  import android.os.bundle;  import android.text.editable;  import android.text.textwatcher;  import android.util.log;  import android.view.keyevent;  import android.view.view;  import android.view.viewgroup;  import android.widget.edittext;  import android.widget.linearlayout;  import android.widget.textview;  import java.util.arraylist;  import java.util.list;     public class mainactivity extends appcompatactivity {       private linearlayout layout;    private linearlayout.layoutparams params;       @override    protected void oncreate(bundle savedinstancestate) {      super.oncreate(savedinstancestate);      setcontentview(r.layout.activity_main);         layout=(linearlayout)findviewbyid(r.id.tag_container);         params=new linearlayout.layoutparams(viewgroup.layoutparams.wrap_content, viewgroup.layoutparams.wrap_content);      params.setmargins(30,30,0,0);         //存放标签和标签选择状态      final list<textview> tagview=new arraylist<>();      final list<boolean> tagviewstate=new arraylist<>();         //创建编辑中的标签      final edittext edittext=new edittext(getapplicationcontext());      edittext.sethint("添加标签");      //设置固定宽度      edittext.setminems(4);      edittext.settextsize(12);      //设置shape      edittext.setbackgroundresource(r.drawable.tag_edit);      edittext.sethinttextcolor(color.parsecolor("#b4b4b4"));      edittext.settextcolor(color.parsecolor("#000000"));      edittext.setlayoutparams(params);            //添加到layout中      layout.addview(edittext);         //对软键盘的enter和del键监听      edittext.setonkeylistener(new view.onkeylistener() {        @override        public boolean onkey(view v, int keycode, keyevent event) {             if (keyevent.action_down == event.getaction()) {            switch (keycode) {              case keyevent.keycode_enter:                string edittextcontent = edittext.gettext().tostring();                //判断输入是否为空                if (edittextcontent.equals(""))                  return true;                //判断标签是否重复添加                for(textview tag:tagview){                  string tempstr=tag.gettext().tostring();                  if(tempstr.equals(edittextcontent)) {                    log.e("tag","重复添加");                    edittext.settext("");                    edittext.requestfocus();                    return true;                  }                }                //添加标签                final textview temp = gettag(edittext.gettext().tostring());                tagview.add(temp);                tagviewstate.add(false);                //添加点击事件,点击变成选中状态,选中状态下被点击则删除                temp.setonclicklistener(new view.onclicklistener() {                  @override                  public void onclick(view v) {                    int curindex = tagview.indexof(temp);                    if (!tagviewstate.get(curindex)) {                      //显示 ×号删除                      temp.settext(temp.gettext() + " ×");                      temp.setbackgroundresource(r.drawable.tag_selected);                      temp.settextcolor(color.parsecolor("#ffffff"));                      //修改选中状态                      tagviewstate.set(curindex, true);                    } else {                      layout.removeview(temp);                      tagview.remove(curindex);                      tagviewstate.remove(curindex);                    }                  }                });                layout.addview(temp);                //让编辑框在最后一个位置上                edittext.bringtofront();                //清空编辑框                edittext.settext("");                edittext.requestfocus();                return true;              case keyevent.keycode_del:                int lastindex = tagview.size() - 1;                //没有添加标签则不继续执行                if (lastindex < 0)                  return false;                //获取前一个标签                textview prevtag = tagview.get(lastindex);                //第一次按下del键则变成选中状态,选中状态下按del键则删除                if (tagviewstate.get(lastindex)) {                  tagview.remove(prevtag);                  tagviewstate.remove(lastindex);                  layout.removeview(prevtag);                } else {                  string te = edittext.gettext().tostring();                  if (te.equals("")) {                    prevtag.settext(prevtag.gettext() + " ×");                    prevtag.setbackgroundresource(r.drawable.tag_selected);                    prevtag.settextcolor(color.parsecolor("#ffffff"));                    tagviewstate.set(lastindex, true);                  }                }                break;            }             }          return false;        }         });         //监听编辑标签的输入事件      edittext.addtextchangedlistener(new textwatcher() {        @override        public void beforetextchanged(charsequence s, int start, int count, int after) {           }           @override        public void ontextchanged(charsequence s, int start, int before, int count) {          //输入文字时取消已经选中的标签          for (int i = 0; i < tagviewstate.size(); i++) {            if (tagviewstate.get(i)) {              textview tmp = tagview.get(i);              tmp.settext(tmp.gettext().tostring().replace(" ×", ""));              tagviewstate.set(i, false);              tmp.setbackgroundresource(r.drawable.tag_normal);              tmp.settextcolor(color.parsecolor("#66cdaa"));            }          }        }           @override        public void aftertextchanged(editable s) {           }      });       }       /**     * 创建一个正常状态的标签     * @param tag     * @return     */    private textview gettag(string tag){      textview textview=new textview(getapplicationcontext());      textview.settextsize(12);      textview.setbackgroundresource(r.drawable.tag_normal);      textview.settextcolor(color.parsecolor("#66cdaa"));      textview.settext(tag);      textview.setlayoutparams(params);      return textview;    }     }

Android仿微信标签功能

效果挺好。

以上就是android开发分享Android仿微信标签功能的全部内容,希望对大家的学习有所帮助,也希望大家多多支持<计算机技术网(www.ctvol.com)!!>。

本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

ctvol管理联系方式QQ:251552304

本文章地址:https://www.ctvol.com/addevelopment/901669.html

(0)
上一篇 2021年10月24日
下一篇 2021年10月24日

精彩推荐