HarmonyOS 鸿蒙Next中求一个加载中组件

HarmonyOS 鸿蒙Next中求一个加载中组件 在组件库中只找到了滑块组件,我想知道等待过程中的加载中组件有没有可以直接用的,文档在哪里?

4 回复

可以使用组件 LoadingProgress 用于显示加载动效的组件

  LoadingProgress()
        .color(Color.Blue)
        .layoutWeight(1)

更多关于HarmonyOS 鸿蒙Next中求一个加载中组件的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


鸿蒙 ArkUI 框架自带了 Progress 组件,这是最基础的加载指示器,通常用于表示进度或单纯的加载状态。

在HarmonyOS Next中,使用ArkUI声明式UI,加载中组件可直接使用系统提供的LoadingProgress。示例:

@Entry
@Component
struct LoadingPage {
  build() {
    Column() {
      LoadingProgress()
        .width(50)
        .height(50)
        .color(Color.Blue)
    }
    .width('100%')
    .height('100%')
    .justifyContent(FlexAlign.Center)
    .alignItems(HorizontalAlign.Center)
  }
}

在HarmonyOS Next中可直接使用系统提供的LoadingProgress组件,用于展示加载中状态。它支持三种样式:菊花转(默认)、环形进度条和条形进度条,可通过style属性设置。

文档位置:官方API参考 → 组件 → 基础组件 → LoadingProgress。

简单用法示例:

// 默认菊花转样式
LoadingProgress()
  .width(36)
  .height(36)
  .color(Color.Blue)

// 环形进度条
LoadingProgress({ style: LoadingProgressStyle.Ring })
  .value(0.6) // 进度值0~1
  .width(60)
  .height(60)

// 条形进度条
LoadingProgress({ style: LoadingProgressStyle.Linear })
  .value(0.8)
  .width(200)
回到顶部