Compose UI 组件封装——水平/垂直、虚线/实现的使用(一)

前言

How To

Step 1. Add the JitPack repository to your build file

gradle

groovy 复制代码

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

gradle.kts

kotlin 复制代码

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

Step 2. Add the dependency

groovy 复制代码

dependencies {
    implementation("com.github.Peakmain:ComposeUI:+")
}

1. 展示组件

1.1. 分割线

1.1.1. PkDivider分割线

1.1.1.1. 介绍

支持设置水平/垂直虚线或实线分割线
PkDashDivider(虚线)和 PkFullDivider(实线)整合类

1.1.1.2. 导入依赖

arduino 复制代码

import com.peakmain.compose.ui.divier.PkDivider

1.1.1.3. 参数

参数名	参数类型	说明
modifier	Modifier	用于添加额外修饰符的 Modifier。
color	Color	分隔线的颜色，默认为 0xFFF1EFE9。
height	Dp	分隔线的高度，仅在垂直分隔线生效，默认为 28.dp。
thickness	Dp	分隔线的厚度，仅在非虚线时生效，默认为 1.dp。
startIndent	Dp	分隔线的起始缩进，仅在非虚线时生效，默认为 0.dp。
isHorizontal	Boolean	是否为水平分隔线，默认为 false。
isDash	Boolean	是否绘制虚线分隔线，默认为 false。
strokeWidth	Dp	虚线的宽度，仅在绘制虚线时生效，默认为 0.5.dp。
dashLength	Dp	虚线的线段长度，仅在绘制虚线时生效，默认为 2.dp。
gapLength	Dp	虚线的间隔长度，仅在绘制虚线时生效，默认为 2.dp。

1.1.1.4. 示例代码

scss 复制代码

//默认垂直实线
PkDivider()
//水平实线
PkDivider(modifier = Modifier.padding(top = 10.dp), isHorizontal = true)
//垂直虚线
PkDivider(isDash=true)
//水平虚线
PkDivider(modifier = Modifier.padding(top = 10.dp), isHorizontal = true, isDash = true)

1.1.2. PkFullDivider实线分割线

1.1.2.1. 介绍

创建一个水平/垂直实线分隔线组件

1.1.2.2. 导入依赖

arduino 复制代码

import com.peakmain.compose.ui.divier.PkFullDivider

1.1.2.3. 参数

参数名	参数类型	说明
modifier	Modifier	用于添加额外修饰符的 Modifier。
color	Color	分隔线的颜色，默认为 0xFFF1EFE9。
height	Dp	分隔线的高度，垂直方向生效默认为 28.dp。
thickness	Dp	分隔线的厚度，默认为 1.dp。
startIndent	Dp	分隔线的起始缩进，默认为 0.dp。
isHorizontal	Boolean	水平分割线 (true)/ 垂直分割线 (false)，默认是 false

1.1.2.4. 示例代码

ini 复制代码

PkFullDivider(modifier = Modifier.padding(top = 10.dp), isHorizontal = true)

1.1.3. PkDashDivider虚线分割线

1.1.3.1. 介绍

创建一个水平/垂直虚线分隔线组件

1.1.3.2. 导入依赖

arduino 复制代码

import com.peakmain.compose.ui.divier.PkDashDivider

1.1.3.3. 参数

参数名	参数类型	说明
modifier	Modifier	用于添加额外修饰符的 Modifier。
color	Color	分隔线的颜色，默认为 0xFFF1EFE9。
height	Dp	分隔线的高度，垂直方向生效，默认为 28.dp。
strokeWidth	Dp	虚线的宽度，默认为 0.5.dp。
dashLength	Dp	虚线的长度，默认为 2.dp。
gapLength	Dp	虚线之间的间隔长度，默认为 2.dp。
isHorizontal	Boolean	水平分割线 (true)/ 垂直分割线 (false)，默认是 false

1.1.3.4. 示例代码

ini 复制代码

 PkDashDivider(modifier = Modifier.padding(top = 10.dp), isHorizontal = true)

2. 扩展类

2.1. List扩展类

2.1.1. 介绍

可空List的扩展类，作用如下

可空List的大小
可空List的大小是否大于0
可空List大小是否为0

2.1.2. 导入依赖

arduino 复制代码

import com.peakmain.compose.ext.orSize

2.1.3. 方法

方法名	返回值	说明
orSize	Int	获取 List 的大小。若 List 为 null，则返回 0；若 List 不为 null，则返回其 size。
sizeBigZero	Boolean	判断 List 大小是否大于 0。若 List 为 null，则返回 false；若 List 不为 null，则判断其大小是否大于 0。
sizeEqualZero	Boolean	判断 List 的大小是否为 0。若 List 为 null，则返回 true；若 List 不为 null，则判断其大小是否等于 0。

2.1.4. 示例代码

csharp 复制代码

params?.imageList.orSize() > 0
params?.imageList.sizeBigZero()

3. 工具类

3.1. ImagePainterUtils工具类

3.1.1. 介绍

根据图片 URL 获取 AsyncImagePainter 对象

3.1.2. 导入依赖

arduino 复制代码

import com.peakmain.compose.utils.ImagePainterUtils

3.1.3. 参数

参数名	参数类型	说明
imageUrl	String	图片的 URL，如果为空则显示占位图。
errorDrawableResId	Int	图片加载失败时显示的 Drawable 资源 ID，默认为 R.drawable.icon_loading。
placeDrawableResId	Int	图片加载过程中显示的占位图 Drawable 资源 ID，默认为 R.drawable.icon_loading。

3.1.4. 示例代码

ini 复制代码

Image(
    painter = ImagePainterUtils.getPainter(it.imageUrl),
    contentDescription = null,
    modifier = Modifier
        .clip(RoundedCornerShape(8.dp))
        .weight(1f)
        .height(75.dp),
    contentScale = ContentScale.Crop
)