Home Android TagViewLayout

Android TagViewLayout

Android TagViewLayout


Language :
Platform :
Type :
Owner :
Main Category :
Sub Category :
License :
Price :


TagViewLayout Android

Download

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

Demo

preset layout configurations in examples

Video Demo

Feature

  • [x] multiple choice mode
  • [x] single selection choice mode
  • [x] toggle and switching color by xml style configurations
  • [x] styling via code base / xml base

Usage

Step 1

Add below dependency in your build.gradle file.

dependencies {
    compile 'com.hkm.taglib:tag:1.6.0'
}

Step 2

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

<co.hkm.soltag.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_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

nameformatdescription
vertical_intervaldimensionVertical interval, default 5(dp)
horizontal_intervaldimensionHorizontal interval, default 5(dp)
container_border_widthdimensionTagContainerLayout border width(default 0.5dp)
container_border_radiusdimensionTagContainerLayout border radius(default 10.0dp)
container_border_colorcolorTagContainerLayout border color(default #22FF0000)
container_background_colorcolorTagContainerLayout background color(default #11FF0000)
container_enable_dragbooleanCan drag TagView(default false)
container_drag_sensitivityfloatThe sensitive of the ViewDragHelper(default 1.0f, normal)
container_gravityenumThe TagContainerLayout gravity
tag_border_widthdimensionTagView Border width(default 0.5dp)
tag_corner_radiusdimensionTagView Border radius(default 15.0dp)
tag_horizontal_paddingdimensionHorizontal padding for TagView, include left and right padding(left and right padding are equal, default 20px)
tag_vertical_paddingdimensionVertical padding for TagView, include top and bottom padding(top and bottom padding are equal, default 17px)
tag_text_sizedimensionTagView Text size(default 14sp)
tag_bd_distancedimensionThe distance between baseline and descent(default 5.5px)
tag_text_colorcolorTagView text color(default #FF666666)
tag_border_colorcolorTagView border color(default #88F44336)
tag_background_colorcolorTagView background color(default #33F44336)
tag_max_lengthintegerThe max length for TagView(default max length 23)
tag_themeenumThe TagView theme
tag_text_directionenumThe TagView text direction
tag_drawable_state0drawableThe drawable for the default state
tag_drawable_state1drawableThe drawable for the active state
tag_drawable_state2drawableThe drawable for the preselected / press state

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

Themes

themecodevaluedescription
noneColorFactory.NONE-1If you customize TagView with your way, set this theme
randomColorFactory.RANDOM0Create each TagView using random color
pure_cyanColorFactory.PURE_CYAN1All TagView created by pure cyan color
pure_tealColorFactory.PURE_TEAL2All TagView created by pure teal color

Directions

directioncodevaluedescription
ltrView.TEXT_DIRECTION_LTR3Text direction is forced to LTR(default)
rtlView.TEXT_DIRECTION_RTL4Text direction is forced to RTL

Gravity

gravitycodevaluedescription
leftGravity.LEFT3Push TagView to the left of TagContainerLayout(default)
centerGravity.CENTER17Push TagView to the center of TagContainerLayout
rightGravity.RIGHT5Push TagView to the right of TagContainerLayout

Methods

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

    mTagContainerLayout.setOnTagClickListener(new TagView.OnTagClickListener() {
    
    @Override
    public void onTagClick(int position, String text) {
        // ...
    }
    
    @Override
    public void onTagLongClick(final int position, String text) {
        // ...
    }
    });
  • 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();

Change logs

Sample App

APK

Screenshots

IMEF

License

Copyright 2015 hkm jet fighter-101

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

Leave a Comment