HarmonyOS 如何实现Text从上往下滚动切换

HarmonyOS
2025-01-09 15:52:48
浏览
收藏 0
回答 1
回答 1
按赞同
/
按时间
shlp

参考示例如下:

const searchTextSwiper: string[] = [
  '眉笔',
  'openHarmonyOS',
  '笔记本',
  'HarmonyOS',
  '修眉刀'
]

@Entry
@Component
struct SearchSwiperPage {
  @State message: string = 'Hello World';

  build() {
    Row() {
      Column() {
        Row() {
          Image($r('app.media.ic_search'))
            .width(20)
            .height(20)
            .margin({
              left: 12,
              right: 8
            })
          Swiper() {
            ForEach(searchTextSwiper, (item: Resource) => {
              Column() {
                Text(item)
                  .fontSize(13)
                  .fontColor(Color.Black)
              }
              .alignItems(HorizontalAlign.Start)
            }, (item: Resource) => JSON.stringify(item))
          }
          .autoPlay(true)
          .loop(true)
          .vertical(true)
          .indicator(false)

        }
        .height(48)
        .width('94%')
        .borderRadius(20)
        .backgroundColor('#d1d2d3')
      }
      .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.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46.
  • 47.
  • 48.
  • 49.
  • 50.
分享
微博
QQ
微信
回复
2025-01-09 19:18:45


相关问题
Text文本过长时如何实现上下滚动
1572浏览 • 1回复 待解决
HarmonyOS 如何实现滚动渐变效果?
1043浏览 • 1回复 待解决
如何实现嵌套滚动技术
2034浏览 • 1回复 待解决
HarmonyOS text组件如何实现部分圆角
706浏览 • 1回复 待解决
自适应页面滚动如何实现
1263浏览 • 1回复 待解决
Text如何实现删除线的功能?
2216浏览 • 1回复 待解决
HarmonyOS 小窗下如何实现横竖屏切换
958浏览 • 1回复 待解决
如何HarmonyOS实现动态主题切换
988浏览 • 0回复 待解决
HarmonyOS 如何实现应用内的语言切换
1002浏览 • 1回复 待解决
HarmonyOS Text文本描边实现
761浏览 • 1回复 待解决