android应用开发-从设计到实现 3-4 静态原型的状态栏
静态原型的状态栏
状态栏Symbol
状态栏似乎非常复杂,有wifi信号、手机信号、时间、电量等信息,幸好Sketch
原生就自带的现成组件,你能够直接拿过来就用了。当然。你也能够自己一个一个去画,只是既然有了现成的轮子,又何必反复劳动呢。
菜单条
中选择File -> New From Template
,在弹出的菜单中选择Material Design
。此时会创建一个新的project文件。
与之前空的project文件不同的是,这里面已经有了两个现成的page
,里面的内容就是Material Design
会使用到的各种现成的组件。
选择Material Design Symbol -> Material/Android/Status bar 360dp black
,这就是一个现成的可用的状态栏。这种组件叫做symbol
。它是有多个图形组合后形成的一个通用符号。Symbol
能够被不同的page
、项目共享使用。
以后仅仅要看到这个图案,就知道这是一个symbol
了,
我们也能够创建自己的symbol
。只是这个地方还不会用到。
随着设计开发的深入,在这个章节的后半部分。我们会进行具体的介绍。
使用状态栏Symbol
使用鼠标右键 + Copy
(或者cmd + c)之后,将它粘贴(鼠标右键 + Paste Over
或者cmd + v)到我们之前的weather page
之中。
假设状态栏粘贴之后。并没有对齐画板的边缘。手动将它移动,对齐就能够了。
此时能够看到。
Pages
以下自己主动多出了一个叫做symbols
的页面,它里面放的就是我们刚引进的symbol
。这时的statusbar还是一个独立的部分,并没有隶属于
Mobile Portrait
画板之下。两者还是平级的关系。
调整状态栏Symbol
接下来我们就開始调整statusbar与Mobile Portrait
之间的隶属关系。
- 将状态栏展开。选中里面的内容。
- 将各个组件拖入到
Mobile Portrait
之下。 - 删除没有内容的状态栏symbol。
- 将刚拖入的组件使用
工具栏
上的Group
功能组合起来,并将组合后的组件更名为Statusbar
。
选中状态栏,我们能够看到状态栏的尺寸是:24px*360px,刚好是前面讲过的状态栏应该的高度。
改动背景色
将状态栏的背景颜色改动成之前设定的Primary Color
:#3F51B5,
本文是《从设计到实现-手把手教你做android应用开发》系列文档中的一篇。感谢您的阅读和反馈,对本文有不论什么的意见和建议请留言,我都会尽量一一回复。
假设您认为本文对你有帮助,请推荐给很多其它的朋友。或者增加我们的QQ群348702074和很多其它的小伙伴一起讨论;也希望大家能给我出出主意。让这些文档能讲的更好,能最大化的帮助到希望学习开发的伙伴们。
除了CSDN公布的文章,本系列最新的文章将会首先公布到我的专属博客book.anddle.com。大家能够去那里先睹为快。
同一时候也欢迎您光顾我们在淘宝的网店安豆的杂货铺。店中的积木能够搭配成智能LED灯。相关的配套文档也能够在这里看到。
这些相关硬件都由我们为您把关购买,为大家节省选择的精力与时间。同一时候也感谢大家对我们这些码农的支持。
最后再次感谢各位读者对安豆
的支持,谢谢:)
相关文章
- JAVA Eclipse创建Android程序界面不显示怎么办
- Android开发学习---android下的数据持久化,保存数据到rom文件,android_data目录下文件访问的权限控制
- 设计模式--静态工厂设计模式在android中的使用
- 【源码阅读】半个月读完Android系统开发源码
- Android中的人脸检测的示例代码(静态和动态)
- Android app 自定义可横竖滑动的RecyclerView(一)
- 【Android 逆向】Android 逆向方法 ( 静态逆向解析 | 函数调用分析 | 动态运行跟踪 | 运行日志分析 | 文件格式解析 | 敏感信息分析 | 网络信息监控 | 环境伪装模拟 )
- 【Android 安装包优化】使用 lib7zr.a 静态库处理压缩文件 ( 交叉编译 lib7zr.a 静态库 | 安卓工程导入静态库 | 配置 CMakeLists.txt 构建脚本 )
- Android学习笔记(四十):Preference的使用
- 我的Android进阶之旅------>Android编译错误java.util.zip.ZipException: duplicate entry的解决方法
- Android中View绘制流程以及invalidate()等相关方法分析
- 【Android机器学习实战】2、用 TensorFlowLite 做目标检测