Android开发技术中心Android开发Android知识

Android5.X之Material Design与主题

2017-03-19  本文已影响160人  Reathin

Material Design

谷歌发布新操作系统“ L Developer Preview”后,也同步推出了可视化语言Material Design(原质化设计),它的设计美学将会融入到谷歌所有的平台之中,包括Chrome OS和网页,它也将形成一个统一的外观,将所有的产品捆绑在一起。扁平化的设计,加上明亮的色彩,Material Design的外观还是很吸引人的。此外,谷歌对动画效果也做了相应的调整,让体验变得更加好玩儿。

==Material Design中文翻译网址:==
http://wiki.jikexueyuan.com/project/material-design/
http://www.uisdc.com/comprehensive-material-design-note

开源项目
1.MaterialDesignLibrary
在众多新晋库中,MaterialDesignLibrary可以说是颇受开发者瞩目的一个控件效果库,能够让开发者在Android 2.2系统上使用Android 5.0才支持的控件效果,比如扁平、矩形、浮动按钮,复选框以及各式各样的进度指示器等。
https://github.com/navasmdc/MaterialDesignLibrary


2.RippleEffect
由来自法兰西的Robin Chutaux开发的RippleEffect基于MIT许可协议开源,能够在Android API 9+上实现Material Design,为开发者提供了一种极为简易的方式来创建带有可扩展视图的header视图,并且允许最大程度上的自定制。
https://github.com/traex/RippleEffect
3.MaterialEditText
随着Material Design的到来,AppCompat也为开发者提供了Material Design的控件外观支持,其中就包括EditText,但却并不好用,没有设置颜色的API,也没有任何Google Material Design Spec中提到的特性。于是,来自国内的开发者“扔物线”开发了MaterialEditText库,直接继承EditText,无需修改Java文件即能实现自定义控件颜色。
https://github.com/rengwuxian/MaterialEditText
4.Android-LollipopShowcase
Android-LollipopShowcase是由来自奥地利的移动、后端及Web开发者Mike Penz所开发的演示应用,集中演示了新Material Design中所有的UI效果,以及Android Lollipop中其他非常酷炫的特性元素,比如Toolbar、RecyclerView、ActionBarDrawerToggle、Floating Action Button(FAB)、Android Compat Theme等。
https://github.com/mikepenz/Android-LollipopShowcase
5.material-design-icons
Google开源了包括Material Design系统图标包在内的750个字形,涵盖动作、音视频、通信、内容、编辑器、文件、硬件、图像、地图、导航、通知、社交等各个方面,适用于Web、Android和iOS应用开发,绝对是开发者及设计师必备的资源。
https://github.com/google/material-design-icons
Android Studio使用

compile 'com.android.support:appcompat-v7:25.x.x'

主题

Material Design主题

@android:style/Theme.Material (dark version)
@android:style/Theme.Material.Light (light version)
@android:style/Theme.Material.Light.DarkActionBar

对应的Compat Theme

Theme.AppCompat
Theme.AppCompat.Light
Theme.AppCompat.Light.DarkActionBar

自定义Color Palette

Palette从图像中提取突出的颜色,这样可以把色值赋给ActionBar、或者其他,可以让界面整个色调统一。

<resources>
    <!-- Base application theme. -->
    <style name="AppBaseTheme" parent="Theme.AppCompat">

        <!-- customize the color palette -->
        <item name="colorPrimary">@color/material_blue_500</item>
        <item name="colorPrimaryDark">@color/material_blue_700</item>
        <item name="colorAccent">@color/material_green_A200</item>
    </style>
</resources>

colorPrimary 对应ActionBar的颜色。
colorPrimaryDark对应状态栏的颜色
colorAccent 对应EditText编辑时、RadioButton选中、CheckBox等选中时的颜色、FloatActionButton等背景颜色

metarial design的theme允许我们去设置status bar的颜色,如果你项目的最小支持版本为5.0,那么你可以使用android:Theme.Material,设置android:statusBarColor。当然了这种情况目前来说比较少,所以我们多数使用的是Theme.AppCompat,通过设置android:colorPrimaryDark.来设置status bar颜色。(ps:默认情况下,android:statusBarColor的值继承自android:colorPrimaryDark).

上一篇 下一篇

猜你喜欢

热点阅读