在Material Designer中,色彩再一次被摆到了重要的位置上。官方文档中竟然给出了500种配色方案进行选择。就是为了给不同的手机、电视、手表上带来一直的用户体验。

更多用于控制色彩的属性,可以参考:colorControlNormal.colorControlActivated.colorControlHighlight, colorButtonNormal, colorSwitchThumbNormal, colorEdgeEffect, statusBarColor and navigationBarColor.
AppCompat 为以上功能提供了大量的子集,允许你为Lollipop之前的系统控制色彩。具体可以到compat包中values中colors_material.xml进行查看

一、动态取色

对于这个方法的详细实现,可以参考这篇: 利用Palette库来取得图片中的主要色彩

Palette这个类中提取以下突出的颜色:

Vibrant (有活力)

Vibrant dark(有活力 暗色)

Vibrant light(有活力 亮色)
Muted (柔和)

Muted dark(柔和 暗色)

Muted light(柔和 亮色)

比如有下面这张图片,我们通过这个类久可以得到圆圈中所示的几种颜色。

    //目标bitmap,代码片段
Bitmap bm = BitmapFactory.decodeResource(getResources(),
R.drawable.kale);
Palette palette = Palette.generate(bm);
if (palette.getLightVibrantSwatch() != null) {
//得到不同的样本,设置给imageview进行显示
iv.setBackgroundColor(palette.getLightVibrantSwatch().getRgb());
iv1.setBackgroundColor(palette.getDarkVibrantSwatch().getRgb());
iv2.setBackgroundColor(palette.getLightMutedSwatch().getRgb());
iv3.setBackgroundColor(palette.getDarkMutedSwatch().getRgb()); }

通过这个类我们可以很方便的取得相应的颜色,然后通过代码动态设置。动态设置主题,或是设置瀑布流中的相片遮罩都很实用。

二、配色方案

基本的颜色要求是饱和度500,对于顶部的工具栏,需要用饱和度700的颜色。还要记得给灰色的文字、图标和分隔线加上alpha值。

同时,为了有效地传达信息的视觉层次,应该使用深浅不同的文本。

