当下主流的软件没有一个统一明白的风格,App框架什么样的都有,但个人钟情于页面底部Tab分签架构,移动设备的屏幕尽管越来越大,可是显示的内容还是有限,为了能展示很多其它的内容,方便简洁的操作习惯中Tab架构是不二选择,分为顶部Tab和底部Tab。所以小山准备出一系列关于Tab的Blog,作为自己代码备份,也希望能帮到大家扩展开发思路,那就更是功德无量了。因为是Blog解说,代码尽量简单为好,不会大量的抽取重构,也尽量少使用资源文件,原理为中心。

看看当前比較经常使用的App中使用底部Tab的明星软件,先分析一下界面效果(标签内部的内容有更新推送会有角标提示,这里不作处理,以后文章可能会专门解说角标提示,尽请期待),扯点题外话吧,在開始做之前最后先心里有个数,不要蒙头上来一顿胡敲或一顿百度。。。要明白自己要做什么。

第一波Blog先来搞底部的Tab,好吧,啰嗦了半天,先看看流弊的界面效果吧。

1. 总体标签背景图片|颜色不变,通过改变单个子标签上的文字和图标来标识当前选中的标签(使用最多),这类标签个数一般3~5个:
1.1 QQ(V5.1.0)精简之后使用了3个标签与主流界面相比稍显突兀,使用扁平化风格图标显得纤细柔弱;
1.2 来往(V5.3.2)使用了深灰色的底板突出自己的特色,使用4个标签不拥不挤,图标用了卖萌的风格,占位恰到优点;
1.3 PPTV聚力(V4.0.5)和微信(V5.4)也使用了4个标签
背板使用接近于白色的浅色,搭配主流的扁平风,文字说明和标签的图标使用统一色调,这就是主流界面的基准;
1.4 淘宝(V4.9.3)使用了5个分页,加上纤细的图标总体也不认为拥挤。



2. 点击单个子标签背景改变,通过变亮或变暗凸显当前选中标签页(稍显过时,主流的扁平风格不使用这种style,可是个人更喜欢这种,比第1种类型更明显)


3. 文字底部加入选中标记,左右漂移滑动滑块来标记当前选中页



4. 简洁风格这里列出了两个比較文艺的App
4.1 仅仅有文字没有图标(一个)
4.2 仅仅有图标没有文字(Lofter)


5. 不规则标签
这类型非常多样子风格的,既然都说不规则了就不一一列举了,这里仅仅举例几个常见的
以中心为重点功能来分配分页,这类型最著名的应该是联通营业厅,可是后来居上喜马拉雅做的更美丽了,QQ空间和新浪微博是用户量最多的两款App。

6. 其它
密信是我做过最精(e)美(xin)的界面,对程序猿来说是一种摧残,可是对于用户就是一种视觉享受
这个底部Tab看似简单,细看一下,每一个Tab标签是有小角的,点击不论什么一个标签会联动左右两个压脚的效果
当初老板把Android和iOS界面使用了一套图片,这个非常让人受不了,尤其是对于程序猿,每一个平台控件的特性本就不同。。。
最后Android为了做效果自己定义了太多太多控件,哪怕是一像素线都须要精确,非常多小格子背景都是代码控制,由于不能拉伸。。。
最后的最后就是Android版本号未能上线,仅仅在測试组跑了几遍(因为公司重点所有转到MDM企业级产品,没精力上线Android仅仅上了iOS)。。。
我发誓,以后美工再做这么脑残的界面我宁可辞职。。。


界面分析到此为止,市面上的主流App也就这几种类型了,在稍后的文章中将使用代码一一实现这些风格的底部Tab!



