Paletteを使用して画像の色を抽出
3937 ワード
最近では、1枚の画像からその色を取得し、残りのコントロールに設定して、UIページ全体のスタイルをより美しく和やかにしたいと考えています.ネットでいくつかの資料を調べて、Androidの下で比較的に面白いSupport v 7ライブラリを発見しました~~~
ステップ
1、Bitmapを渡し、Paletteを得る.2.Paletteで指定した色見本を取得する3、色見本から該当する色を抽出する.
使用開始
ガイドパック
工事下のbuild.gradleに依存を追加してPaletteを使用することができます.Bitmapを渡してPaletteを得るため、私は普段よく使う
1.Paletteオブジェクトの取得
Paletteオブジェクトを取得するには、
同期取得
非同期取得
2.Paletteで生成した色見本を取得する
以下のようにいくつかの色見本を得ることができるが,対応する色見本オブジェクトが得られない場合があり,非空判断に注意しなければならない.
カラー見本
色
DominantSwatch
最も目立つ色
VibrantSwatch
元気な色
DarkVibrantSwatch
活気のある暗い色
LightVibrantSwatch
元気な明るい色
MutedSwatch
やわらかい色
DarkMutedSwatch
やわらかい暗い色
LightMutedSwatch
やわらかい明るい色
3、色見本から該当する色を抽出する.
これは私のプロジェクトから抽出されたコードです.皆さん、見てください.
以下は私のappの効果図です.
Palette
ライブラリは、1枚の画像(Bitmap
)から際立った色を抽出することができ、ちょうど私のニーズに達することができます.ステップ
1、Bitmapを渡し、Paletteを得る.2.Paletteで指定した色見本を取得する3、色見本から該当する色を抽出する.
使用開始
ガイドパック
工事下のbuild.gradleに依存を追加してPaletteを使用することができます.Bitmapを渡してPaletteを得るため、私は普段よく使う
glide
ライブラリで画像をロードします.だから、後でglideでBitmapを取得します.implementation 'com.android.support:palette-v7:27.1.1'
implementation 'com.github.bumptech.glide:glide:3.6.1'
1.Paletteオブジェクトの取得
Paletteオブジェクトを取得するには、
と
の2つの方法があり、非同期でPaletteオブジェクトを取得することを推奨します.同期取得
Palette palette = Palette.from(bitmap).generate();
非同期取得
Palette.from(bitmap).generate(new Palette.PaletteAsyncListener() {
@Override
public void onGenerated(Palette palette) {
}
});
2.Paletteで生成した色見本を取得する
以下のようにいくつかの色見本を得ることができるが,対応する色見本オブジェクトが得られない場合があり,非空判断に注意しなければならない.
カラー見本
色
DominantSwatch
最も目立つ色
VibrantSwatch
元気な色
DarkVibrantSwatch
活気のある暗い色
LightVibrantSwatch
元気な明るい色
MutedSwatch
やわらかい色
DarkMutedSwatch
やわらかい暗い色
LightMutedSwatch
やわらかい明るい色
////
final Palette.Swatch swatch1 = palette.getDarkVibrantSwatch();
//
if (swatch1 != null) {
}
3、色見本から該当する色を抽出する.
Swatch
オブジェクトを取得すると、Swatchの取得に必要な色値を呼び出すことができます.//
swatch.getPopulation()
// RBG
swatch.getRgb()
// HSL
swatch.getHsl()
//
swatch.getBodyTextColor()
//
swatch.getTitleTextColor()
これは私のプロジェクトから抽出されたコードです.皆さん、見てください.
Glide.with(MainActivity.this).load(music_pic).asBitmap().into(new SimpleTarget() {
@Override
public void onResourceReady(Bitmap resource, GlideAnimation super Bitmap> glideAnimation) {
music_message_music_iv.setImageBitmap(resource);
Palette.generateAsync(resource, new Palette.PaletteAsyncListener() {
@Override
public void onGenerated(Palette palette) {
// palette
final Palette.Swatch s1 = palette.getDarkVibrantSwatch();
if (swatch1 != null) {
linearLayout.setBackgroundColor(swatch1.getRgb());
}
}
});
}
}); // asBitmap
以下は私のappの効果図です.