it之家 6 月 19 日消息,在 6 月 11 日舉行的華為 pura 80 系列及全場景新品發布會上,華為全新實況窗正式亮相,號稱「無需打開應用狀態一眼便知」。
it之家注意到,華為開發者聯盟官網現發布了新版實況窗通用膠囊模板。據介紹,新版實況窗擁有三種設備樣式,將在挖孔居中的設備上進行軟硬結合的顯示,與狀態欄固定元素(時間、信號、電池等)共存,產生聯動與擠壓。膠囊內需顯示最精簡、最重要的內容,保證用戶一瞥即得。
華為鴻蒙 harmonyos next 系統新版實況窗通用膠囊模板細節如下:
實況膠囊類型
膠囊與居中挖孔的設備軟硬結合居中展示,在側邊挖孔或無孔場景下則居左展示。
通用膠囊組成元素
- 膠囊:由系統提供默認黑色微漸變 / 純黑透明度樣式(#000000),根據場景自適應
- 圖標:用於表示業務來源,需傳入業務定製圖標或應用 logo,提升膠囊的易讀性和辨識度
- 文本:支持傳入 1-2 段文本內容,盡量精簡避免冗餘和超長跑馬燈;顏色為#ffffff,不支持定製
圖標規則
1、為確保膠囊一致性及美觀性,系統將裁切圖標形成同心圓效果,具體資源要求及裁切效果如下:
- 矢量圖標資源:需預留裁切安全邊距,避免出現關鍵圖形被裁切;
- 應用圖標:不預留額外邊距,保證完整填充,避免裁切出成多邊形
2、默認將傳入的品牌色生成圓形底板置於圖標下方,如有其他色彩展示訴求,需導出在圖標資源中。
文本布局規則
單文本時,圖標單獨顯示在左側,文本單獨顯示在右側;雙文本時,圖標和主文本顯示在左側,副文本顯示在右側。
為確保膠囊整體美觀性、信息效率等綜合體驗:
- 建議接入雙文本
- 建議將單段超長文本拆解為雙文本
跑馬燈規則
- 為避免兩端文本同時跑馬造成使用困擾,僅支持膠囊右側文本跑馬燈
- 雙文本時若主文本過長,有概率無機會完整顯示;副文本超長則支持跑馬燈兩遍
- 綜上所述:推薦主文本精簡 + 副文本較長的字元組合方式,注意避免文本超長