Android Compose颜色选择器

代码来自这里

/**
 * 颜色选择器
 */
@Composable
fun ColorPicker(onColorSelected: (Color) -> Unit) {
    val screenWidth = LocalConfiguration.current.screenWidthDp.dp
    val screenWidthInPx = with(LocalDensity.current) { screenWidth.toPx() }
    var activeColor by remember { mutableStateOf(Red) }

    val max = screenWidth - 16.dp
    val min = 0.dp
    val (minPx, maxPx) = with(LocalDensity.current) { min.toPx() to max.toPx() }
    val dragOffset = remember { mutableStateOf(0f) }
    Box(modifier = Modifier.padding(8.dp)) {
        //slider
        Spacer(
            modifier = Modifier
                .height(10.dp)
                .fillMaxWidth()
                .clip(RoundedCornerShape(4.dp))
                .background(brush = colorMapGradient(screenWidthInPx))
                .align(Alignment.Center)
                .pointerInput("painter") {
                    detectTapGestures { offset ->
                        dragOffset.value = offset.x
                        activeColor = getActiveColor(dragOffset.value, screenWidthInPx)
                        onColorSelected.invoke(activeColor)
                    }
                }
        )
        // draggable icon
        Icon(
            imageVector = Icons.Filled.FiberManualRecord,
            tint = activeColor,
            contentDescription = null,
            modifier = Modifier
                .offset { IntOffset(dragOffset.value.roundToInt(), 0) }
                .border(
                    border = BorderStroke(4.dp, MaterialTheme.colors.onSurface),
                    shape = CircleShape
                )
                .draggable(
                    orientation = Orientation.Horizontal,
                    state = rememberDraggableState { delta ->
                        val newValue = dragOffset.value + delta
                        dragOffset.value = newValue.coerceIn(minPx, maxPx)
                        activeColor = getActiveColor(dragOffset.value, screenWidthInPx)
                        onColorSelected.invoke(activeColor)
                    }
                )
        )
    }
}

fun colorMapGradient(screenWidthInPx: Float) = Brush.horizontalGradient(
    colors = createColorMap(),
    startX = 0f,
    endX = screenWidthInPx
)

fun createColorMap(): List<Color> {
    val colorList = mutableListOf<Color>()
    for (i in 0..360 step (10)) {
        val randomSaturation = 90 + Random.nextFloat() * 10
        val randomLightness = 50 + Random.nextFloat() * 10
        val hsv = AndroidColor.HSVToColor(
            floatArrayOf(
                i.toFloat(),
                randomSaturation,
                randomLightness
            )
        )
        colorList.add(Color(hsv))
    }

    return colorList
}

fun getActiveColor(dragPosition: Float, screenWidth: Float): Color {
    val hue = (dragPosition / screenWidth) * 360f
    val randomSaturation = 90 + Random.nextFloat() * 10
    val randomLightness = 50 + Random.nextFloat() * 10
    return Color(
        AndroidColor.HSVToColor(
            floatArrayOf(
                hue,
                randomSaturation,
                randomLightness
            )
        )
    )
}
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Android Compose 是一种全新的声明式 UI 工具包,用于构建 Android 应用程序用户界面。在 Android Compose 中,选择文件的功能可以通过使用 FilePicker 或 DocumentPicker API 实现。 要实现文件选择功能,首先需要在项目的 build.gradle 文件中加入以下依赖项: ```kotlin dependencies { // ... implementation "androidx.activity:activity-compose:1.3.1" } ``` 然后,在 Compose 组件中,可以使用带有回调函数的按钮来触发文件选择器的打开: ```kotlin import androidx.activity.compose.* import androidx.activity.result.contract.ActivityResultContracts @Composable fun FileChooserButton() { val openFileLauncher = rememberLauncherForActivityResult( contract = ActivityResultContracts.GetContent() ) { uri -> // 处理选择的文件 } Button( onClick = { openFileLauncher.launch("application/*") } ) { Text("选择文件") } } ``` 在上述代码中,我们使用了 `ActivityResultContracts.GetContent()` 启动器来打开文件选择器,并通过回调函数实现在选择文件后处理文件的逻辑。选择的文件可以通过 `uri` 参数进行进一步处理,例如读取文件内容、保存文件等操作。 需要注意的是,为了使用 `ActivityResultContracts.GetContent()` 启动器,需要进行相关权限的申请,并在 AndroidManifest.xml 文件中添加相应的权限声明。 总之,通过使用 Android Compose 和 ActivityResultContracts.GetContent() 启动器,我们可以实现选择文件的功能,使用户能够在应用程序中方便地浏览和选择他们所需的文件。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值