Android 底部TabActivity(0)——开篇(界面分析|系列文章文件夹)的更多相关文章

  1. app后端开发系列文章文件夹

    一点废话 每个程序猿心中,都有一个大牛梦.我们在晨曦之光中敲击着代码,在寒冬覆雪中思考着0与1. 夏练三伏 冬练三九这说的就是我们这群[江湖]中人.在这里我们门派林立,C语言派历史悠久,在程序界就是嵩 ...

  2. 关于Android中图片大小、内存占用与drawable文件夹关系的研究与分析

    原文:关于Android中图片大小.内存占用与drawable文件夹关系的研究与分析 相关: Android drawable微技巧,你所不知道的drawable的那些细节 经常会有朋友问我这个问题: ...

  3. Spring IOC 容器源码分析系列文章导读

    1. 简介 Spring 是一个轻量级的企业级应用开发框架,于 2004 年由 Rod Johnson 发布了 1.0 版本.经过十几年的迭代,现在的 Spring 框架已经非常成熟了.Spring ...

  4. MyBatis 源码分析系列文章合集

    1.简介 我从七月份开始阅读MyBatis源码,并在随后的40天内陆续更新了7篇文章.起初,我只是打算通过博客的形式进行分享.但在写作的过程中,发现要分析的代码太多,以至于文章篇幅特别大.在这7篇文章 ...

  5. MyBatis 源码分析系列文章导读

    1.本文速览 本篇文章是我为接下来的 MyBatis 源码分析系列文章写的一个导读文章.本篇文章从 MyBatis 是什么(what),为什么要使用(why),以及如何使用(how)等三个角度进行了说 ...

  6. Spring AOP 源码分析系列文章导读

    1. 简介 前一段时间,我学习了 Spring IOC 容器方面的源码,并写了数篇文章对此进行讲解.在写完 Spring IOC 容器源码分析系列文章中的最后一篇后,没敢懈怠,趁热打铁,花了3天时间阅 ...

  7. netty源码分析系列文章

    netty源码分析系列文章 nettynetty源码阅读netty源码分析  想在年终之际将对netty研究的笔记记录下来,先看netty3,然后有时间了再写netty4的,希望对大家有所帮助,这个是 ...

  8. Yii2.0源码分析之——控制器文件分析(Controller.php)创建动作、执行动作

    在Yii中,当请求一个Url的时候,首先在application中获取request信息,然后由request通过urlManager解析出route,再在Module中根据route来创建contr ...

  9. Cocos2d-x 3.0 打造一个全平台概念文件夹

    Cocos2d-x 3.0 打造一个全平台概念文件夹http:// www.eoeandroid.com/thread-328055-1-1.html

随机推荐

  1. ZJOI2008骑士

    Z国的骑士团是一个很有势力的组织,帮会中汇聚了来自各地的精英.他们劫富济贫,惩恶扬善,受到社会各界的赞扬. 最近发生了一件可怕的事情,邪恶的Y国发动了一场针对Z国的侵略战争.战火绵延五百里,在和平环境 ...

  2. python3 requests 模块 json参数和data参数区别

    json 表示使用application/json方式提交请求 data 使用application/form-urlencode方式提交请求

  3. 今日SGU 5.3

    SGU 107 题意:输入一个N,表示N位数字里面有多少个的平方数的结尾9位是987654321 收获:打表,你发现相同位数的数相乘结果的最后几位,就和那两个相乘的数最后几位相乘一样,比如3416*8 ...

  4. Maven学习详解(13)——Maven常用命令大全与pom文件讲解

    一.Maven常用命令 1.1.Maven 参数 -D 传入属性参数  -P 使用pom中指定的配置  -e 显示maven运行出错的信息  -o 离线执行命令,即不去远程仓库更新包  -X 显示ma ...

  5. 虚拟机上的Ubuntu开机显示“无法应用原保存的显示器配置”

    如图: 解决方法: 删除monitors.xml 文件 rm ~/.config/monitors.xml

  6. 【项目基础】容器、AOP理论篇

    一.容器(砂锅) 1.概念: 容器是应用server中位于组件和平台之间的接口集合 2.应用: 容器一般位于应用server之内,由应用server负责载入和维护.一个容器仅仅能存在于一个应用serv ...

  7. cocos2dx-js学习笔记(一)环境搭建

    本人眼下的学习方向是cocos2dx+js的开发方式,开发调试使用webstrom和火狐浏览器,调试完毕的项目使用cocos2dx+jsb的方式编译到PC或android设备执行.主要时间用在学习,所 ...

  8. Android自定义视图

    Android框架为我们提供了大量的视图类来帮助我们做好展示信息以及同用户进行交互的工作.然后有时候,我们的app或许需要一些在Android内建视图之外特殊的视图,那么此时我们就需要自定义视图.下面 ...

  9. 15.Node.js REPL(交互式解释器)

    转自:http://www.runoob.com/nodejs/nodejs-tutorial.html Node.js REPL(Read Eval Print Loop:交互式解释器) 表示一个电 ...

  10. DG查看恢复进度

    查看恢复进度 (1)查看进程的活动状态 V$MANAGED_STANDBY视图专用于显示物理Standby数据库相关进程的当前状态,该视图中的列也很有特点,查看进程状态时,通常我们会关注PROCESS ...