码迷,mamicode.com
首页 > 移动开发 > 详细

使用Material Design 创建App翻译系列----材料主题的使用(Using Material Theme)

时间:2015-07-02 12:12:02      阅读:226      评论:0      收藏:0      [点我收藏+]

标签:

上一篇是使用Material Design 创建App翻译系列—-开始学习篇,进入正题:


新的材料主题提供了以下内容:
1. 提供了允许设置颜色板的系统部件组件。
2. 为这些系统组件提供了触摸反馈动画。
3. Activity的过渡动画。

根据你的品牌标识,使用你所控制的颜色板可以自定义材料主题的外观。使用主题的属性可以给ActionBar 和 status bar进行着色。

系统部件拥有新的设计和触摸反馈动画。你可以为你的应用自定义颜色板、触摸反馈动画以及Activity之间跳转的过渡动画。

以下是材料主题定义的方式:
1. @android:style/Theme.Material (dark version)
2. @android:style/Theme.Material.Light (light version)
3. @android:style/Theme.Material.Light.DarkActionBar
你可以使用以上几种的材料主题样式,引用的方式在R.style可见。

技术分享
Dark material theme
技术分享
Light material theme

注意事项:这个材料主题只允许在Android 5.0及其以上系统使用。V7 的支持库(v7 support libraries)为一些组件提供了用于材料设计样式的主题,并且也能支持自定义颜色板。详情请看:保证兼容性

自定义颜色板

为了自定义适合你的品牌的主题基础颜色,当继承材料主题的时候就使用主题属性来定义你的自定义颜色了:

<resources>
  <!-- inherit from the material theme -->
  <style name="AppTheme" parent="android:Theme.Material">
    <!-- Main theme colors -->
    <!--   your app branding color for the app bar -->
    <item name="android:colorPrimary">@color/primary</item>
    <!--   darker variant for the status bar and contextual app bars -->
    <item name="android:colorPrimaryDark">@color/primary_dark</item>
    <!--   theme UI controls like checkboxes and text fields -->
    <item name="android:colorAccent">@color/accent</item>
  </style>
</resources>

自定义状态栏

材料主题能够轻松的自定义状态栏,因此你可以指定适合你品牌的一种颜色,使得白色的状态栏图标更显对比效果。在你继承了材料主题的前提下,想要自定义状态栏的颜色,就用android:statusBarColor 属性。默认情况,android:statusBarColor的属性值继承自 android:colorPrimaryDark。

你也可以绘制状态栏背后的内容。例如,如果你想要显示一张透明的状态栏下的照片,就要用稍微淡点的暗的过渡色来确保白色的状态栏图标是可以看见的。通过设置android:statusBarColor 属性值到 @android:color/transparent 和 根据需要来调整windowFlags。你也可以用 Window.setStatusBarColor()来为动画或者隐退。

技术分享

注意事项: 状态栏跟主工具栏应该是有一个明确的界定的,除了状态栏后面要显示图片或者多媒体相关的内容以外,在使用渐变色去确保状态栏的图标还是可见的。
当自定义导航栏和状态栏的时候,仅让状态栏被修改或者调整透明度。在其它情况下导航栏都保持黑色。

为个别视图控件添加主题

在xml布局中定义的控件需要指定 android:theme 属性来引用主题资源。这个属性修改元素和子元素的主题,是为了在一个指定的界面的一部分改变其主题颜色的调色板。


以上翻译内容中外部链接的部分,以后会逐步翻译出来,目前链接是官方的网站,如果需要查看的朋友,请先翻墙。

使用Material Design 创建App翻译系列----材料主题的使用(Using Material Theme)

标签:

原文地址:http://blog.csdn.net/abren32/article/details/46723435

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!