HarmonyOS 环形进度条使用自定义图片？

Question

环形进度条能否使用自定义图片，progress组件和circle组件都没看到能使用自定义图片的参数，如图

Answer 1

Progress是进度条组件，但是没有办法自定义图片。

可以通过组件的overlay()属性，将自定义图片组件，浮在Progress中间。

https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-universal-attributes-overlay-V5

您参考一下

@Entry
@Component
struct ProgressRing {
  @State message: string = 'Hello World';
  private Linear_gradientColor: LinearGradient = new LinearGradient([{color:Color.Red,offset:0.5},{color:Color.Yellow,offset:1.5}])
  @Builder OverlayNode() {
    Column() {
          Progress({ value: 100, type: ProgressType.Ring }).width(100)
            .color(this.Linear_gradientColor)
    }.width(100).height(100).alignItems(HorizontalAlign.Center)
  }
  build() {
    Column() {
      Image($r('app.media.app_icon'))
        .width(100).height(100)
        .overlay(this.OverlayNode(), { align: Alignment.Center })
        .objectFit(ImageFit.Contain)
    }.width('100%')
  }
}