|
|
2019 年,华为发布了首款折叠屏手机,并在此之后陆续推出了多款折叠屏新品。( {: d/ b P; |7 p, X9 U
但在横折的大屏折叠屏手机上,屏幕存在 " 折叠 " 与 " 展开 " 两种状态的特性,让软件开发者在设计 UI 时,不可避免的会面临更大的挑战。
/ Z& x! B9 W* g6 v5 Y! w9 J近日,HarmonyOS 开发者官方发布技术分享,揭秘了华为在设计折叠屏应用时,为了确保用户持续体验的开发技巧。
+ V5 K$ v0 w+ ?) V5 C' V以阅读类场景为例,在场景从折叠(小屏)过渡到展开(大屏)的过程中,最为重要的就是将内容重排之后要定位到用户正在看的位置,保证焦点不发生偏移,提升用户的继续阅读体验。
$ b, Q- R9 a/ g
- L- K9 f, }% R" ]* `& N/ }1 \, E% ~+ `# f- ?9 L5 I6 n7 |! m9 C: o
0 u. Z- S# a0 k, W3 ~5 y6 E为此,开发者可以将页面上的不同元素进行拆解,并采用动态布局理念,针对不同元素的功能性单独设计展开后的变形效果,确保用户的浏览体验。
( M6 t$ h- f6 o如文本列表,就可以在展开态下右边加上一列,这样可以有效利用屏幕空间,也能多展示一些内容。 H" |. }; U; X; i2 |' T
) w. ?# Y! _1 M/ Z3 B% g" i s; z9 J
1 C. X1 Y/ x5 o$ N% S- k; \, g1 E" v3 z- x4 O% Q4 ^ b$ n# y
而上下图文则能够在保持图片高度不变的情况下延伸布局进而显示更多图片,或是将图片和文本通过挪移布局调整为左右布局显示。% z" ^) |; V1 z' c; n0 P. f
此外,针对视频浏览、视频通话等特殊场景,开发者也可以充分利用屏幕展开后更大的空间,为用户带来更具沉浸感的使用体验。; G1 S# w' j8 {9 L7 }; i$ r2 ^' T' r
* u* `: |& F. G. k! R
/ C6 R$ i' M8 G/ `$ X4 [1 e7 V/ _: ]/ `/ i) h4 \* }
整体来说,折叠屏应用开发的核心思路在于确保用户体验的连续性,此外还可以针对特殊应用的特殊需求,进行特定的 UI 调整,以提升用户的沉浸感。
- d/ D& U2 |9 m% D. [" ~; V) E
0 q6 m3 t' Z) V4 j4 g* T1 A$ f H |
本帖子中包含更多资源
您需要 登录 才可以下载或查看,没有账号?立即注册
×
|