:four_leaf_clover:A beautiful android tag group widget.

Overview

AndroidTagGroup

Release 1.4 Maven Central Android Arsenal Build Status

The TagGroup is a special layout with a set of tags. You can use it to tag people, books or anything you want.

Also you can contribute new idea to me.

Demo

Screenshot

screenshot1

Edit Tags

screenshot2 screenshot3

Download Demo

Usage

Step 1

Gradle

dependencies {
   compile 'me.gujun.android.taggroup:library:1.4@aar'
}

Maven

<dependency>
    <groupId>me.gujun.android.taggroup</groupId>
    <artifactId>library</artifactId>
    <version>1.4</version>
    <type>apklib</type>
</dependency>

Step 2

Use it in your own code:

<me.gujun.android.taggroup.TagGroup
    android:id="@+id/tag_group"
    style="@style/TagGroup" />
TagGroup mTagGroup = (TagGroup) findViewById(R.id.tag_group);
mTagGroup.setTags(new String[]{"Tag1", "Tag2", "Tag3"});

Use setTags(...) to set the initial tags in the group.

How to submit a new tag?

To "submit" a new tag as user press "Enter" or tap the blank area of the tag group, also you can "submit" a new tag via submitTag().

Note: Google keyboard (a few soft keyboard not honour the key event) currently not supported "Enter" key to "submit" a new tag.

How to delete a tag?

To delete a tag as user press "Backspace" key or double-tap the tag which you want to delete.

How to detect tag click event?

Implement a callback interface: TagGroup.OnTagClickListener, and set the listener via setOnTagClickListener().

Build

run ./gradlew assembleDebug (Mac/Linux)

or

run gradlew.bat assembleDebug (Windows)

Attributes

There are several attributes you can set:

Dimension illustrate

attr default mean
atg_isAppendMode false Determine the TagGroup mode, APPEND or single DISPLAY.
atg_inputHint Add Tag/添加标签 The hint of the INPUT tag.
atg_borderColor #49C120 The tag outline border color.
atg_textColor #49C120 The tag text color.
atg_backgroundColor #FFFFFF The tag background color.
atg_dashBorderColor #AAAAAA The tag dash outline border color.
atg_inputHintColor #80000000 The input tag hint text color.
atg_inputTextColor #DE000000 The input tag type text color..
atg_checkedBorderColor #49C120 The checked tag outline border color.
atg_checkedTextColor #FFFFFF The checked text color.
atg_checkedMarkerColor #FFFFFF The checked marker color.
atg_checkedBackgroundColor #49C120 The checked tag background color.
atg_pressedBackgroundColor #EDEDED The tag background color when the tag is being pressed.
atg_borderStrokeWidth 0.5dp The tag outline border stroke width.
atg_textSize 13sp The tag text size.
atg_horizontalSpacing 8dp The horizontal tag spacing.(Mark1)
atg_verticalSpacing 4dp The vertical tag spacing.(Mark2)
atg_horizontalPadding 12dp The horizontal tag padding.(Mark3)
atg_verticalPadding 3dp The vertical tag padding.(Mark4)

Developed By

Jun Gu - [email protected]

Follow me on Weibo Follow me on Google Plus

License

