鸿蒙卡片交互与数据更新

1. 卡片交互机制

1.1 事件类型

  • router事件:跳转到应用指定页面

    php 复制代码
    FormLink({
      action: 'router',
      abilityName: 'EntryAbility',
      params: { 'target': 'detail' }
    }) {
      // 卡片内容
    }
  • message事件:发送消息不跳转

    kotlin 复制代码
    postCardAction(this, {
      'action': 'message',
      'params': { 'cmd': 'refresh' }
    });

1.2 交互原则

  • 热区设计:单个卡片建议不超过3个可点击区域
  • 防冲突:避免使用长按(系统保留用于卡片管理)
  • 反馈明确:点击后应有视觉反馈(如颜色变化)

2. 数据更新机制

2.1 刷新类型

类型 触发方式 应用场景
定时刷新 updateDuration配置 股票行情(每30分钟)
定点刷新 scheduledUpdateTime配置 天气卡片(每天08:00)
主动刷新 FormProvider.updateForm() 用户交互触发(如点赞)
代理刷新 数据订阅机制 低功耗场景(如锁屏卡片)

2.2 FormProvider核心API

typescript 复制代码
import formProvider from '@ohos.app.form.formProvider';
​
// 更新卡片数据
formProvider.updateForm(formId, formBindingData.createFormBindingData(newData))
  .then(() => console.log('Update success'))
  .catch(error => console.error(`Update failed: ${error.code}`));
​
// 设置下次刷新时间
formProvider.setFormNextRefreshTime(formId, 10);  // 10分钟后刷新

3. 数据同步策略

3.1 进程间通信

  • 应用主进程与卡片进程通过LocalStorage共享数据
  • 使用数据库持久化存储卡片状态(如SQLite)

3.2 多实例管理

当添加多个相同卡片实例时:

javascript 复制代码
// 在onAddForm中区分实例
onAddForm(want: Want) {
  const instanceId = want.parameters[formInfo.FormParam.IDENTITY_KEY];
  // 为不同实例存储独立数据
}

4. 实时性优化

  • 批量更新:合并短时间内多次updateForm调用
  • 增量更新:仅传输变化字段(如仅更新温度数值)
  • 缓存策略:使用FormProvider.setFormNextRefreshTime减少刷新次数

5. 典型场景实现

5.1 天气卡片定时刷新

json 复制代码
// form_config.json
{
  "updateEnabled": true,
  "scheduledUpdateTime": "08:00",
  "updateDuration": 4  // 每2小时刷新(4*30分钟)
}

5.2 音乐卡片播放状态同步

typescript 复制代码
// 应用侧更新卡片播放状态
updatePlayStatus(isPlaying: boolean) {
  const formData = { isPlaying, songName: currentSong.name };
  formProvider.updateForm(formId, formBindingData.createFormBindingData(formData));
}

5.3 新闻卡片下拉刷新

csharp 复制代码
// 卡片页面添加刷新按钮事件
async refreshNews() {
  this.isRefreshing = true;
  await fetchLatestNews();  // 获取最新数据
  formProvider.updateForm(this.formId, newData);
  this.isRefreshing = false;
}

6. 常见问题处理

  • 数据不一致:在onCastToNormal中持久化临时卡片数据
  • 刷新失败:检查formId有效性(使用getFormsInfo()验证)
  • 性能问题:避免在onUpdate中执行耗时操作(建议<100ms)

鸿蒙开发学习

相关推荐
chensi_074 小时前
uniapp x鸿蒙开发之运行到鸿蒙模拟器
华为·uni-app·harmonyos
Devil枫5 小时前
鸿蒙后台定时任务实战
华为·harmonyos
猫林老师8 小时前
HarmonyOS 5响应式布局在多设备适配中的应用
华为·harmonyos
2501_919749038 小时前
鸿蒙:使用bindPopup实现气泡弹窗
华为·harmonyos
鸿蒙小白龙10 小时前
openharmony之充电空闲状态定制开发
harmonyos·鸿蒙·鸿蒙系统·open harmony
万少11 小时前
十行代码 带你极速接入鸿蒙6新特性 - 应用内打分评价
前端·harmonyos
LL_Z12 小时前
async/await
harmonyos
科技快报13 小时前
全新尚界H5凭借HUAWEI XMC数字底盘引擎技术,让湿滑路面也“稳”操胜券
华为·harmonyos
猫林老师13 小时前
实战:基于HarmonyOS 5构建分布式聊天通讯应用
分布式·wpf·harmonyos
2501_9197490316 小时前
鸿蒙:使用animation或animateTo实现图片无限旋转效果
华为·harmonyos