HarmonyOS 自定义Refresh头部展示不全

使用如下代码,自定义Refresh组件的头部,但是实现后展示不全。请问该怎么解决?

@Builder
customRefreshComponent()
{
  Stack()
  {
    Column() {
      Image($r('app.media.bg_ya_header')).width('60%').margin(HomePageConstants.REFRESH_HEADER_BOTTOM_MARGIN)
      Row()
      {
        LoadingProgress().height(32)
        Text("正在刷新...").fontSize(16).margin({left:20})
      }.margin(HomePageConstants.REFRESH_HEADER_BOTTOM_MARGIN)
      .alignItems(VerticalAlign.Center)
    }.width(HomePageConstants.FULL_WIDTH)
    .alignItems(HorizontalAlign.Center)
  }.width(HomePageConstants.FULL_WIDTH).align(Alignment.Bottom)
}
HarmonyOS
23h前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
fox280

在api12中可以设置refreshOffset属性去更改头部高度值,但是在Api11及以下没有设置高度属性。

@Entry
@Component
struct RefreshExample {
  @State isRefreshing: boolean = false
  @State arr: String[] = ['0', '1', '2', '3', '4']
  @Builder
  customRefreshComponent()
  {
    Stack()
    {
      Column() {
        Image($r('app.media.bgImage')).width('100%').margin(15)
        Row()
        {
          LoadingProgress().height(32)
          Text("正在刷新...").fontSize(16).margin({left:20})
        }
        .alignItems(VerticalAlign.Center)
      }.width('100%')
      .alignItems(HorizontalAlign.Center)
    }.width('100%').align(Alignment.Center)
  }
  build() {
    Column() {
      Refresh({ refreshing: $$this.isRefreshing,builder:this.customRefreshComponent()}) {
        List() {
          ForEach(this.arr, (item: string) => {
            ListItem() {
              Text('' + item)
                .width('100%').height(100).fontSize(16)
                .textAlign(TextAlign.Center).borderRadius(10).backgroundColor(0xFFFFFF)
            }
          }, (item: string) => item)
        }
        .onScrollIndex((first: number) => {
          console.info(first.toString())
        })
        .width('100%')
        .height('100%')
        .scrollBar(BarState.Off)
        .backgroundColor(Color.Gray)
      }
      .refreshOffset(120)
      .pullToRefresh(true)
      .onStateChange((refreshStatus: RefreshStatus) => {
        console.info('Refresh onStatueChange state is ' + refreshStatus)
      })
      .onRefreshing(() => {
        setTimeout(() => {
          this.isRefreshing = false
        }, 2000)
        console.log('onRefreshing test')
      })
      .backgroundColor(0x89CFF0)
    }
  }
}

参考文档:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-container-refresh-V5#refreshoffset12

分享
微博
QQ
微信
回复
21h前
相关问题
HarmonyOS Refresh自定义刷新样式
46浏览 • 1回复 待解决
refresh期望能够自定义loading动画
1008浏览 • 1回复 待解决
HarmonyOS 自定义相机拍照后数据展示
818浏览 • 1回复 待解决
HarmonyOS 键盘导致webview展示不全
43浏览 • 1回复 待解决
HarmonyOS List展示不全的问题
381浏览 • 1回复 待解决
自定义弹窗自定义转场动画
1179浏览 • 1回复 待解决
HarmonyOS 定义自定义组件
75浏览 • 1回复 待解决
HarmonyOS 自定义键盘
289浏览 • 1回复 待解决
HarmonyOS 自定义Slider
37浏览 • 1回复 待解决
HarmonyOS 自定义UA
43浏览 • 1回复 待解决
HarmonyOS 使用自定义字体
268浏览 • 1回复 待解决
HarmonyOS 自定义控件实现
33浏览 • 1回复 待解决
HarmonyOS 如何自定义相机
29浏览 • 1回复 待解决