在Android开发中,Android系统本身就有一套自己的界面标准,但奈何现在的产品经理PM都是果粉。设计师也是果粉一切的交互与设计都是按照IOS的规范来的。最近,我大谷歌在Android8.0后提出了android的图标适配方案,在官方文档中有说明。我们发现官方的图标适配中说明了android的图标应该是圆形的。这让一直推崇扁平化的圆角矩形的ios一众设计师啪啪打脸啊。作为android攻城狮的我真是感到无比的爽快。谷歌在新版本上对于设计提出了 Meterial Design 越来越多的主流App采用这种风格的设计。所以有针对性的系统的学习一下Material Design很有必要。
经验不足,水平有限。只是整理自己用过的和学习过程中的记录。请大神多多指教。
关于Meterial Design
Meterial Design是google在Android在5.0之后采用的新的设计语言。所谓的设计语言就是指的更多的是设计的风格、理念、原则。中文直译为“原材料设计”。
拟物设计和扁平化设计一种结合体验。还吸取了最新一些科技理念。
层次感:View Z轴
1.对于美工:遵循MD的界面设计、图标合集。
2.对于产品经理:遵循MD界面设计、页面的跳转及动画效果、交互设计。
3.对于开发人员:参与原型设计、辅助美工原型设计的素材准备。
开发实现MD的设计----界面、动画、转场动画等等。
详细介绍请看:
官方网站: https://developer.android.com/design/index.html
国内有翻译网站: http://wiki.jikexueyuan.com/project/material-design/material-design-intro/introduction.html
MD的使用及开发
使用Meterial Design控制全局样式
- 引入appcompat-v7
- 写自己的全局样式
<!--
Base application theme, dependent on API level. This theme is replaced
by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
-->
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
<!--
Theme customizations available in newer API levels can go in
res/values-vXX/styles.xml, while customizations related to
backward-compatibility can go here.
-->
</style>
<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
<item name="android:textColor">@color/mytextcolor</item>
<item name="colorPrimary">@color/colorPrimary_pink</item>
<item name="colorPrimaryDark">@color/colorPrimary_pinkDark</item>
<item name="android:windowBackground">@color/background</item>
<item name="colorAccent">@color/accent_material_dark</item>
<item name="navigationBarColor">@color/colorPrimary</item> # 设置底部导航栏的背景颜色
</style>
- colorPrimary:主色
- colorPrimaryDark:主色--深色 一般用于状态栏颜色 底部导航栏颜色
- colorAccent:代表各个空间的基调颜色---CheckBox、RadioButton、ProgressBar等
- android:textColor:当前所有的文本颜色
Meterial Design 兼容性控件的使用
在appcompat-v7 里面有很多为兼容而生的控件
- android.support.v7.app.AlertDialog 对话框兼容控件
- 进度条样式设置
style="@style/Widget.AppCompat.ProgressBar.Horizontal" - SwipeRefreshLayout下拉刷新
- PopupWindow
ListPopupWindow
PopupMenu - android.support.v7.widget.LinearLayoutCompat
给包裹在里面的所有子控件添加间隔线
<android.support.v7.widget.LinearLayoutCompat
android:layout_width="match_parent"
android:layout_height="match_parent"
app:divider="@drawable/abc_list_divider_mtrl_alpha"
app:showDividers="beginning|middle"
android:orientation="vertical" >
v7 RecyclerView
- RecyclerView是谷歌在高级版本提出的一个替代ListView、GridView的控件
- 高度解耦
- 自带了性能优化 ViewHolder
网友评论