首页 > 建站教程 > APP开发,混合APP >  鸿蒙next arkts卡片定点更新实现代码正文

鸿蒙next arkts卡片定点更新实现代码

鸿蒙next arkts卡片定点更新实现的具体代码如下:

1、首先开启自动更新,设置定点更新的时间

找到 项目根目录\entry\src\main\resources\base\profile\form_config.json下:

{
  "forms": [
    {
      "updateEnabled": true,
      "scheduledUpdateTime": "08:30"
    }
  ]
}


2、在卡片入口文件,EntryFormAbility.ets的onUpdateForm生命周期发送更新数据:

onUpdateForm(formId: string) {
  let param: Record<string, string> = {
    'title': '更新'+Math.random(),
    'description': '这是更新的描述2222'
  }
  let paramData = formBindingData.createFormBindingData(param)
  // 通知卡片刷新
  formProvider.updateForm(formId, paramData)
}


3、在卡片布局文件(入口文件)接收数据并渲染到视图中:

let localStorage = new LocalStorage()
@Entry(localStorage)
@Component
struct Widget1Card {
  // 接收定点更新发送过来的数据
  @LocalStorageProp('title') title:string = '默认标题'
  @LocalStorageProp('description') description:string = '默认内容'
  build() {
    FormLink({
      action: 'router',
      abilityName: 'EntryAbility',
      params: {
        message: {
          id: '1111111'
        }
      }
    }) {
      Column() {
        Image($r('app.media.card_logo'))
          .width('44%')
          .height('44%')
          .borderRadius(10)
          .margin({
            bottom: '17%'
          })
        // 渲染内容
        Text(this.title)
          .fontSize(16)
          .fontColor('#0a1018')
          .maxLines(1)
          .textOverflow({
            overflow: TextOverflow.Ellipsis
          })
        // 渲染内容
        Text(this.description)
          .fontSize(11)
          .fontColor('#7c8f9a')
          .margin({
            top: '4%'
          })
          .maxLines(1)
          .textOverflow({
            overflow: TextOverflow.Ellipsis
          })
      }
      .backgroundImage($r('app.media.card_bg'))
      .backgroundImageSize(ImageSize.Contain)
      .alignItems(HorizontalAlign.Start)
      .padding({
        left: '8%',
        top: '8%'
      })
      .height('100%')
      .width('100%')
    }
  }
}