(1)对于白色背景上的文字,标准alpha值为87%(#000000)。

(2)视觉层次偏低的次要文字,应该使用54%(#000000)的alpha值。

(3)像正文和标签中用于提示用户的文字,视觉层次更低,应该使用26%(#000000)的alpha值。

(4)其他元素,比如说图标和分割线,也应该设置透明度,效果要比纯色好,这样的透明度设置(下图),能适应任何背景色。而有色背景上的黑白色文本,请参考配色表,来设置透明度,提高对比感。

其实上面得颜色都是#000000, 通过改变透明度来产生上面得效果。上面已经对分割线、隐藏型Text,二级文字,普通文字的透明度做了详细得说明。以后完全可以参考这个色板。

三、强调色

强调色是用来强调某种操作的,比如开关开启状态的颜色或者是悬浮按钮的颜色就应该用强调色。像是EditText在输入时,输入框变色也可以用强调色。这里的强调色在以后我们设置控件的时候会通过常见的backgroundColor,thumbColor进行设置。

  

Material Designer的低版本兼容实现(三)——Color的更多相关文章

  1. Material Designer的低版本兼容实现(一)—— 简介 & 目录

    很长一段时间没写东西了,其实是因为最近在研究Material Designer这个东西,熬夜熬的身体也不是很好了.所以就偷懒没写东西,这回开的这个系列文章是讲如何将Material Designer在 ...

  2. Material Designer的低版本兼容实现(五)—— ActivityOptionsCompat

    extends:http://www.cnblogs.com/tianzhijiexian/p/4087917.html 本文是对API中的方法做了介绍,如果想要看如何让这些方法兼容4.x或2.x可以 ...

  3. Material Designer的低版本兼容实现(二)—— Theme

    Theme material主题可以定义为如下形式: @android:style/Theme.Material @android:style/Theme.Material.Light @androi ...

  4. Material Designer的低版本兼容实现(十)—— CheckBox & RadioButton

    ChekBox的用途我们就不必多说了,算是一个很古老的控件了,何其类似的还有RadioButton,这个东西因为我目前还没写出来,所以用了别人的一个lib,这下面会说到.顺便说一句,如果你的app是在 ...

  5. Material Designer的低版本兼容实现(十二)—— Slider or SeekBar

    Slider,我更喜欢叫他SeekBar,其实是一个东西啦,就是拖动条.5.0的拖动条和4.x上的HOLO风格完全不同,平添了一些精致.此外还加入了数值指示器,让用户在滑动的时候就能知道现在到了什么位 ...

  6. Material Designer的低版本兼容实现(十三)—— ProgressBar

    进度条我们都很常见了,新的设计规范中提出了各式各样的进度条,本篇就会介绍大部分进度条的实现.实现方式和规范的示例图可能略有差异,还是那句话根据具体需求进行改变吧. PS:本文较长 参考文档:http: ...

  7. Material Designer的低版本兼容实现(十一)—— Switch

    5.0中的switch和之前完全不同了,漂亮不漂亮咱们另说,总之4.x上是没有这样的效果了.实现方式有两种,一种是用这个兼容包来做类似的效果,一种是用传统的checkbox来代替.我感觉兼容包的效果是 ...

  8. Material Designer的低版本兼容实现(九)—— Float Button & Small Float Button

    5.0一个新特性就是出现了这么一个圆形的悬浮指示按钮,这个按钮可以用来体现一个全局的重要功能,比如添加账户什么的.这个按钮有两种大小,一种是正常的按钮大小,一种是小型的按钮.官方文档中介绍的是小心的按 ...

  9. Material Designer的低版本兼容实现(四)—— ToolBar

       Toolbar其实是一个ActionBar的变体,大大扩展了Actionbar.我们可以像对待一个独立控件一样去使用ToolBar,可以将它放到屏幕的任何位置,不必拘泥于顶部,还可以将它改变高度 ...

随机推荐

  1. CF 554A 字符串水题

    给出一个字符串,问再加入一个字母,最多能形成多少种字符串 inputaoutput51inputhioutput76 # include <iostream> # include < ...

  2. #JS 前端javascript规范文档

    一.规范目的 为提高团队协作效率,便于前端后期优化维护,输出高质量的文档. 二.基本准则 符合web标准,结构表现行为分离,兼容性优良.页面性能方面,代码要求简洁明了有序, 尽可能的减小服务器负载,保 ...

  3. #JS attr和prop的区别

    HTML元素固有属性:使用prop方法 HTML元素自定义属性:使用attr方法

  4. jmeter内存溢出处理方式记录

    方法一: 使用jmeter进行压力测试时 遇到一段时间后报内存溢出outfmenmory错误,导致jmeter卡死了,先尝试在jmeter.bat中增加了JVM_ARGS="- Xmx204 ...

  5. Chart.js Y轴数据以百分比展示

    新手一枚,解决的问题喜欢记录,也许正好有人在网上迷茫的百度着.-0- 最近使用Chart.js做折线图的报表展示,直接显示整数啥的很好弄毕竟例子直接在哪里可以用,百分比就没办法了.百度慢慢汲取营养,虽 ...

  6. [lisp] scheme学习2

    1.在scheme中,为了效率,对序对的操作 cons car 和cdr是内部实现的,这里是scheme实现, 其中cons用到了闭包 (define (cons a b) (define (disp ...

  7. Redis学习笔记(1)- CentOS 6.4 安装Redis

    Redis学习笔记(1)- CentOS 6.4 安装Redis 2013.10.13     学习环境 vm 10.1 + 默认.新装的干净 CentOS 6.4  64BIT系统     准备 1 ...

  8. Cmd2001的毒瘤水题题解

    怕不是我再不写题解这题就该成没人做也没人会的千古谜题了...... T1: 仔细分析题面,发现相同就是广义SAM上节点相同,相似就是广义SAM上为从根到某个点路径的前缀..直接SAM上跑从根开始,每个 ...

  9. BZOJ.4571.[SCOI2016]美味(主席树 贪心)

    题目链接 要求 \(b\ xor\ (a_j+x)\) 最大,应让 \(a_j+x\) 的最高位尽可能与b相反.带个减法Trie树好像很难做?反正我不会. 从最高位开始,如果这位b是0/1,判断是否存 ...

  10. BZOJ3009 : 集合

    取一棵生成森林,根据题目限制可得,与一个点相连的多余的边数是$O(\sqrt{m})$级别的. 对于树边,每个点维护3棵权值线段树,依次保存它的儿子里各个集合的边. 再开3*3个分块数组,记录多余边以 ...