Skip to content

Time

Jump to bottom
Junerver Hou edited this page Jul 21, 2025 · 1 revision

useDateFormat

useDateFormat 钩子提供了一种灵活的方式来格式化日期和时间，灵感来源于 dayjs。

基本用法

// 基本用法，使用默认格式
val formattedDate = useDateFormat()
Text(text = formattedDate.value) // 默认格式：HH:mm:ss

// 使用自定义格式
val customFormattedDate = useDateFormat(
    date = Clock.System.now(),
    formatStr = "YYYY年MM月DD日 HH:mm:ss"
)
Text(text = customFormattedDate.value)

格式令牌

支持多种格式令牌，例如：

// 使用不同的格式令牌
val dateFormatter = useDateFormat(formatStr = "YYYY-MM-DD")
val timeFormatter = useDateFormat(formatStr = "HH:mm:ss")
val fullFormatter = useDateFormat(formatStr = "YYYY-MM-DD HH:mm:ss.SSS")

可用的格式令牌包括：

  • YYYY: 四位数年份 (2018)
  • YY: 两位数年份 (18)
  • Yo: 序数格式的年份 (2018th)
  • MMMM: 完整月份名称 (January-December)
  • MMM: 缩写月份名称 (Jan-Dec)
  • MM: 两位数月份 (01-12)
  • M: 月份 (1-12)
  • DD: 两位数日期 (01-31)
  • D: 日期 (1-31)
  • dddd: 星期的完整名称 (Sunday-Saturday)
  • ddd: 星期的缩写名称 (Sun-Sat)
  • dd: 星期的最小名称 (中文环境下为"周日"、"周一"等，英文环境下为首字母如"S"、"M")
  • d: 星期几 (0-6，周日为0)
  • 更多格式请参考代码文档

本地化支持

// 使用中文本地化
val chineseFormatter = useDateFormat(
    formatStr = "YYYY年MM月DD日 dddd",
    optionsOf = {
        locale = "zh-CN"
    }
)

// 使用英文本地化
val englishFormatter = useDateFormat(
    formatStr = "dddd, MMMM DD YYYY",
    optionsOf = {
        locale = "en-US"
    }
)

useInterval

useInterval 钩子用于处理定时器，可以在指定的时间间隔内重复执行函数。

基本用法

// 基本用法，每秒执行一次
useInterval(1.seconds) {
    // 这里的代码每秒执行一次
    count++
}

手动控制

// 获取控制函数
val (isActive, clear, resume) = useInterval(1.seconds) {
    // 定时执行的代码
    count++
}

// 使用控制函数
TButton(text = "暂停", enabled = isActive.value) {
    clear()
}

TButton(text = "恢复", enabled = !isActive.value) {
    resume()
}

就绪状态控制

// 使用就绪状态控制定时器
val (count, setCount) = useState(0)
val ready = count < 10 // 当计数小于10时，定时器处于就绪状态

useInterval(1.seconds, ready) {
    setCount(count + 1)
}

useNow

useNow 钩子返回当前日期时间，并可以按指定间隔自动更新。

基本用法

// 使用默认配置，每秒更新一次
val now by useNow()

// 显示当前时间
Text(text = now) // 默认格式：yyyy-MM-dd HH:mm:ss

自定义格式

// 使用自定义中文日期格式
val customTime by useNow(
    optionsOf = {
        format = {
            it.tsMs
                .toLocalDateTime()
                .format(
                    LocalDateTime.Format {
                        year()
                        chars("年")
                        monthNumber()
                        chars("月")
                        day(padding = Padding.ZERO)
                        chars("日")
                        dayOfWeek(DayOfWeekNames.CHINESE_FULL)
                    },
                )
        }
    },
)

更新间隔控制

// 自定义更新间隔，每5秒更新一次
val slowUpdatingTime by useNow(
    optionsOf = {
        interval = 5.seconds
    }
)

useTimeAgo

useTimeAgo 钩子用于将时间点转换为相对时间描述（例如"3分钟前"），并自动更新。

基本用法

// 跟踪文本最后修改时间
val lastChange by useLastChanged(text)
val timeAgo by useTimeAgo(lastChange) {
    messages = DefaultEnglishTimeAgoMessages
    updateInterval = 1.seconds // 每秒更新一次
}

// 显示相对时间
Text(text = "Last changed: $timeAgo")

多语言支持

// 使用中文消息
val chineseTimeAgo by useTimeAgo(timestamp) {
    messages = DefaultChineseTimeAgoMessages
}

// 使用英文消息
val englishTimeAgo by useTimeAgo(timestamp) {
    messages = DefaultEnglishTimeAgoMessages
}

useTimeout

useTimeout 钩子用于在指定延迟后执行一次函数。

基本用法

// 3秒后执行
useTimeout(3.seconds) {
    setText("Done")
}

useTimeoutFn

useTimeoutFn 钩子提供了更多控制选项的超时函数执行。

基本用法

// 获取控制函数
val (isPending, start, stop) = useTimeoutFn(fn = {
    setText("Done")
}, 3.seconds)

// 使用控制函数
TButton(text = "Restart", enabled = !isPending.value) {
    reset()
    start()
}

TButton(text = "Stop", enabled = isPending.value) {
    stop()
}

useTimeoutPoll

useTimeoutPoll 钩子用于实现轮询功能，在上一次任务完成后触发下一次执行。

基本用法

// 基本用法，每2秒轮询一次
useTimeoutPoll(
    fn = {
        // 模拟异步操作
        delay(500)
        count++
    },
    interval = 2.seconds,
    immediate = true, // 立即开始第一次轮询
)

控制轮询

// 获取控制函数
val timeoutPoll = useTimeoutPoll(
    fn = {
        // 模拟异步操作
        delay(800)
        pollCount++
        lastPollTime = getCurrentTimeString()
    },
    interval = 3.seconds,
    optionsOf = {
        immediate = false // 不立即开始
        immediateCallback = true // 恢复时立即执行回调
    },
)

// 使用控制函数
TButton(text = "Start Polling", enabled = !timeoutPoll.isActive.value) {
    timeoutPoll.start()
}

TButton(text = "Stop Polling", enabled = timeoutPoll.isActive.value) {
    timeoutPoll.stop()
}

useTimestamp

useTimestamp 钩子返回当前时间戳作为响应式状态。

基本用法

// 获取时间戳和控制函数
val (timestamp, pause, resume, isActive) = useTimestamp(
    optionsOf = {
        interval = 1.seconds
        callback = {
            println("Current timestamp: $it")
        }
    },
)

// 显示时间戳
Text(text = "Current timestamp: ${timestamp.value}")

// 控制时间戳更新
TButton(text = "pause", enabled = isActive.value) {
    pause()
}

TButton(text = "resume", enabled = !isActive.value) {
    resume()
}

使用引用类型

// 使用引用类型的时间戳
val (timestamp, _, resume) = useTimestampRef(
    optionsOf = {
        interval = 1.seconds
    },
)

// 启动时间戳更新
resume()

// 显示时间戳
Text(text = "Current timestamp: ${timestamp.current}")

// 访问当前时间戳
TButton(text = "Show timestamp") {
    println("${timestamp.current}")
}

Clone this wiki locally