如何实现渐变的圆角边框

@Entry 
@Component 
struct Index { 
  build() { 
    Row() { 
      Column() { 
        Column({ space: 5 }) { 
          Text('linearGradient').fontSize(12).width('90%').fontColor(0xCCCCCC) 
          Row(){ 
            Text('This is gradient color.') 
              .textAlign(TextAlign.Center) 
              .width('96%') 
              .height('80%') 
              .borderRadius(30) 
              .linearGradient({ 
                direction: GradientDirection.Left, // 渐变方向 
                repeating: true, // 渐变颜色是否重复 
                colors: [[0xDCDCDC, 0.0],  [0xFFFFFF, 1.0]] // 数组末尾元素占比小于1时满足重复着色效果 
              }) 
          } 
            .width('90%') 
            .height(60) 
            .borderRadius(30) 
            .linearGradient({ 
              angle: 90, 
              colors: [[0x87CEEB, 0.0], [0x2E8B57, 1.0]] 
            }) 
          .justifyContent(FlexAlign.Center) 
        } 
      } 
      .width('100%') 
    } 
    .height('100%') 
  } 
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.