此功能利用swiper实现,步骤较为简单,直接贴代码 注:Swiper组件内容也可以用LazyForEach进行优化
@Preview
@Component
export struct HotSearchView {
build() {
Row({ space: 5 }) {
Image($r('app.media.icon_search')).height(12).width(12).fillColor(Color.Black)
Swiper() {
Repeat<string>(searchList).each((item) => {
Text(item.item)
.fontSize(12).fontColor(Color.Gray).margin({ left: 5 })
})
}
.width("80%")
.autoPlay(true)
.vertical(true)
.indicator(false)
.interval(1500)
}
.padding({ left: 15, right: 15 })
.height(40)
.borderRadius(20)
.backgroundColor("#f8f4f4")
}
}
export const searchList: string[] = [
'深水炸弹', '天地龙鳞', '归去来兮', '塞北江南', 'Mamma voglio anchio la '
]