whilu/AndroidTagView

A TagView library for Android. Customize your own & Drag effect.

Download

Step 1. Add the JitPack repository to your build file

Add it in your root settings.gradle at the end of repositories:

	dependencyResolutionManagement {
		repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
		repositories {
			mavenCentral()
			maven { url 'https://jitpack.io' }
		}
	}

Add it in your settings.gradle.kts at the end of repositories:

	dependencyResolutionManagement {
		repositoriesMode.set(RepositoriesMode.FAIL_ON_PROJECT_REPOS)
		repositories {
			mavenCentral()
			maven { url = uri("https://jitpack.io") }
		}
	}

Add to pom.xml

	<repositories>
		<repository>
		    <id>jitpack.io</id>
		    <url>https://jitpack.io</url>
		</repository>
	</repositories>

Add it in your build.sbt at the end of resolvers:

 
    resolvers += "jitpack" at "https://jitpack.io"

Add it in your project.clj at the end of repositories:

 
    :repositories [["jitpack" "https://jitpack.io"]]

Step 2. Add the dependency

	dependencies {
		implementation 'com.github.whilu:AndroidTagView:v1.1.7'
	}

	dependencies {
		implementation("com.github.whilu:AndroidTagView:v1.1.7")
	}

	<dependency>
	    <groupId>com.github.whilu</groupId>
	    <artifactId>AndroidTagView</artifactId>
	    <version>v1.1.7</version>
	</dependency>


                            
    libraryDependencies += "com.github.whilu" % "AndroidTagView" % "v1.1.7"


                            
    :dependencies [[com.github.whilu/AndroidTagView "v1.1.7"]]

Readme

AndroidTagView

An Android TagView library. You can customize awesome TagView by using this library.

Screenshots

Usage

Step 1

Add below dependency in your build.gradle file.

dependencies {
    implementation 'co.lujun:androidtagview:1.1.7'
    implementation 'androidx.appcompat:appcompat:1.0.1'
}

Step 2

Use the AndroidTagView in layout file, you can add customized attributes here.

<co.lujun.androidtagview.TagContainerLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="0dp"
    android:padding="10dp"
    app:container_enable_drag="false"
    app:horizontal_interval="10dp"
    app:vertical_interval="10dp"
    app:tag_clickable="true"
    app:tag_theme="pure_teal" />

Step 3

Use TagView in your code.

TagContainerLayout mTagContainerLayout = (TagContainerLayout) findViewById(R.id.tagcontainerLayout);
mTagContainerLayout.setTags(List<String> tags);

Now, you have successfully created some TagViews. The following will show some more useful features for you customize.

Attributes

You can set these attributes in layout file, or use setters(each attribute has get and set method) to set them.

Themes

Directions

|direction|code|value|description |:---:|:---:|:---:|:---:| | ltr | View.TEXT_DIRECTION_LTR | 3 | Text direction is forced to LTR(default) | rtl | View.TEXT_DIRECTION_RTL | 4 | Text direction is forced to RTL

Gravity

Methods

Set a TagView.OnTagClickListener for TagView, for onTagClick , onTagLongClick and onTagCrossClick callback

mTagContainerLayout.setOnTagClickListener(new TagView.OnTagClickListener() {

    @Override
    public void onTagClick(int position, String text) {
        // ...
    }

    @Override
    public void onTagLongClick(final int position, String text) {
        // ...
    }

    @Override
    public void onSelectedTagDrag(int position, String text){
        // ...
    }
    
    @Override
    public void onTagCrossClick(int position) {
        // ...
    }
});

Use setTagMaxLength(int max) to set text max length for all TagView.

mTagContainerLayout.setTagMaxLength(int max);

Use getTagText(int position) to get TagView text at the specified location.

String text = mTagContainerLayout.getTagText(int position);

getTags() return a string list for all tags in TagContainerLayout.

List<String> list = mTagContainerLayout.getTags();

If you set the attribute container_enable_drag to true, when drag the TagView you can get latest state by using getTagViewState(). There are 4 state:ViewDragHelper.STATE_IDLE, ViewDragHelper.STATE_DRAGGING, and ViewDragHelper.STATE_SETTLING.

int state = mTagContainerLayout.getTagViewState();

Set the theme. If you want to customize theme, remember set theme with ColorFactory.NONE first, then set other attributes.

// Set library provides theme
mTagContainerLayout.setTheme(ColorFactory.PURE_CYAN);

// Set customize theme
mTagContainerLayout.setTheme(ColorFactory.NONE);
mTagContainerLayout.setTagBackgroundColor(Color.TRANSPARENT);

Set the text direction. The library support two direction View.TEXT_DIRECTION_LTR and View.TEXT_DIRECTION_RTL.

mTagContainerLayout.setTagTextDirection(View.TEXT_DIRECTION_RTL);

Use setTagTypeface(Typeface typeface) to set TagView text typeface.

Typeface typeface = Typeface.createFromAsset(getAssets(), "iran_sans.ttf");
mTagContainerLayout.setTagTypeface(typeface);

After set the attributes, set tags or add a tag.

Use setTags() to set tags, require a parameter of type List<String> or String[].

mTagContainerLayout.setTags(List<String> tags);

Insert a TagView into ContainerLayout at the end.

mTagContainerLayout.addTag(String text);

Insert a TagView into ContainerLayout at the specified location, the TagView is inserted before the current element at the specified location.

mTagContainerLayout.addTag(String text, int position);

Remove TagView on particular position, require the position of the TagView.

mTagContainerLayout.removeTag(int position);

Remove all TagViews.

mTagContainerLayout.removeAllTags();

Get a TagView in specified position.

mTagContainerLayout.getTagView(int position);

Set color for each TagView.

List<int[]> colors = new ArrayList<int[]>();
//int[] color = {TagBackgroundColor, TabBorderColor, TagTextColor, TagSelectedBackgroundColor}
int[] color1 = {Color.RED, Color.BLACK, Color.WHITE, Color.YELLOW};
int[] color2 = {Color.BLUE, Color.BLACK, Color.WHITE, Color.YELLOW};
colors.add(color1);
colors.add(color2);
mTagcontainerLayout.setTags(tags, colors);

Change logs

1.1.7(2019-01-21)

Fix bugs

1.1.6(2018-12-1)

Support tag selectable

1.1.5(2018-8-20)

Allow images on tags (in LTR languages).

1.1.4(2017-6-1)

Add attribute for TagView background.

1.1.3(2017-5-17)

Add getTagView(int position) method to get TagView in specified position.

1.1.2(2017-5-16)

Fix bugs

1.1.1(2017-4-16)

Customize the color of the TagView, see #51
Fixed issue #50, #49

1.1.0(2017-3-5)

Fixed issue #45
Support 'letters show with RTL(eg: Android -> diordnA)' style

1.0.6(2017-2-14)

Fix bugs

1.0.5(2016-11-9)

Add cross view for TagView

1.0.4(2016-10-30)

Support ripple effect(Call requires API level 11), like Android CustomButton
Fix bugs

1.0.3(2016-4-3)

Add getTags() method to get the list for all tags
Fixed bugs in ListView/RecyclerView

1.0.2(2016-1-18)

Support gravity for TagContainerLayout
Support set typeface

1.0.1(2016-1-14)

Support text direction
Add removeAllTags() method for remove all TagViews
Fixed issue #1
Fixed other bugs

1.0.0(2016-1-6)

First release

Sample App

APK

About

If you have any questions, contact me: lujun.byte#gmail.com.

License

Copyright 2015 lujun

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.