Palette优化界面色彩搭配

简介: 目录什么是PalettePalette是调色板的意思它可以通过提取Bitmap中的颜色来优化界面的色彩搭配。Palette的使用方法导入依赖dependencies { .

目录

img_8c1544a9a7510500e61788c5d1da7ba7.png

什么是Palette

Palette是调色板的意思它可以通过提取Bitmap中的颜色来优化界面的色彩搭配。

Palette的使用方法

导入依赖

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

核心方法(传入bitmap)

Palette.from(bitmap).generate(new Palette.PaletteAsyncListener() {
            @Override
            public void onGenerated(Palette palette) {
                // 获取到柔和的深色的颜色(可传默认值)
                 palette.getDarkMutedColor(Color.BLUE);
                 // 获取到活跃的深色的颜色(可传默认值)
                 palette.getDarkVibrantColor(Color.BLUE);
                 // 获取到柔和的明亮的颜色(可传默认值)
                 palette.getLightMutedColor(Color.BLUE);
                 // 获取到活跃的明亮的颜色(可传默认值)
                 palette.getLightVibrantColor(Color.BLUE);
                 // 获取图片中最活跃的颜色(也可以说整个图片出现最多的颜色)(可传默认值)
                 palette.getVibrantColor(Color.BLUE);
                 // 获取图片中一个最柔和的颜色(可传默认值)
                 palette.getMutedColor(Color.BLUE);
            }
});

案例演示

这里使用的是Toolbar+TabLayout+ViewPager结合实现的一个效果


img_a087ff139934e9746a509f46c6a7aa28.gif

核心代码:

 private void setPaletteColor(int position) {
        Bitmap bitmap = bitmaps.get(position);
        Palette.from(bitmap).generate(new Palette.PaletteAsyncListener() {
            @Override
            public void onGenerated(Palette palette) {
                Palette.Swatch vibrant = palette.getVibrantSwatch();//获取颜色样本。在这里做了非空判断,如果获取的颜色样本为空就从所有的样本中获取一个样本。
                if (vibrant == null) {
                    for (Palette.Swatch swatch : palette.getSwatches()) {
                        vibrant = swatch;
                        break;
                    }
                }
                // 这样获取的颜色可以进行改变。
                int rgb = vibrant.getRgb();//从样本中获取颜色的RGB值。获取到RGB值之后可以直接给其他控件使用这个值,或者稍微调整这个值的颜色再使用。
                tablayout.setBackgroundColor(rgb);
                toolbar.setBackgroundColor(rgb);
                if (Build.VERSION.SDK_INT > 21) {
                    Window window = getWindow();
                    //状态栏改变颜色。
                    int color = changeColor(rgb);
                    window.setStatusBarColor(color);
                }

            }
        });
    }
    /**
     * @method  changeColor
     * @description 修改状态栏颜色
     * @date: 2018/9/17 11:33
     * @author: LML
     * @param rgb 颜色值参数
     * @return int
     */
    private int changeColor(int rgb) {
        int red = rgb >> 16 & 0xFF;
        int green = rgb >> 8 & 0xFF;
        int blue = rgb & 0xFF;
        red = (int) Math.floor(red * (1 - 0.2));
        green = (int) Math.floor(green * (1 - 0.2));
        blue = (int) Math.floor(blue * (1 - 0.2));
        return Color.rgb(red, green, blue);
    }

案例源码地址:https://github.com/myml666/PalettesDemo

个人技术博客:https://myml666.github.io

目录
相关文章
|
1月前
|
数据可视化
在线可视化设计教你玩转圆角、阴影
在线可视化设计教你玩转圆角、阴影
32 1
|
6月前
|
数据可视化 大数据
【透明版九宫格背景图片】仅依靠background的几个属性组合搭配出酷炫的透明背景卡片效果→适用于大数据可视化、数据大屏展示页面
【透明版九宫格背景图片】仅依靠background的几个属性组合搭配出酷炫的透明背景卡片效果→适用于大数据可视化、数据大屏展示页面
【透明版九宫格背景图片】仅依靠background的几个属性组合搭配出酷炫的透明背景卡片效果→适用于大数据可视化、数据大屏展示页面
一款特别好用的屏幕颜色拾取工具Colors
一款特别好用的屏幕颜色拾取工具Colors
103 0
|
前端开发
Color Space -- 在线调色神器,解决你的配色问题
Color Space -- 在线调色神器,解决你的配色问题
833 0
|
JavaScript 前端开发
cli 界面制作、颜色计算工具 - JC Color
本文介绍一款 cli 界面制作、颜色计算工具 - JC Color
197 0
|
前端开发 JavaScript 程序员
前端通过range制作的rgba配色小工具
制作一个针对视觉的产品,快速调出想要的颜色,然后写在给前端程序员的文档里,方便前端程序员进行页面的配色处理[滑稽]
Revit二次开发—修改元素的Material Color(图形颜色)
Revit二次开发—修改元素的Material Color(图形颜色)
Revit二次开发—修改元素的Material Color(图形颜色)
|
并行计算 iOS开发 MacOS
Metal每日分享,调整图片角度滤镜效果
Metal每日分享,调整图片角度滤镜效果
Metal每日分享,调整图片角度滤镜效果
|
并行计算 iOS开发 MacOS
Metal每日分享,调整胶片颗粒感滤镜效果
Metal每日分享,调整胶片颗粒感滤镜效果
Metal每日分享,调整胶片颗粒感滤镜效果
|
并行计算 iOS开发 MacOS
Metal每日分享,调整曝光滤镜效果
Metal每日分享,调整曝光滤镜效果
Metal每日分享,调整曝光滤镜效果