鸿蒙NEXT的UI浅谈

查看 58|回复 3
作者:扶光与望舒   

   
此处只看鸿蒙next宣传片里展示的UI/UX的细节解析(未来发布后真正的UI效果可能和宣传片并不一致) 并结合我所了解的openharmony相关内容信息,以及开发者大会提到的信息作解析。
图1,当点击时会高亮发光,光会照亮周围的控件,如图1把超级终端、手电筒、旋转锁定、定位这几个控件的边缘给照亮了。
同理,图2的光条也把周围的控件边缘给照亮了。宣传片把这个叫做空间感,光场感(感觉有点轻拟物化)。
图3-图5,展现沉浸式小白条,同时底层导航栏实现实时毛玻璃效果。这是iOS一大优势,无需开发者实现,直接调用系统的原生组件即可。而在华为开发者大会中也提到过这一点,Openharmony已经可以实现实时的高斯模糊,并且在系统中原生内置了,一切都由系统统一渲染,不再需要开发者特别实现了,直接调用系统原生能力。因此,个人以为,除了系统应用的导航栏毛玻璃材质以及小白条沉浸,第三方应用也将轻易的实现这样的特性,未来将会类似iOS在第三方应用中也有如此效果,摆脱安卓中只有系统应用有如此效果。
图6同理,个人认为也是展示了轻易实现毛玻璃时间效果一个例子,即直接调用原生的毛玻璃材质即可,无需开发者手动来。像iOS锁屏的时间也有毛玻璃效果,其实它的开发中也只是调用一下API。其他啥都不用做。
图7和图8展示了在openharmony4.0中引入并原生支持的G2圆角(即ios7时引入的平滑圆角样式,安卓原生至今仍未引入此样式),现在在next中可以直接原生实现iOS的那种平滑圆角样式了,换掉了原来安卓原生那种普通的圆角样式。同理,现在第三方对于平滑圆角这种特殊圆角不在需要原来开发者手动编写了,直接调用即可。
图9则是有一个问题,这个dock栏似乎并没有毛玻璃材质效果,依旧还是原来的透明无模糊的效果,瑕疵。
图10则是开发者大会提到的,如果应用需要涉及多端,那只需在开发过程中按照设计规范开发代码,即可原生实现手机屏、折叠屏、平板电脑三种UI的自适应。
欢迎酷友们补充更多其他UI/UX细节,以及非UI/UX部分的内容。欢迎随时指正错误[yyds]









毛玻璃, 开发者, 效果

雪素霜   
这个演示做的挺粗糙的,感觉就是想展示一些系统能实现的UI效果,很多地方都弄的很随意,也不怎么协调。
雪素霜   
这个照亮的有点像 win10 的日历啊[笑哭]
雪素霜   
世界兜兜转转又回到拟物化了。[受虐滑稽]
您需要登录后才可以回帖 登录 | 立即注册

返回顶部