ArkUI - 自定义卡片样式
HarmonyOS API 9 没有提供原生的卡片样式,我定义了一个卡片样式,可以方便大家在日常开发中使用。
效果图:
卡片样式代码如下:
@Styles function card() {
.width('95%')
.padding(20)
.backgroundColor(Color.White)
.borderRadius(15)
.shadow({ radius: 6, color: '#1F000000', offsetX: 2, offsetY: 4 })
}
使用卡片样式:
@Entry
@Component
struct Test {
build() {
Column({ space: 10 }) {
Row() {
Text('卡片样式')
}
.card()
.margin({ top: 20, bottom: 10 })
.justifyContent(FlexAlign.SpaceEvenly)
}
.width('100%')
.height('100%')
.backgroundColor('#F1F2F3')
}
}