鸿蒙开发之ArkUI 界面篇 十六 高仿得物列表
首先要深入分下,列表两端是紧贴着边缘的,左边是两行Text,垂直方向布局,右侧是两个Image,水平布局,两端是水平的,使用Row容器。Text('签到礼物|超多大奖 超好玩').fontColor(Color.Black)鸿蒙高仿得物列表,一个小小的综合案列,效果如图。Text('玩一玩')
·
鸿蒙高仿得物列表,一个小小的综合案列,效果如图。

首先要深入分下,列表两端是紧贴着边缘的,左边是两行Text,垂直方向布局,右侧是两个Image,水平布局,两端是水平的,使用Row容器。完整代码如下:
@Entry
@Component
struct IndexTest {
@State message: string = 'IndexTest';
build() {
Row(){
Column(){
Text('玩一玩')
.fontWeight(770)
.fontSize(25)
.fontColor(Color.Black)
Text('签到礼物|超多大奖 超好玩').fontColor(Color.Black)
}.alignItems(HorizontalAlign.Start)
.justifyContent(FlexAlign.SpaceBetween)
.padding({
left:15,
top:10,
bottom:10
}).height(80)
Row(){
Image($r('app.media.tree'))
.height(80)
.width(40)
Image($r('app.media.ic_arrow_right'))
.fillColor('#999')
.height(80)
.width(40)
}.padding({
right:15
})
}
.width('100%')
.height(80)
.backgroundColor('#ccc')
.justifyContent(FlexAlign.SpaceBetween)
}
}
更多推荐


所有评论(0)