Copyright 2015 Jun Gu

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
Comments
  • Submit new tag

    Submit new tag

    Hello,

    Thank you for this View!

    But I can't find out to actually add a new tag (as a user) to a TagGroup. I have the input tag to enter a title, but I don't know how to "submit" the new tag. On my keyboard I only have an "Enter" key, which adds a new line. Did I forget to set something?

    bug 
    opened by MGaetan89 13
  • Gravity in center ?

    Gravity in center ?

    If I just add a tag, this view will align to the left of screen. But I want it in the middle of the screen. How to do that ? OK, I solve this by adding a parent layout. But there is another problem, if I have more than one line tags, the second line only have one tag. How to make it in the middle too ?

    opened by ghysrc 4
  • Attributes has already been defined

    Attributes has already been defined

    As i sync the gradle after entering your library it gives me error as,

    'Error:(1) Attribute "textColor" has already been defined' 'Error:(1) Attribute "backgroundColor" has already been defined'

    Error:Execution failed for task ':app:processDebugResources'.

    com.android.ide.common.process.ProcessException: org.gradle.process.internal.ExecException: Process 'command 'C:\Users\PL\AppData\Local\Android\sdk\build-tools\21.1.2\aapt.exe'' finished with non-zero exit value 1

    I checked my color.xml which doesn't have any attribute like 'textColor' or 'backgroundColor'

    Help please!

    bug 
    opened by viii2050 3
  • I think 'only deletable mode' is needed

    I think 'only deletable mode' is needed

    Thank you for providing good library. I think it is very useful and easy, so I'm satisfied with using your library.

    I think this library can be more useful if there is 'only deletable mode'. When I making my application, I need deletable tags, but I don't want 'add a new tag' function. That means, I don't want the function that users can write their own tags. So, I override your library and making my own tag library by deactivating 'appendInputTag()' function.

    I think some of this library users want this function that I made. Can you add the 'only deletable mode'? It can be useful for us.

    opened by su-mong 2
  • Improve GRADLE build Performance

    Improve GRADLE build Performance

    Incremental compilation. Gradle recompile only the classes that were affected by a change. This feature is the default since Gradle 4.10. For an older versions, we can activate it by setting options.incremental = true.

    ===================== If there are any inappropriate modifications in this PR, please give me a reply and I will change them.

    opened by i-Taozi 0
  • 魅族手机显示tag,圆角起始处向右偏移了一点,导致右边宽度被裁剪一点,附解决方法

    魅族手机显示tag,圆角起始处向右偏移了一点,导致右边宽度被裁剪一点,附解决方法

    image

    显示就是这个样子的,其他手机正常,就魅族16s pro这个手机显示异常,down下源码排查了好久,最终怀疑应该是魅族手机对tagview的测量有问题, 最后解决方法代码如下 image image

    代码也附上哈,避免github抽风图片显示不出来,其他原样无关的代码以点点点代替哈:

    class TagView extends androidx.appcompat.widget.AppCompatTextView {
        .......
        public TagView(Context context, final int state, CharSequence text) {
                    super(context);
                    setGravity(Gravity.CENTER);
                    setText(text);
                    setMaxLines(1);
                    setTextSize(TypedValue.COMPLEX_UNIT_PX, textSize);
        
                    mState = state;
        
                    setClickable(isAppendMode);
                    setFocusable(state == STATE_INPUT);
                    setFocusableInTouchMode(state == STATE_INPUT);
                    setHint(state == STATE_INPUT ? inputHint : null);
                    setMovementMethod(state == STATE_INPUT ? ArrowKeyMovementMethod.getInstance() : null);
        
                    ........
        
                    invalidatePaint();
        
                    setPadding(horizontalPadding, verticalPadding, horizontalPadding, verticalPadding);
        
                    //setLayoutParams(new ViewGroup.LayoutParams(TagGroup.LayoutParams.WRAP_CONTENT, TagGroup.LayoutParams.WRAP_CONTENT));
                    setLayoutParams(new ViewGroup.LayoutParams(StephenToolUtils.getStringPixelWidth(getPaint(), text.toString()) + (horizontalPadding * 2),
                            StephenToolUtils.getStringPixelMaxHeightForInt(getPaint()) + (verticalPadding * 2)));
          }
          ..............
            @Override
            protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
                int widthSize = MeasureSpec.getSize(widthMeasureSpec);
                int heightSize = MeasureSpec.getSize(heightMeasureSpec);
                setMeasuredDimension(widthSize, heightSize);
                //super.onMeasure(widthMeasureSpec, heightMeasureSpec);
            }
            ..............
    }
    

    然后里面用到的StephenToolUtils相关方法如下:

    //计算字符串的宽度(像素)
    public static int getStringPixelWidth(Paint strPaint, String str) {
        return ((int) strPaint.measureText(str));
    }
    
    //计算字符串的高度(像素)
    public static int getStringPixelHeight(Paint strPaint, String str) {
        Rect rect = new Rect();
        strPaint.getTextBounds(str, 0, str.length(), rect);
        return rect.height();
    }
    
    //计算字符串的高度(像素)(抵拢字体显示上下,没有空白)
    public static int getStringPixelMinHeightForInt(Paint strPaint) {
        Paint.FontMetricsInt fontMetrics = strPaint.getFontMetricsInt();
        return fontMetrics.descent - fontMetrics.ascent;
    }
    //计算字符串的高度(像素)(字体显示上下处包含些许空白)
    public static int getStringPixelMaxHeightForInt(Paint strPaint) {
        Paint.FontMetricsInt fontMetrics = strPaint.getFontMetricsInt();
        return fontMetrics.bottom - fontMetrics.top;
    }
    
    //计算字符串的高度(像素)(抵拢字体显示上下,没有空白)
    public static float getStringPixelMinHeightForFloat(Paint strPaint) {
        Paint.FontMetrics fontMetrics = strPaint.getFontMetrics();
        return fontMetrics.descent - fontMetrics.ascent;
    }
    //计算字符串的高度(像素)(字体显示上下处包含些许空白)
    public static float getStringPixelMaxHeightForFloat(Paint strPaint) {
        Paint.FontMetrics fontMetrics = strPaint.getFontMetrics();
        return fontMetrics.bottom - fontMetrics.top;
    }
    
    opened by woshiluoyong 0
  • Not able to upload android app on playstore due to this library

    Not able to upload android app on playstore due to this library

    I have used this library in my android app as gradle dependency and whenever trying to upload to play store I am getting the following error: "Your app bundle targets the following unrecognized languages: jp. The list of supported language codes can be found in the IANA registry. Invalid languages caused by third-party libraries can be excluded using the resConfigs Gradle property. You need to use a different package name beacuse "com.example" is restricted."

    I have also used resConfigs property and included japanese language but nothing happens.. I am not using any other language in my app except default.. image

    opened by mwish558 0
Releases(v1.4)
Owner
Jun Gu
Online
Jun Gu
An Android TagView Widget. You can edit the tag's style, and set listener of selecting or deleting tag.

