未来5天的天气预报,可以看成由5个类似的天气模块构成,只要完成一个,其他几个就可以通过复制+修改内容实现改变。
首先来明确一下各个组件的尺寸和参数,
16dp;65dp宽;日期的文字,参考Body 2的文字类型:

温度范围的文字,参考Caption的文字类型:

接下来,我们开始创建预报区域。划定一个360dp*100dp的区域,

添加一个65dp*100dp的背景限制区域-bound,以后每个预报模块的内容都要放到这个区域当中。这也是一个很有用的技巧。

从事先准备好的资源文件夹中,添加雪,并使用Primary Color-#3F51B5给它上色,
将预测温度和温度范围添加进去,并用Body 2和Caption分别设定它们的属性,


将雪``bound``明天``18℃~21℃组合起来,形成-明天;并调整它们的位置,使之居中,

复制明天组件,产生第二个预报模块,修改第二个模块的名称和内容为星期六,

修改雪的图标成晴。
晴从文件中拖到工作区域;雪,删除;之后,重复之前的动作,完成星期日 星期一 星期二的内容创建,

将明天 星期六 星期日 星期一 星期二与forcast_bg组合到一起,形成Forcast,

因为要给左右两端留下16dp的内容,明天 星期六 星期日 星期一 星期二没有办法水平瓜分forcast_bg占据的空间。所以这里我就使用了一个小把戏:把forcast_bg的宽度缩短32dp,变成328dp,并将它水平居中,

再调整明天和星期二的水平位置,使之刚好位于forcast_bg区域之内,

再选中明天 星期六 星期日 星期一 星期二与forcast_bg,使用水平分配空间的功能,让预报模块平均占用空间,

最后,出去背景颜色,预报区域就全部完成了,

为了界面分层,逻辑清楚,我在预报区域的下面,设计了一个360dp*10dp的隔离带,颜色为:#BDBDBD,

本文是《从设计到实现-手把手教你做android应用开发》系列文档中的一篇。感谢您的阅读和反馈,对本文有任何的意见和建议请留言,我都会尽量一一回复。
如果您觉得本文对你有帮助,请推荐给更多的朋友;或者加入我们的QQ群348702074和更多的小伙伴一起讨论;也希望大家能给我出出主意,让这些文档能讲的更好,能最大化的帮助到希望学习开发的伙伴们。
除了CSDN发布的文章,本系列最新的文章将会首先发布到我的专属博客book.anddle.com。大家可以去那里先睹为快。
同时也欢迎您光顾我们在淘宝的网店安豆的杂货铺。店中的积木可以搭配成智能LED灯,相关的配套文档也可以在这里看到。
这些相关硬件都由我们为您把关购买,为大家节省选择的精力与时间。同时也感谢大家对我们这些码农的支持。
最后再次感谢各位读者对安豆的支持,谢谢:)
android应用开发-从设计到实现 3-6 静态原型的天气预报
原文:http://blog.csdn.net/anddlecn/article/details/68066141