华为鸿蒙 HarmonyOS NEXT 系统新版实况窗通用胶囊模板发布

it之家 6 月 19 日消息,在 6 月 11 日举行的华为 pura 80 系列及全场景新品发布会上,华为全新实况窗正式亮相,号称“无需打开应用状态一眼便知”。

it之家注意到,华为开发者联盟官网现发布了新版实况窗通用胶囊模板。据介绍,新版实况窗拥有三种设备样式,将在挖孔居中的设备上进行软硬结合的显示,与状态栏固定元素(时间、信号、电池等)共存,产生联动与挤压。胶囊内需显示最精简、最重要的内容,保证用户一瞥即得。

▲ 图源:华为官网 | pura 80 ultra 手机 ai 防窥保护,顶部为新版实况窗

华为鸿蒙 harmonyos next 系统新版实况窗通用胶囊模板细节如下:

实况胶囊类型

胶囊与居中挖孔的设备软硬结合居中展示,在侧边挖孔或无孔场景下则居左展示

通用胶囊组成元素

  • 胶囊:由系统提供默认黑色微渐变 / 纯黑透明度样式(#000000),根据场景自适应
  • 图标:用于表示业务来源,需传入业务定制图标或应用 logo,提升胶囊的易读性和辨识度
  • 文本:支持传入 1-2 段文本内容,尽量精简避免冗余和超长跑马灯;颜色为#ffffff,不支持定制

图标规则

1、为确保胶囊一致性及美观性,系统将裁切图标形成同心圆效果,具体资源要求及裁切效果如下:

  • 矢量图标资源:需预留裁切安全边距,避免出现关键图形被裁切;
  • 应用图标:不预留额外边距,保证完整填充,避免裁切出成多边形

2、默认将传入的品牌色生成圆形底板置于图标下方,如有其他色彩展示诉求,需导出在图标资源中。

文本布局规则

单文本时,图标单独显示在左侧,文本单独显示在右侧;双文本时,图标和主文本显示在左侧,副文本显示在右侧

为确保胶囊整体美观性、信息效率等综合体验:

  • 建议接入双文本
  • 建议将单段超长文本拆解为双文本

跑马灯规则

  • 为避免两端文本同时跑马造成使用困扰,仅支持胶囊右侧文本跑马灯
  • 双文本时若主文本过长,有概率无机会完整显示;副文本超长则支持跑马灯两遍
  • 综上所述:推荐主文本精简 + 副文本较长的字符组合方式,注意避免文本超长