Android中使用TagFlowLayout制作动态添加删除标签

效果图

简单的效果图(使用开源库)[FlowLayout](“ https://github.com/hongyangAndroid/FlowLayout “)

步骤

导包

compile 'com.zhy:flowlayout-lib:1.0.3'
<com.zhy.view.flowlayout.TagFlowLayout
  android:id="@+id/id_flowlayout"
  zhy:max_select="-1"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:padding="20dp">
</com.zhy.view.flowlayout.TagFlowLayout>

初始化数据

private String[] mVals = new String[]
    {"Hello", "Android", "Weclome Hi ", "Button", "TextView", "Hello",
        "Android", "Weclome", "Button ImageView", "TextView", "Helloworld" };
 arrTab = new ArrayList();
  //添加一条数据用于添加标签的替换
  arrTab.add("tab");

设置TagFlowLayout的adapter

//设置adapter
  adapter = new TagAdapter<String>(arrTab){
    @Override
    public View getView(FlowLayout parent, final int position, String s) {
      System.out.println(position + "---" + (arrTab.size() - 1));
      if (position == arrTab.size() - 1){
        //设置最后一个添加标签的布局
        LinearLayout iv = (LinearLayout) LayoutInflater.from(SecondActivity.this).inflate( R.layout.iv,
            mFlowLayout,false);
        //如果点击就添加元素并刷新adapter
        iv.setOnClickListener(new View.OnClickListener() {
          @Override
          public void onClick(View v) {
            int i = arrTab.size() - 1;
            //将新加入的数据加到集合的最后一个位置,而原来的添加图标会到 +1 的位置
            arrTab.add(i , mVals[position]);
            adapter.notifyDataChanged();
          }
        });
        return iv ;
      }else{
      //正常标签的布局
        RelativeLayout tv = (RelativeLayout) LayoutInflater.from(SecondActivity.this).inflate( R.layout.tv,
            mFlowLayout,false);
        TextView viewById = (TextView) tv.findViewById(R.id.tv_name);
        viewById.setText(s);
        ImageView imageView = (ImageView) tv.findViewById(R.id.iv_delete);
        imageView.setOnClickListener(new View.OnClickListener() {
          @Override
          public void onClick(View v) {
            arrTab.remove(position);
            System.out.println("我点击的是" + position);
            adapter.notifyDataChanged();
          }
        });
        return tv;
      }
    }
  };
  mFlowLayout.setAdapter(adapter);

各种布局文件

iv
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="88dp"
android:paddingTop="5dp"
android:layout_height="40dp">
<ImageView
  android:layout_gravity="center"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:background="@drawable/bacs_btn_addbq"
  />
  </LinearLayout>
tv
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="88dp"
android:layout_height="wrap_content">
<!--android:background="@drawable/tag_bg"-->
<TextView
  android:id="@+id/tv_name"
  android:layout_marginTop="7dp"
   android:layout_width="80dp"
  android:gravity="center"
   android:layout_height="32dp"
  android:background="@drawable/bg_tv"
   android:text="我是唯爱"
  android:textSize="13sp"
   android:textColor="#FFF">
</TextView>
<ImageView
  android:id="@+id/iv_delete"
  android:layout_alignParentRight="true"
  android:layout_width="15dp"
  android:layout_height="15dp"
  android:src="@drawable/sm_ico_sounddel"
  />
</RelativeLayout>

以上所述是小编给大家介绍的Android中使用TagFlowLayout制作动态添加删除标签,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

时间: 2017-07-19

Android TextView显示Html类解析的网页和图片及自定义标签用法示例

本文实例讲述了Android TextView显示Html类解析的网页和图片及自定义标签.分享给大家供大家参考,具体如下: Android系统显示HTML网页的最佳控件为WebView,有时候为了满足特定需求,需要在TextView中显示HTML网页.图片及解析自定义标签. 1.TextView显示Html类解析的网页 CharSequence richText = Html.fromHtml("<strong>萝卜白菜的博客</strong>--<a href='

Android仿新闻顶部导航标签切换效果

最近由于个人兴趣原因,写了个模仿新闻顶部导航标签的demo.具体看下图. 那么大致上我们会用到这些知识. 1.Fragment 2.FragmentPagerAdapter 3.HorizontalScrollView 4.PopupWindow ok,那么首先进入第一步. 为了实现顶部的标签,我们要用到HorizontalScrollView,因为原有的HorizontalScrollView控件已经不能满足我们的使用了.所以这里就自定义一个HorizontalScrollView impor

Android模仿微信收藏文件的标签处理功能

最近需要用到微信的标签功能(如下图所示).该功能可以添加已有标签,也可以自定义标签.也可以删除已编辑菜单.研究了一番.发现还是挺有意思的,模拟实现相关功能. 该功能使用类似FlowLayout的功能.Flowlayout为一个开源软件(https://github.com/ApmeM/android-flowlayout),功能为自动换行的布局类型 import android.content.Context; import android.util.AttributeSet; import a

Android Navigation TabBar控件实现多彩标签栏

先看看效果图: 源码下载:Android Navigation TabBar控件实现多彩标签栏 代码: MainActivity.java package com.bzu.gxs.meunguide; import android.app.Activity; import android.graphics.Color; import android.support.v4.view.PagerAdapter; import android.support.v4.view.ViewPager; im

Android 仿淘宝商品属性标签页

需求 1.动态加载属性,如尺码,颜色,款式等 由于每件商品的属性是不确定的,有的商品的属性是颜色和尺码,有的是口味,有的是大小,所以这些属性不能直接写死到页面上. 2.动态加载属性下的标签 每个属性下的标签个数也不是一定的,比如有的商品的尺码是是S,M,XL,有的是均码,也就是每种属性的具体的内容是不一定的. 技术点 自定义ViewGroup,使其中的TextView可以依据内容长短自动换行,如下图所示 实现 布局 通过ListView来显示商品所有属性,每种属性作为ListView的Item.

Android自定义控件ViewGroup实现标签云(四)

前言: 前面几篇讲了自定义控件绘制原理Android自定义控件基本原理详解(一) ,Android自定义控件之自定义属性(二) ,Android自定义控件之自定义组合控件(三),常言道:"好记性不如烂笔头,光说不练假把式!!!",作为一名学渣就是因为没有遵循这句名言才沦落于此,所以要谨遵教诲,注重理论与实践相结合,今天通过自定义ViewGroup来实现一下项目中用到的标签云. 需求背景: 公司需要实现一个知识点的标签显示,每个标签的长度未知,如下图所示 基本绘制流程: 绘制原理这里不再

Android自定义控件ViewGroup实现标签云

本文实例为大家分享了Android自定义控件ViewGroup实现标签云的具体代码,供大家参考,具体内容如下 实现的功能: 基本绘制流程: 构造函数获取自定义属性 onMeasure()方法,测量子控件的大小 onLayout()方法,对子控件进行布局 1.自定义属性 <resources> <declare-styleable name="TabsViewGroup"> <attr name="tabVerticalSpace" fo

Android自定义ViewGroup实现标签流容器FlowLayout

本篇文章讲的是Android 自定义ViewGroup之实现标签流式布局-FlowLayout,开发中我们会经常需要实现类似于热门标签等自动换行的流式布局的功能,网上也有很多这样的FlowLayout,但不影响我对其的学习.和往常一样,主要还是想总结一下自定义ViewGroup的开发过程以及一些需要注意的地方. 按照惯例,我们先来看看效果图 一.写代码之前,有几个是问题是我们先要弄清楚的: 1.什么是ViewGroup:从名字上来看,它可以被翻译为控件组,言外之意是ViewGroup内部包含了许

Android自定义ViewGroup实现标签浮动效果

前面在学习鸿洋大神的一些自定义的View文章,看到了自定义ViewGroup实现浮动标签,初步看了下他的思路以及结合自己的思路完成了自己的浮动标签的自定义ViewGroup.目前实现的可以动态添加标签.可点击.效果图如下: 1.思路  首先在onMeasure方法中测量ViewGroup的宽和高,重点是处理当我们自定义的ViewGroup设置为wrap_content的情况下,如何去测量其大小的问题.当我们自定义的ViewGroup设置为wrap_content时,我们需要让子View先去测量自

Android实现3D标签云简单效果

本文实例为大家分享了Android实现3D标签云效果展示的具体代码,供大家参考,具体内容如下 一.关于3D标签云 TagCloudView是一个完全基于Android ViewGroup编写的控件,支持将一组View展示为一个3D标签云,并支持全方向滚动. GitHub中的链接地址 (一)效果 页面上标签的数据可以自己定义,数据页面可以滑动选择. (二)AndroidStudio中使用 1.在build.gradle中添加 compile 'com.moxun:tagcloudlib:1.0.3

android LabelView实现标签云效果

今天我们来做一个android上的标签云效果, 虽然还不是很完美,但是已经足够可以展现标签云的效果了,首先来看看效果吧. 额,录屏只能录到这个份上了,凑活着看吧.今天我们就来实现一下这个效果, 这次我选择直接继承view来, 什么? 这样的效果不是SurfaceView擅长的吗? 为什么要view,其实都可以了, 我选择view,是因为:额,我对SurfaceView还不是很熟悉. 废话少说, 下面开始上代码 public class LabelView extends View { priva

Android实现3D标签云效果

最近业务需求,要求实现一个3D星球环绕效果,经过百般查找,终于找到了这个功能. 来先看看效果图: 首先还是添加第三方依赖库: compile 'com.moxun:tagcloudlib:1.1.0' 布局: <?xml version="1.0" encoding="utf-8"?> <android.support.constraint.ConstraintLayout xmlns:android="http://schemas.an

Android自定义控件案例汇总2(自定义开关、下拉刷新、侧滑菜单)

案例四 自定义开关: 功能介绍:本案例实现的功能是创建一个自定义的开关,可以自行决定开关的背景.当滑动开关时,开关的滑块可跟随手指移动.当手指松开后,滑块根据开关的状态,滑到最右边或者滑到最左边,同时保存开关的状态,将开关的状态回调给调用者.当然,上述功能系统给定的switch控件也可以实现. 实现步骤: 1. 写一个类继承view,重写两个参数的构造方法.在构造方法中指定工作空间,通过attrs.getAttributeResourceValue方法将java代码中的属性值和xml中的属性值联

Android自定义控件实现底部菜单(下)

在app中经常会用到底部菜单的控件,每次都需要写好多代码,今天我们用到了前几篇博客里的控件来进一步封装底部菜单.先看效果图: 主要包括以下功能: 1 设置icon以及点击之后的icon 2 设置文字 3 设置文字颜色以及点击之后的文字颜色 4 设置未读数量.更多以及new 我们先看如何使用,然后再看如何实现的 1 在布局文件中引用MenuM <com.landptf.view.MenuM android:id="@+id/mm_bottom" android:layout_wid

Android自定义控件案例汇总1(菜单、popupwindow、viewpager)

自定义控件是根据自己的需要自己来编写控件.安卓自带的控件有时候无法满足你的需求,这种时候,我们只能去自己去实现适合项目的控件.同时,安卓也允许你去继承已经存在的控件或者实现你自己的控件以便优化界面和创造更加丰富的用户体验.在平常的项目中,我们 人为的把自定义控件分为两种:一种是组合方式实现.一种是通过继承view或viewgroup及其子类实现.两者都可以实现我们想要的效果,因此,我们可以根据自己的需求,选择合适的方案.本文以案例的形式来显示几种较为常见的自定义控件. 案例一 优酷菜单: 功能介