简介
Palette 即调色板。从图片中提取颜色，然后赋给相应的视图，使界面看起来更加协调好看。
简单使用
首先添加相应的依赖
implementation 'com.android.support:palette-v7:26.0.0'
Android Studio 3.0 开始新建项目默认使用 implementation 了，当然 compile 也能用。
我们给 Layout 文件添加一个 ImageView 和 6 个 View。ImageView 是用来放图片来提取颜色的，提取的颜色分别放到准备的 6 个 View 中。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:background="@color/colorPrimary"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.teletian.palette.MainActivity">
<ImageView
android:id="@+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/naruto" />
<View
android:id="@+id/color1"
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_marginTop="5dp" />
<View
android:id="@+id/color2"
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_marginTop="5dp" />
<View
android:id="@+id/color3"
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_marginTop="5dp" />
<View
android:id="@+id/color4"
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_marginTop="5dp" />
<View
android:id="@+id/color5"
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_marginTop="5dp" />
<View
android:id="@+id/color6"
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_marginTop="5dp" />
</LinearLayout>
接下来就是在 Activity 中提取，先上代码如下：
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ImageView image = findViewById(R.id.image);
Bitmap bitmap = ((BitmapDrawable)image.getDrawable()).getBitmap();
Palette.Builder builder = Palette.from(bitmap);
builder.generate(new Palette.PaletteAsyncListener() {
@Override
public void onGenerated(Palette palette) {
//充满活力的样本
Palette.Swatch swath1 = palette.getVibrantSwatch();
if (swath1 != null) {
findViewById(R.id.color1).setBackgroundColor(swath1.getRgb());
}
//充满活力的暗色样本
Palette.Swatch swath2 = palette.getDarkVibrantSwatch();
if (swath2 != null) {
findViewById(R.id.color2).setBackgroundColor(swath2.getRgb());
}
//充满活力的亮色样本
Palette.Swatch swath3 = palette.getLightVibrantSwatch();
if (swath3 != null) {
findViewById(R.id.color3).setBackgroundColor(swath3.getRgb());
}
//柔和的样本
Palette.Swatch swath4 = palette.getMutedSwatch();
if (swath4 != null) {
findViewById(R.id.color4).setBackgroundColor(swath4.getRgb());
}
//柔和的暗色样本
Palette.Swatch swath5 = palette.getDarkMutedSwatch();
if (swath5 != null) {
findViewById(R.id.color5).setBackgroundColor(swath5.getRgb());
}
//柔和的亮色样本
Palette.Swatch swath6 = palette.getLightMutedSwatch();
if (swath6 != null) {
findViewById(R.id.color6).setBackgroundColor(swath6.getRgb());
}
}
});
}
}
Palette 对象的生成有两种方法，例子中的是异步生成，还可以同步生成，代码如下：
Palette.Builder bulider = Palette.from(bitmap);
Palette palette = bulider.generate();
推荐使用异步，尤其是图片大小比较大的时候。
提取颜色提供了 6 中不同的颜色，详见代码注释。
除了提取 rgb 颜色，还可以提取其他信息：
getTitleTextColor()：返回适合标题的颜色
getBodyTextColor()：返回适合文本内容的颜色
getTitleTextColor()：返回float[]，可以进行修改，后使用ColorUtils工具类进行转换
getPopulation()：返回像素的总数
运行效果如下：
可以发现下面 6 中颜色只有 5 中颜色显示出来了，其中 "充满活力的暗色样本" 没有显示。也就是说 Palette 获取的样本是可能没有值的。但是 "充满活力的样本" 和其他不一样，始终有值。
使用场景
Palette 到底实际应用中有什么用呢，下面通过一个例子来展示一下其中一种使用场景。
先来看下效果：
ViewPager 滑动的时候，根据图片的颜色，改变 StatusBar，Toolbar，TabLayout，NavigationBar 的颜色。
Palette 的基本使用既然已经在上文中讲解过了，这边就不再啰嗦了。
例子中使用到了 Toolbar 和 TabLayout，如果不熟悉的话，可以参照我之前写的文章↓
Android Material Design 之 Toolbar
Android Material Design 之 TabLayout
所以直接看源码吧！
源码
基本使用
https://github.com/teletian/Android/tree/master/MaterialDesignSamples/Palette
ViewPager 滑动改变颜色
https://github.com/teletian/Android/tree/master/MaterialDesignSamples/PaletteWithViewPager
