|
| 1 | +[原文链接](http://baoyz.com/android/2014/10/21/android-palette-use/) (*需要科学上网*) |
| 2 | + |
| 3 | +## Android Lollipop 新特性 - Palette |
| 4 | + |
| 5 | +> *Palette 可以从一张图片中提取颜色，我们可以把提取的颜色融入到App UI中，可以使UI风格更加美观融洽。比如，我们可以从图片中提取颜色设置给ActionBar做背景颜色，这样ActionBar的颜色就会随着显示图片的变化而变化。* |
| 6 | +
|
| 7 | +Palette可以提取的颜色如下: |
| 8 | ++ Vibrant （有活力的） |
| 9 | ++ Vibrant dark（有活力的 暗色） |
| 10 | ++ Vibrant light（有活力的 亮色） |
| 11 | ++ Muted （柔和的） |
| 12 | ++ Muted dark（柔和的 暗色） |
| 13 | ++ Muted light（柔和的 亮色） |
| 14 | + |
| 15 | +### 使用方法 |
| 16 | + |
| 17 | +> *我们要想使用Palette，需要导入Palette的兼容库，`Gradle` 中添加下面依赖。* |
| 18 | +
|
| 19 | +``` |
| 20 | +compile 'com.android.support:palette-v7:21.0.0' |
| 21 | +``` |
| 22 | + |
| 23 | +第一步，我们需要通过一个Bitmap对象来生成一个对应的Palette对象。 |
| 24 | +Palette 提供了四个静态方法用来生成对象。 |
| 25 | + |
| 26 | ++ `Palette generate(Bitmap bitmap)` |
| 27 | ++ `Palette generate(Bitmap bitmap, int numColors)` |
| 28 | ++ `generateAsync(Bitmap bitmap, PaletteAsyncListener listener)` |
| 29 | ++ `generateAsync(Bitmap bitmap, int numColors, final PaletteAsyncListener listener)` |
| 30 | + |
| 31 | +> *不难看出，生成方法分为`generate`(同步)和`generateAsync`(异步)两种，如果图片过大使用generate方法，可能会阻塞主线程，我们更倾向于使用`generateAsync`的方法，其实内部就是创建了一个`AsyncTask`。`generateAsync`方法需要一个`PaletteAsyncListener`对象用于监听生成完毕的回调。除了必须的`Bitmap`参数外，还可以传入一个`numColors`参数指定颜色数，默认是 16。* |
| 32 | +
|
| 33 | +第二步，得到Palette对象后，就可以拿到提取到的颜色值 |
| 34 | + |
| 35 | ++ `Palette.getVibrantSwatch()` |
| 36 | ++ `Palette.getDarkVibrantSwatch()` |
| 37 | ++ `Palette.getLightVibrantSwatch()` |
| 38 | ++ `Palette.getMutedSwatch()` |
| 39 | ++ `Palette.getDarkMutedSwatch()` |
| 40 | ++ `Palette.getLightMutedSwatch()` |
| 41 | + |
| 42 | +第三步，使用颜色，上面get方法中返回的是一个 `Swatch` 样本对象，这个样本对象是Palette的一个内部类，它提供了一些获取最终颜色的方法。 |
| 43 | + |
| 44 | ++ `getPopulation()`: 样本中的像素数量 |
| 45 | ++ `getRgb()`: 颜色的RBG值 |
| 46 | ++ `getHsl()`: 颜色的HSL值 |
| 47 | ++ `getBodyTextColor()`: 主体文字的颜色值 |
| 48 | ++ `getTitleTextColor()`: 标题文字的颜色值 |
| 49 | + |
| 50 | +> *通过 `getRgb()` 可以得到最终的颜色值并应用到UI中。`getBodyTextColor()` 和 `getTitleTextColor()` 可以得到此颜色下文字适合的颜色，这样很方便我们设置文字的颜色，使文字看起来更加舒服。* |
| 51 | +
|
| 52 | +### 实例代码 |
| 53 | + |
| 54 | +```java |
| 55 | +// 此方法可能会阻塞主线程，建议使用异步方法 |
| 56 | +Palette palette = Palette.generate(bitmap); |
| 57 | +// 异步提取Bitmap颜色 |
| 58 | +Palette.generateAsync(bitmap, new Palette.PaletteAsyncListener() { |
| 59 | + @Override |
| 60 | + public void onGenerated(Palette palette) { |
| 61 | + // 提取完毕 |
| 62 | + // 有活力的颜色 |
| 63 | + Palette.Swatch vibrant = palette.getVibrantSwatch(); |
| 64 | + // 有活力的暗色 |
| 65 | + Palette.Swatch darkVibrant = palette.getDarkVibrantSwatch(); |
| 66 | + // 有活力的亮色 |
| 67 | + Palette.Swatch lightVibrant = palette.getLightVibrantSwatch(); |
| 68 | + // 柔和的颜色 |
| 69 | + Palette.Swatch muted = palette.getMutedSwatch(); |
| 70 | + // 柔和的暗色 |
| 71 | + Palette.Swatch darkMuted = palette.getDarkMutedSwatch(); |
| 72 | + // 柔和的亮色 |
| 73 | + Palette.Swatch lightMuted = palette.getLightMutedSwatch(); |
| 74 | + |
| 75 | + // 使用颜色 |
| 76 | + // 修改Actionbar背景颜色 |
| 77 | + getActionBar().setBackgroundDrawable(new ColorDrawable(vibrant.getRgb())); |
| 78 | + // 修改文字的颜色 |
| 79 | + mTextView.setTextColor(vibrant.getTitleTextColor()); |
| 80 | + ... |
| 81 | + // 根据需求选择不同效果的颜色应用 |
| 82 | + }); |
| 83 | +``` |
| 84 | + |
| 85 | +### 效果 |
| 86 | + |
| 87 | + |
| 88 | + |
| 89 | +### 代码下载 |
| 90 | + |
| 91 | +[https://github.com/baoyongzhang/android-lollipop-samples](https://github.com/baoyongzhang/android-lollipop-samples)中的[palette-sample](https://github.com/baoyongzhang/android-lollipop-samples/tree/master/palette-sample) |
0 commit comments