shellljx / Tagviewgroup
Licence: gpl-3.0
Android 仿小红书图片标签Group
Stars: ✭ 891
Programming Languages
kotlin
9241 projects
Projects that are alternatives of or similar to Tagviewgroup
Androidpilelayout
An abnormal horizontal ListView-like pile layout with stretch and contraction effects.
Stars: ✭ 2,104 (+136.14%)
Mutual labels: viewgroup
CoolView
一些炫酷的自定义控件(Some cool custom controls),逐步完善中...
Stars: ✭ 63 (-92.93%)
Mutual labels: viewgroup
Sliding Panel
Android sliding panel that is part of the view hierarchy, not above it.
Stars: ✭ 433 (-51.4%)
Mutual labels: viewgroup
Slidemenulayout
🔥An android slide menu that supports left and right swipes and slides with parallax.(一个支持左右滑动并带有视差滑动效果的安卓侧滑菜单控件.仿[QQ/探探侧滑])
Stars: ✭ 235 (-73.63%)
Mutual labels: viewgroup
ShadowDrawable
为View 和 ViewGroup 添加阴影效果--Android,Add shadow for single view or viewgroup layout.
Stars: ✭ 22 (-97.53%)
Mutual labels: viewgroup
BezierCurtainEffect
贝塞尔曲线窗帘效果BezierCurtainEffect,BezierCurtainView,CurtainEffect,CurtainView
Stars: ✭ 45 (-94.95%)
Mutual labels: viewgroup
Android Snake Menu
imitate Tumblr's menu, dragging animations look like a snake
Stars: ✭ 584 (-34.46%)
Mutual labels: viewgroup
drag-to-close
Android library that provides a view group which allows to finish an activity by dragging a view.
Stars: ✭ 69 (-92.26%)
Mutual labels: viewgroup
Swipedelmenulayout
The most simple SwipeMenu in the history, 0 coupling, support any ViewGroup. Step integration swipe (delete) menu, high imitation QQ, iOS. ~史上最简单侧滑菜单,0耦合,支持任意ViewGroup。一步集成侧滑(删除)菜单,高仿QQ、IOS。~
Stars: ✭ 3,376 (+278.9%)
Mutual labels: viewgroup
bottomsheets
Material Bottom Sheets library for Android
Stars: ✭ 76 (-91.47%)
Mutual labels: viewgroup
bubble-layout
An Android ViewGroup that displays avatar bubbles... similar to the chat bubbles on Facebook Messenger.
Stars: ✭ 46 (-94.84%)
Mutual labels: viewgroup
Cardslidepanel
enable users to slide card to the left or right smoothly and continuously
Stars: ✭ 2,377 (+166.78%)
Mutual labels: viewgroup
Kotlinextensions.com
A handy collection of most commonly used Kotlin extensions to boost your productivity.
Stars: ✭ 522 (-41.41%)
Mutual labels: viewgroup
Neumorphismview Android
A Neumorphism library for Android, supporting customizations for shadows/highlights to selected child views.
Stars: ✭ 121 (-86.42%)
Mutual labels: viewgroup
FlowlayoutTags
具有标签功能的流式布局,接口简单。可多选单选,可记住选择状态,状态切换有过渡动画。
Stars: ✭ 78 (-91.25%)
Mutual labels: viewgroup
Chips Input Layout
A customizable Android ViewGroup for displaying Chips (specified in the Material Design Guide).
Stars: ✭ 591 (-33.67%)
Mutual labels: viewgroup
Nestedtouchscrollinglayout
🎱处理子 View,父 View 嵌套滚动,成本比 support v4 NestedScrolling 低,放心食用~
Stars: ✭ 557 (-37.49%)
Mutual labels: viewgroup
AdapterLayout
ViewGroup backed by RecyclerView.Adapter = magic
Stars: ✭ 58 (-93.49%)
Mutual labels: viewgroup
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
TagAdapter
and make it easier to create TagViewGroup. -
moved
AnimatorUtils
out 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;
}
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].