Palette使用初探

Palette是用来做什么用的？

先上两张图，看看就懂了

WechatIMG4.jpeg WechatIMG52.jpeg

QQ音乐的专辑图及页面背景；页面的背景色会根据专辑图的颜色做出改变以达到出色的视觉效果。

要怎么使用？

1. 添加依赖

确保您的依赖项标识符中指定的版本与 build.gradle 文件中设置的应用的 compileSdkVersion 保持一致：

    android {
      compileSdkVersion 28
      ...
    }

    dependencies {
      ...
      implementation 'com.android.support:palette-v7:28.0.0'
    }
    

2. 生成调色板
   生成调色板的方式有两种

    // Generate palette synchronously and return it
    public Palette createPaletteSync(Bitmap bitmap) {
      Palette p = Palette.from(bitmap).generate();
      return p;
    }

    // Generate palette asynchronously and use it on a different
    // thread using onGenerated()
    public void createPaletteAsync(Bitmap bitmap) {
      Palette.from(bitmap).generate(new PaletteAsyncListener() {
        public void onGenerated(Palette p) {
          // Use generated instance
        }
      });
    }

如果需要为已排序的图片或对象列表连续生成调色板，要考虑[缓存]Palette 实例以防止界面性能降低。也不应在[主线程]上创建调色板。

如果需要自定义调色板可以通过Palette.from(bitmap)获得Palette.Builder。支持如下配置：

addFilter() 此方法会添加一个过滤器，用于指明生成的调色板中可以有哪些颜色。传入您自己的 Palette.Filter 并修改其 isAllowed() 方法，以确定从调色板中滤除哪些颜色。
maximumColorCount() 此方法可用于设置调色板中的颜色数量上限。默认值为 16，最佳值取决于源图片。对于横向显示的图片，最佳值的范围为 8 到 16，而带有人脸的图片的值通常介于 24 到 32 之间。调色板中的颜色越多，Palette.Builder 生成调色板的所用的时间就越长。
setRegion() 此方法指示在创建调色板时生成工具使用的位图的区域。您只能在从位图生成调色板时使用此方法，而且这不会影响原始图片。
addTarget() 此方法允许您通过向生成工具添加 Target 颜色配置文件来自行执行颜色调整。如果默认 Target 不够，高级开发者可以使用 Target.Builder 创建自己的 Target。

这是我自己写的一个demo,

public class PaletteUtils {
    private static LruCache<Bitmap, Palette> paletteLruCache = new LruCache<Bitmap, Palette>(4 * 1024 * 1024) {
        @Override
        protected int sizeOf(Bitmap key, Palette value) {
            return key.getByteCount();
        }
    };

    public static Single<Palette> createPaletteSync(Bitmap bitmap) {
        return Single.create(new SingleOnSubscribe<Palette>() {
            @Override
            public void subscribe(SingleEmitter<Palette> emitter) throws Exception {
                Palette palette = paletteLruCache.get(bitmap);
                if (palette == null) {

                    Palette.Builder builder = Palette.from(bitmap);
//                builder.addFilter()
//                builder.maximumColorCount()
//                builder.setRegion()
//                    builder.addTarget(Target.LIGHT_VIBRANT);
                    palette = builder.generate();
                    paletteLruCache.put(bitmap, palette);
                }
                emitter.onSuccess(palette);
            }
        })
                .subscribeOn(Schedulers.io())
                .observeOn(AndroidSchedulers.mainThread());

    }

}

3.使用调色板获取颜色

    Palette.Swatch vibrant = myPalette.getVibrantSwatch();
    if(vibrant != null){
        int titleColor = vibrant.getTitleTextColor();
        // ...
    }

getVibrantSwatch()获取的是一种配色方案，参照下图

palette-library-color-profiles_2-1_2x.png
如果想获得所有的配色方案列表可以使用getSwatches()

我在项目中使用的是swatch.getRgb()获取背景色，activity代码如下

public class PaletteActivity extends AppCompatActivity {
    Disposable subscribe;
    ImageView imageView;
    Toolbar toolbar;
    int[] images = new int[]{R.drawable.a1, R.drawable.a2, R.drawable.a3, R.drawable.a4, R.drawable.a5, R.drawable.a6};

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_paletter);

        imageView = findViewById(R.id.image);
        toolbar = findViewById(R.id.text_view);

        subscribe = Observable.interval(3000, TimeUnit.MILLISECONDS)
                .subscribeOn(Schedulers.io())
                .subscribeOn(AndroidSchedulers.mainThread())
                .subscribe(new Consumer<Long>() {
                    @Override
                    public void accept(Long aLong) {
                        onNext();
                    }
                });
    }

    int num = 0;

    private void onNext() {
        GlideUtils.getBitMap(this, images[num % images.length])
                .subscribe(new Consumer<Bitmap>() {
                    @Override
                    public void accept(Bitmap bitmap) throws Exception {
                        imageView.setImageBitmap(bitmap);
                        upColor(bitmap);
                    }
                });
        num++;

    }

    private void upColor(Bitmap bitmap) {
        PaletteUtils.createPaletteSync(bitmap).subscribe(new Consumer<Palette>() {
            @Override
            public void accept(Palette palette) {
                Palette.Swatch swatch = palette.getLightVibrantSwatch();
                if (swatch != null) {
                    int titleColor = swatch.getTitleTextColor();
                    int bodyColor = swatch.getBodyTextColor();
                    toolbar.setTitleTextColor(titleColor);
                    toolbar.setBackgroundColor(swatch.getRgb());
                }
            }
        });
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        subscribe.dispose();
    }
}