在Android开发中，我们时常遇到以下几个问题：
- 在文本指定位置添加一个标签
- 把原来的文本替换成指定样式
- 某某协议点击可以跳转协议的详细内容
- 在指定位置插入一个网络图片
等等，UI大佬的样式可能是千奇百怪，毕竟我们不能左右UI大佬，所以我们只有自己写，当文本不超过一行的时候，使用drawableLeft等在前面插入一个图片，当然可以解决问题，但是插入的图片需要设置大小，有可能会变形，有时候需要在中间某一个点插入呢，当然也有办法，使用Span也可以解决，但是每一次都需要自定义一遍，把代码写一遍，不仅代码冗余，维护也很麻烦。这里我推荐使用TagTextView库，使用简单，不影响原来布局代码，基本支持各种标签，欢迎star。
效果图
效果图
API特色
- 支持在文本的任意位置添加各种不同标签
- 支持指定位置、文本替换为指定标签
- 支持网络标签
- 支持Gif标签
- 支持自定义布局文件
- 支持指定文本点击响应
- 支持下划线
- 支持删除线
- 支持超链
- 支持Kotlin、Java
如何使用
Step 1.先在 build.gradle(Project:XXX) 的 repositories 添加:
allprojects {
repositories {
...
maven { url "https://jitpack.io" }
}
}
Step 2. 然后在 build.gradle(Module:XXX) 的 dependencies 添加:
dependencies {
implementation 'com.github.ChinaLike:TagTextView:0.2.0'
// 如果支持网络图片标签，需要添加Glide库
//implementation "com.github.bumptech.glide:glide:4.11.0"
}
Step 3. 如果支持网络标签，需要在
AndroidManifest.xml中添加:
<uses-permission android:name="android.permission.INTERNET" />
Step 4. 在XML中使用
<com.view.text.view.TagTextView
android:id="@+id/url_tv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:tvt_type="text"
app:tvt_text="新品"
app:tvt_start_gradient_background_color="#FFF6B7"
app:tvt_end_gradient_background_color="#F6416C"
app:tvt_margin_right="20dp"
android:text="荣耀V40轻奢版 5G 超级快充 6400万超清四摄 8GB+128GB钛空银 移动联通电信5G 双卡双待手机" />
或者 Step 4. 在代码中使用（不影响原来布局）
val tv1Config = TagConfig(Type.TEXT).apply {
text = "新品"
}
text_tv1.addTag(tv1Config)
API说明
扩展方法
不需要修改原来XML布局文件，只需要在代码中使用以下方法即可实现标签样式，这样对原来代码影响最小的。
addTag(config:TagConfig)
-
添加标签
-
属性介绍
- config:标签的样式配置,参考TagConfig
addTag(view:View,position:Int,align:Align,marginLeft:Int,marginRight:Int)
-
添加自定义标签
-
属性介绍
-
view:自定义View
-
position:显示位置，默认：0
-
align:对其方式，默认：Align.CENTER
-
marginLeft:标签距离左侧距离，默认：0
-
marginRight:标签距离右侧距离，默认：0
-
addTextTag(block: TagConfig.() -> Unit)
-
添加文本标签
-
属性介绍
- block:标签自定义参数
addImageTag(block: TagConfig.() -> Unit)
-
添加图标标签
-
属性介绍
- block: 标签自定义参数
addTextImageTag(block: TagConfig.() -> Unit)
-
添加图文标签
-
属性介绍
- block: 标签自定义参数
addUrlTag(block: TagConfig.() -> Unit)
-
添加图文标签
-
属性介绍
- block: 标签自定义参数
replaceTag(tagText: String, config: TagConfig, isFirst: Boolean = true)
-
替换标签
-
属性介绍
-
tagText:需要替换的文本
-
config:标签配置
-
isFirst:是否匹配第一个
-
replaceTag(tagText: String, view: View, isFirst: Boolean = true, align: Align = Align.CENTER, marginLeft: Int = 0, marginRight: Int = 0)
-
替换标签
-
属性介绍
-
tagText:需要替换的文本
-
view:自定义标签
-
isFirst:是否匹配第一个
-
align:标签对齐方式
-
marginLeft:标签距离左侧距离
-
marginRight:标签距离右侧距离
-
replaceTag(startIndex: Int, endIndex: Int, config: TagConfig)
-
替换标签
-
属性介绍
-
startIndex:开始下标
-
endIndex:结束下标
-
config:标签配置
-
replaceTag( startIndex: Int, endIndex: Int, view: View, align: Align = Align.CENTER, marginLeft: Int = 0, marginRight: Int = 0 )
-
替换标签
-
属性介绍
-
startIndex:开始位置
-
endIndex:结束位置
-
view:自定义标签
-
align:标签对齐方式
-
marginLeft:标签距离左侧距离
-
marginRight:标签距离右侧距离
-
setUnderline(underlineText: String? = null, isFirst: Boolean = true)
-
设置文本下划线
-
属性介绍
-
underlineText:需要加下划线的文本,不设置则匹配所有文本
-
isFirst:是否匹配第一个指定字符串
-
setUnderline(startIndex: Int, endIndex: Int)
-
设置文本下划线
-
属性介绍
-
startIndex:开始下标
-
endIndex:结束下标
-
setDeleteLine(deleteLineText: String? = null, isFirst: Boolean = true)
-
设置文本删除线
-
属性介绍
- deleteLineText:需要加删除线的文本，不设置则匹配所有文本
setDeleteLine(startIndex: Int, endIndex: Int)
-
设置文本删除线
-
属性介绍
- startIndex:开始下标
- endIndex:结束下标
setSpecificTextColor(@ColorInt color: Int,specificText: String,isFirst: Boolean = true,isUnderlineText: Boolean = false,click: () -> Unit = {})
-
设置指定文字颜色
-
属性介绍
-
color:制定文本颜色
-
specificText:指定文本
-
isFirst:匹配第一个，默认值：true
-
isUnderlineText:是否显示下划线，可选，默认值false
-
click:点击事件响应
-
setSpecificTextColor(@ColorInt color: Int,startIndex: Int，endIndex: Int,isUnderlineText: Boolean = false,click: () -> Unit = {})
-
设置指定文字颜色
-
属性介绍
-
color:制定文本颜色
-
startIndex:开始下标
-
endIndex:结束下标
-
isUnderlineText:是否显示下划线，可选，默认值false
-
click:点击事件响应
-
setURLSpan(startIndex: Int,endIndex: Int,type: LinkType,linkText: String,@ColorInt color: Int? = null,isUnderlineText: Boolean = false)
-
设置超链
-
属性介绍
-
startIndex:开始下标
-
endIndex:结束下标
-
type:超链接类型，参考LinkType
-
linkText:链接文本 ，比如跳转电话，只需要传入电话号码就可以
-
color:超链文本的颜色
-
isUnderlineText:是否显示下划线，默认值false
-
在XML中使用（需要修改原来布局）
在XML中使用的话，标签可以通过xml属性配置，但是只支持一个标签，如果需要多个标签，只能通过扩展方法来添加，或者使用tvt_layout属性设置自定义View
<com.view.text.view.TagTextView
android:id="@+id/url_tv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:tvt_type="text"
app:tvt_text="新品"
app:tvt_start_gradient_background_color="#FFF6B7"
app:tvt_end_gradient_background_color="#F6416C"
app:tvt_margin_right="20dp"
android:text="荣耀V40轻奢版 5G 超级快充 6400万超清四摄 8GB+128GB钛空银 移动联通电信5G 双卡双待手机" />
属性介绍
| API | 描述 | 默认值 | 说明 |
|---|---|---|---|
tvt_type |
标签类型 | text-文本标签，image-图片标签，textImage-图文 | |
tvt_radius |
标签圆角 |
tvt_type为text、textImage时有效 |
|
tvt_left_top_radius |
标签左上角圆角 | 2dp |
tvt_type为text、textImage，且tvt_radius未设置有效 |
tvt_left_bottom_radius |
标签左下角圆角 | 2dp |
tvt_type为text、textImage，且tvt_radius未设置有效 |
tvt_right_top_radius |
标签右上角圆角 | 2dp |
tvt_type为text、textImage，且tvt_radius未设置有效 |
tvt_right_bottom_radius |
标签右下角圆角 | 2dp |
tvt_type为text、textImage，且tvt_radius未设置有效 |
tvt_padding |
标签内边距 |
tvt_type为text、textImage时有效 |
|
tvt_top_padding |
标签上内边距 | 0dp |
tvt_type为text、textImage，且tvt_padding未设置有效 |
tvt_right_padding |
标签右内边距 | 5dp |
tvt_type为text、textImage，且tvt_padding未设置有效 |
tvt_bottom_padding |
标签下内边距 | 0dp |
tvt_type为text、textImage，且tvt_padding未设置有效 |
tvt_left_padding |
标签左内边距 | 5dp |
tvt_type为text、textImage，且tvt_padding未设置有效 |
tvt_background_color |
标签背景颜色 | Color.GRAY |
tvt_type为text、textImage时有效 |
tvt_start_gradient_background_color |
标签渐变开始颜色 |
tvt_type为text、textImage时有效 |
|
tvt_end_gradient_background_color |
标签渐变结束颜色 |
tvt_type为text、textImage时有效 |
|
tvt_stroke_width |
标签边框宽度 |
tvt_type为text、textImage时有效 |
|
tvt_stroke_color |
标签边框颜色 | Color.GRAY |
tvt_type为text、textImage，且tvt_stroke_width>0有效 |
tvt_text_size |
文本字体大小 |
tvt_type为text、textImage有效 |
|
tvt_text_color |
文本字体颜色 | Color.WHITE |
tvt_type为text、textImage有效 |
tvt_width |
标签宽度 |
tvt_type为text、textImage有效 |
|
tvt_height |
标签高度 |
tvt_type为text、textImage有效 |
|
tvt_align |
标签与文本对其方式 | Align.CENTER | baseline-基线对其，center-中心对其，bottom-底部对其 |
tvt_text |
标签文本 |
tvt_type为text、textImage有效 |
|
tvt_image_resource |
标签图片 |
tvt_type为image、textImage有效 |
|
tvt_position |
标签显示位置 | 0 | 默认在文本最前面 |
tvt_margin_left |
标签距离左侧距离 | 0 | |
tvt_margin_right |
标签距离右侧距离 | 0 | |
tvt_text_margin_image |
文本与图片的距离 | 0dp |
tvt_type为textImage有效 |
tvt_layout |
自定义View标签 | 不设置tvt_type时有效 |
|
tvt_image_align_text |
图片与文字的位置关系 | Orientation.LEFT |
tvt_type为textImage有效，left-图片在文字的左边（默认），top-图片在文字上边，right-图片在文字的右边，bottom-图片在文字的下边 |
tvt_image_width |
图片的宽度 |
tvt_type为image、textImage时有效 |
|
tvt_image_height |
图片的高度 |
tvt_type为image、textImage时有效 |
更详细用法可参考Demo
Kotlin使用参考MainActivity文件
Java使用参考JavaActivity文件
如有问题欢迎留言 源码地址
网友评论