android 类的设计,Android App的类响应式设计

导言

根据google的官方显示Android 4.0以上的设备已经有34.2%,由于国内很多的手机都没机会用上google play市场,所以国内市场的情况,得看类似于友盟的季度报告才知道了。个人觉得,Android 4.0以后设备才能有让人用的欲望,之前的版本受限于硬件,和系统的优化程度,个人觉得,除了打个电话、收个短信、看个微博、上个QQ以外,也没多大让人使用的价值了,至于原因,知道的都会知道,不知道也就不知道了。现在,硬件技术的发展,我们很方便就能购买到性能足够强劲、价格足够廉价的Android 4.0以后的手机和平板,那么,现在我们学习android 4.X的设计风格也算是不晚。

所谓类响应式设计

这篇文章的标题为类响应式设计,有做过web开发的应该都知道,所谓的响应式设计,就是一个网页能够根据是电脑的访问或者手机的访问进行的一个响应的显示,在google官方设计指导文档里面,也有相关的说明:http://developer.android.com/design/patterns/multi-pane-layouts.html, 相比web的响应式设计思想,在Android上使用这种思想,只能称作为类似而已,因为相比之下,web的终端复杂,Android就相对于比较简单,因为在Android上面你只需要考虑,简单的来说,就是什么时候显示一个pane,什么时候显示两个pane的问题而已。

设计的理论基础

要解决Android应用什么时候显示一个pane,什么时候显示两个pane,我们需要了解一些Android是如何解决各种分辨率下的兼容性问题。

在做桌面软件的时代,我们很少发现有人会吐槽不同分辨率下的情况,至于原因,我个人觉得,第一,电脑的分辨率很多,但是屏幕的dpi/ppi 其实都差不多,这就使以像素为单位的计量参数在不同屏幕下的其实显示区别不大;第二点,就是pc上的软件的窗口是可调节的,而手机或者平板上你很少看到 (当然,现在三星的一些Android设备支持这个)。但是,移动设备上就完全不同了,首先,产生兼容性的问题,根源在于对显示一个像素改多大的问题,在高密度的手机屏幕上,一个像素被显示的非常之小,那么我们假设用100个像素本来是想显示2厘米左右的长度,但是结果却只显示了1厘米;第二点就是,移动设备不支持窗口的缩放,如果我定义了一个100像素的单位,那就永远没有用户可以调节的空间。对于这个问题,其实Android官方已经提供了很好的解决方案,就是不依赖像素的计量单位,让系统根据屏幕密度来渲染像素。

一张图片:

img_proxy?url=http%3A%2F%2Fdeveloper.android.com%2Fimages%2Fscreens_support%2Fscreens-ranges.png

一个公式:

px = dp * (dpi / 160)

如果,你是严格按照以上两点来设计你的程序的话,那你分辨率的兼容问题,你就不需要额外操心了。当然,要做到这点,需要在设计的时候操心。

Android程序的实现

上面讨论了一堆理论上的东西,估计大家都看烦了,那么在Android上具体是该怎么实现的呢?

设计规则

首先我们来看一张图:

img_proxy?url=http%3A%2F%2Fdeveloper.android.com%2Fdesign%2Fmedia%2Faction_bar_pattern_table.png

从这张图里面我们可以大致了解到手机和平板的最简单的区别,就在于屏幕是否有一边大于 600dp,那么我们绘制一幅流程图:

0c31f0bfbca7e92bf4a7696375a75dd0.png

显示一个pane,还是多个pane

如果,我们把平板和手机的设计,只是简单的认为是手机上显示一个pane,平板上显示多个pane,这也未免太过于肤浅了。

在web设计上,我们有个div的概念,对于这个概念,我们可以很平滑的过渡到我们Android应用的设计上。在android 4以后,实际上是Android 3以后,google意识到Android的平板的魅力不足以让我们专门针对平板再开发一次(例如iPad),所以引入了类似于web的设计方案,将每个view彻底的独立起来,让activity只是作为这些view的容器,在fragment推出以前,我们要做出设计,需要花很多的心力,因为我们需要自己手工维护实现每个view的生命周期,而有了fragment,我们就有了一套稳定的机制(有针对于android4以前的兼容包)。接下来,我们只需要考虑的是,我们的应用整个逻辑该怎么处理,在我研究了多个Android自适应的app以后,得出了一个关于 600dp的法则。

所谓600dp法则

我们从上边可以知道,手机与平板的区分点就是长或者高达到了600dp的大小,那么这个600dp究竟能做什么?首先,600dp是手机与平板的区分点,而手机与平板最大的不同就是一个屏幕能显示内容多少的问题。如果以手机的显示为一个pane单位,那么对于大于600dp而言,我们可以考虑在一个屏幕下放多一个pane。(关于为什么选择600dp可以参考诸多google android apps)

现在,我们以开源中国的客户端为例,来说说如何在实践中这个法则。

原版客户端在某手机上显示:

e12d830adaba9187164e1b1d6c718ef5.png

接着在某平板(宽超过 600dp)上显示:

bf8b185c3b39abf8f462c01757c8e56b.png

我们会很容易的发现,在对于大于600dp的设备上来看的话,在屏幕利用率而言,远远不够。接下来我们针对这点进行600dp法则的使用,进行改版后的显示。

根据600dp法则改造后的显示:

9484b96a26a0920d5a0521aaefb18848.png

关于横屏

3778783a00608c2879148b4fbf69ddc1.png

我们都知道,手机横屏以后似乎多了不少空余的空间,那么我们是否可以考虑放多个pane呢?

首先,我们要考虑的是我们的应用针对的是平板还是手机,而不是关于如何利用好屏幕的空间,而这里600dp刚好是能区分手机和平板的最好的大小。如果你要考虑的是手机和平板的设计,你只需要考虑一个app在手机和平板上的不同点,如果你考虑的是如何利用好屏幕的使用率,请根据手机或者平板分别设计一套。

推荐读物

【编辑推荐】

【责任编辑:Pockey TEL:(010)68476606】

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值