Android-Cloud-TagView-Plus ###Introduction An Android Cloud Tag Widget. You can edit the tag's style, and set listener of selecting or deleting tag. U

Kaede Akatsuki 663 Nov 19, 2022
A TagView library for Android. Customize your own & Drag effect.

AndroidTagView An Android TagView library. You can customize awesome TagView by using this library. Screenshots Usage Step 1 Add below dependency in y

lujun 1.7k Dec 29, 2022
Tagcloud component for android

TagCloudView English Sample 扫码下载示例APK 简介 TagCloudView是一个基于ViewGroup实现的控件,支持将一组View展示为一个3D球形集合,并支持全方向滚动。 UI效果 Image 使用 Eclipse copy代码,或使用ADT的maven插件 An

moxun 1.6k Dec 20, 2022
Android TagView-HashTagView

Android TagView Android TagView-HashTagView Xamarin version, written by @fernandolopes https://github.com/fernandolopes/Xamarin.Android.TagView Simple

Cüneyt Çarıkçi 490 Nov 17, 2022
Simple android view to display list of colorful tags efficiently.

Android TagView Simple android view to display collection of colorful tags efficiently. Library uses TextView as a base, and creates custom Spanes to

Michał Charmas 175 Nov 11, 2022
An Android TagView Widget. You can edit the tag's style, and set listener of selecting or deleting tag.

Android-Cloud-TagView-Plus ###Introduction An Android Cloud Tag Widget. You can edit the tag's style, and set listener of selecting or deleting tag. U

Kaede Akatsuki 663 Nov 19, 2022
An Android TagView Widget. You can edit the tag's style, and set listener of selecting or deleting tag.

Android-Cloud-TagView-Plus ###Introduction An Android Cloud Tag Widget. You can edit the tag's style, and set listener of selecting or deleting tag. U

Kaede Akatsuki 663 Nov 19, 2022
ImageView with a tag on android

SimpleTagImageView ImageView with a tag in android. So it's a ImageView. Demo ####Warning:When you set the round radius,the simpletagimageview scale t

null 944 Nov 10, 2022
A simple Android Tag EditText

TagEditText A simple Android Tag EditText. Setup The easiest way to add the TagEditText library to your project is by adding it as a dependency to you

HearSilent 15 May 5, 2022
VirtualTag is a name tag edit plugin for minecraft server

VirtualTag VirtualTag is a NameTag Edit plugin for modern minecraft server Support Version 1.17.x Download https://github.com/jiangdashao/VirtualTag/r

RERERE 13 Dec 18, 2022
Free Dmo Tag Dump

#FREE DMO TAG DUMP Android utility to read complete content of NXP SLIX2 tags. The complete readout is shown on screen and a file for each scan is cre

null 15 Dec 26, 2022
:octocat: ≡ DirectSelect is a selection widget with an ethereal, full-screen modal popup displaying the available choices when the widget is interact with.

DIRECT SELECT [JAVA] Selection widget with an ethereal, full-screen modal popup displaying the available choices We specialize in the designing and co

Ramotion 536 Nov 22, 2022
A cute widget of Switch Button for you to create beautiful and friendly UI.

SwitchButton To get a quick preview, you can get Demo apk in Google Play or Directly download. This project provides you a convenient way to use and c

kyleduo 4.6k Dec 31, 2022
⭐️ beautiful switch widget with sticky animation ⭐️

StickySwitch StickySwitch library for android this library is beautiful switch widget with sticky animation Requirements Android SDK 15+ Usage Add it

GwonHyeok 767 Dec 6, 2022
Combination of a beautiful clock with widget, alarm, stopwatch & timer, no ads

Simple Clock The app has multiple functions related to timing. At the clock you can enable displaying times from other timezones, or use the simple, b

Simple Mobile Tools 462 Dec 28, 2022
🗨️ Beautiful Dialog is a Simple and Beautiful custom dialog

Beautiful Dialog ??️ Beautiful Dialog is a Simple and Beautiful custom dialog. Screenshots Including in your project Gradle Add below codes to your ro

Geovani Amaral 21 Jan 6, 2023
Android library to display a few images in one ImageView like avatar of group chat. Made by Stfalcon

MultiImageView Library for display a few images in one MultiImageView like avatar of group chat Who we are Need iOS and Android apps, MVP development

Stfalcon LLC 468 Dec 9, 2022
An open source Android library that provides a floating group view at the top of the ExpandableListView

FloatingGroupExpandableListView FloatingGroupExpandableListView is a huge name an open source Android library that provides a floating group view (aka

Diego Lima 376 Nov 28, 2022
[UNMAINTAINED]: AndroidMosaicLayout is android layout to display group of views as grid consists of different asymmetric patterns (90 different patterns).

AndroidMosaicLayout AndroidMosaicLayout is android layout to display group of views in more that 90 different patterns. What is AndroidMosaicLayout? I

Adham Enaya 474 Nov 12, 2022
A swipeable - auto resizing view group for android

SwipeableLayout A swipeable - auto resizing view group for android Usage build.gradle compile 'com.wmbest.widget:swipeable-layout:1.0.+@aar' -- or --

Bill Best 114 Nov 25, 2022