微信6.0版的一些设计细节

原文链接:http://qilei.org/2014/sweet-designs-in-weixin-6/

更新微信6.0已经有一周时间了
相信大部分人关心的是小视频功能,以及底部tab配色等显而易见的变化。

不过既然是大版本,还是有很多微小的变化耐人寻味。

顶部条新增毛玻璃效果

细心的人会发现6.0的顶部新增了一些iOS7中的半透毛玻璃效果(不知道安桌用户能否体会到 =,=)
这个效果让人非常舒心,一点渐变效果叠加到毛玻璃效果上,相比之前的纯色渐变
,科技感十足。

当然赞赏之余,对其实现方法也研究了一番,

首先是毛玻璃效果,这个github上比较多,(xcode6里直接新增了一种Visual Effect View,简单配置就有毛玻璃效果)。

第二个是,你会发现 中间部分的tableview(内容区)的frame其实是在y:64点开始的,为了紧贴顶部条。
平常情况下,tableview中的内容滚到frame外后会被溢出隐藏掉(类似css中的overflow:hidden),
如果被隐藏掉的话,顶部条就不能获取底下的内容实现毛玻璃效果。
这个时候只需要取消掉溢出隐藏属性就可以了。

方法很简单:在tableview 的属性面板上把一个叫Clip subviews 属性勾选取消掉就可以了。
使用代码,也是一句话。

//code
tableview.clipsToBounds = NO;

这个属性是当一个子视图超出父容器边界的时候就把溢出的部分隐藏掉的意思。(类似裁剪的概念)

字体变化

起初我也没发现,就是觉得字体好像不太一样。
知乎上也有人说,看人回复,好像是说字号变大了,所以看起来细了一些。

不过应该依然是自带的默认字体。

流畅了一点

我的iPhone4s 感受特别大,因为本身内存少的可怜,似乎这次6.0在内存优化上下足了功夫。

小视频的下拉背景

可能有些人发现了,就是激活小视频下拉的时候,那个背景是摄像头获取画面后毛玻璃效果后的画面。

这个东西一般人会觉得挺好看的

但从开发者的角度讲,这个不光好看,也优化了摄像头的加载停顿时间。
因为一般打开摄像头功能的时候会有一定时间的停顿(iPhone4s比较明显)

当你下拉到一定距离的时候就开始触发加载摄像头,让整个画面过渡很平滑,体验甚好。

右上角加号菜单少了一条

印象中是4条,现在成3条了,在一个软件越来越大的情况下做减法,很赞。
可能平常的产品经理的固化思维是觉得 新增东西都应该丢在加号里,因为它们是同一类功能。

不得不佩服张小龙的统治力,
估计他的要求是加号里的东西要控制在3条,其他的你们自己看。

于是 通过下拉来新增小视频的功能就诞生了。(重新定义了下拉只是刷新的这个动作。)

好了,其他的慢慢品位。

    原文作者:胡萝卜有点坑
    原文地址: https://segmentfault.com/a/1190000000713657
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