TagViewGroup
Android ? ?????????????????????????????????????? Tag? ??????
This is a library of tags that are attached to the picture,you can add tags and ripple effects very easily. Video demo
Important Update
-
added
TagAdapterand make it easier to create TagViewGroup. -
moved
AnimatorUtilsout of the library to make it clean.
Gradle
Step 1. Add it in your root build.gradle at the end of repositories:
allprojects {
repositories {
...
maven {
url 'https://jitpack.io'
}
}
}
Step 2. Add the dependency
dependencies {
compile 'com.github.shellljx:TagViewGroup:-SNAPSHOT'
}
How to use
1. Define in xml
<com.licrafter.tagview.TagViewGroup
android:id="@+id/tagViewGroup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:inner_radius="4dp"
app:line_width="1dp"
app:radius="8dp"
app:ripple_alpha="100"
app:ripple_radius="20dp"
app:tilt_distance="20dp"/>2. Or in code
TagViewGroup tagViewGroup = new TagViewGroup(getContext());
3. Add animator
// set hide animator ,show animator and ripple tagViewGroup.setHideAnimator(hideAnimator).setShowAnimator(showAnimator).addRipple();
4. Set tagAdapter
tagViewGroup.setTagAdapter(new TagAdapter() {
@Override
public int getCount() {
return model.getTags().size();
}
@Override
public ITagView getItem(int position) {
return makeTagTextView(model.getTags().get(position));
}
}
);
//set tagViewGroup location tagViewGroup.setPercent(model.getPercentX(), model.getPercentY());
5. NotifyDataSetChanged
tagViewGroup.getTagAdapter().notifyDataSetChanged();
6. Handle click events
tagViewGroup.setOnTagGroupClickListener(new TagViewGroup.OnTagGroupClickListener() {
@Override
public void onCircleClick(TagViewGroup container) {
//click the white circle of TagViewGroup
}
@Override
public void onTagClick(TagViewGroup container, ITagView tag, int position) {
//clikc a tag of TagViewGroup
}
@Override
public void onLongPress(TagViewGroup container) {
}
}
);
7. Drag TagViewGroup
//you can drag tagViewGroup only if you set OnTagGroupDragListener tagViewGroup.setOnTagGroupDragListener(new TagViewGroup.OnTagGroupDragListener() {
@Override
public void onDrag(TagViewGroup container, float percentX, float percentY) {
}
}
);
Attributes:
| attr?? | description ?? |
|---|---|
| inner_radius | ?????? |
| radius | ?????? |
| line_width | ???? |
| v_distance | ???????????? |
| tilt_distance | ???????????? |
| ripple_alpha | ???????? |
| ripple_maxRadius | ??????? |
How to customize the animation
You can use the following properties in Property Animation:
| property?? | description ?? |
|---|---|
| LinesRatio(TagViewGroup.LINES_RATIO) | ??????????????? |
| TagAlpha(TagViewGroup.TAG_ALPHA) | ??Tag???? |
| CircleRadius(TagViewGroup.CIRCLE_RADIUS) | ????? |
| CircleInnerRadius(TagViewGroup.CIRCLE_INNER_RADIUS) | ?????? |
How to implement your own Tag view
Step 1. create a view implement ITagView interface.
Step 2. Override the following methods:
@Override public void setDirection(DIRECTION direction) {
mDirection = direction;
}
@Override public DIRECTION getDirection() {
return mDirection;
}