以编程方式生成“材料设计"颜色集的方式有哪些?

问题描述

我正在尝试创建材质设计的调色板，该调色板使用任意颜色的十六进制按百分比更改明暗度.关于实现，我发现我无法生成一些颜色十六进制，并显示颜色未知异常".您能告诉我产生这组颜色的替代方法或技术预防措施吗?

I am trying to create a colour palette of Material Design that changing the lightness / luminosity by percentage with arbitrary color hex. When it comes to the implementation, I have found that there are some color hex I cannot generate and shows Color Unknown Exception. Would you please tell me what are the alternatives or technical precautions to generate this set of colours?

以下是我的代码

package com.example.dino.util;

import android.content.Context;
import android.graphics.Color;

import java.util.ArrayList;

/**
 * Created by larrylo on 18/1/15.
 */

public  class ColorUtils {

    public Context context;

    public static float[]  colorToHsl(String hexColor) {
        int color = Color.parseColor(hexColor);
        float r = ((0x00ff0000 & color) >> 16) / 255.0F;
        float g = ((0x0000ff00 & color) >> 8) / 255.0F;
        float b = ((0x000000ff & color)) / 255.0F;
        float max = Math.max(Math.max(r, g), b);
        float min = Math.min(Math.min(r, g), b);
        float c = max - min;

        float hTemp = 0.0F;
        if (c == 0) {
            hTemp = 0;
        } else if (max == r) {
            hTemp = (float) (g - b) / c;
            if (hTemp < 0)
                hTemp += 6.0F;
        } else if (max == g) {
            hTemp = (float) (b - r) / c + 2.0F;
        } else if (max == b) {
            hTemp = (float) (r - g) / c + 4.0F;
        }
        float h = 60.0F * hTemp;

        float l = (max + min) * 0.5F;

        float s;
        if (c == 0) {
            s = 0.0F;
        } else {
            s = c / (1 - Math.abs(2.0F * l - 1.0F));
        }

        float []  hsl  = {h , s , l } ;
        return hsl;
    }



    public static String hslToColor(int alpha, float hue, float saturation, float lightness) {
        float hh = hue;
        float ss = saturation;
        float ll = lightness;
        float h, s, v;
        h = hh;
        ll *= 2;
        ss *= (ll <= 1) ? Ll : 2 - ll;
        v = (ll + ss) / 2;
        s = ((ll + ss) != 0) ? (2 * ss) / (ll + ss) : 0;
        int resultColorInt =  Color.HSVToColor(alpha, new float[] { h, s, v });
        return Integer.toHexString(resultColorInt).toUpperCase();
    }

    public static ArrayList<String> returnMaterialDesignColorSet (String colorHex){
        ArrayList<String> resultList = new ArrayList<String>();
        float [] baseColorHSL = colorToHsl(colorHex);
        double randomMid = randomWithRange(0.48 , 0.52);
        String baseColor = hslToColor(1 ,baseColorHSL[0] , baseColorHSL[1] , (float)0.5);
        resultList.add(baseColor);
        return resultList;
    }

    public static double randomWithRange(double min, double max)
    {
        double range = Math.abs(max - min);
        return (Math.random() * range) + (min <= max ? Min : max);
    }

    public static int colorInt (String hex){
        return Color.parseColor(hex);
    }
}

测试代码

 ActionBar actionBar = getActionBar();
        actionBar.setDisplayHomeAsUpEnabled(true);
        actionBar.setHomeButtonEnabled(true);
        double max = 0.52;
        double min = 0.48;
        double range = Math.abs(max - min);
        double value =  (Math.random() * range) + (min <= max ? Min : max);
        float result = (float)value;
        System.out.println(result);
        String test  = "#973f5c";
        String test2 = ColorUtils.returnMaterialDesignColorSet(test).get(0);
        int colorInt = ColorUtils.colorInt(test2);

        actionBar .setBackgroundDrawable(new ColorDrawable(colorInt));

推荐答案

原始问题

您的代码在处理颜色格式时出错.如下所示替换hslToColor()的最后一行，您将使它运行无误:

Original problem

Your code has error working with color format.Replace last line of hslToColor() like shown below and you'll make it run without errors:

public static String hslToColor(int alpha, float hue, float saturation, float lightness) {

    ...

    // !!! ERROR WAS ON THE LAST LINE:
    return String.format("#%08x", resultColorInt).toUpperCase();
}

我已经对其进行了测试-它可以正常工作-因为它还具有两点优点:
1)将值格式化为8位数字
2)添加"#"前缀

I've tested it - it works - because it makes 2 additional things:
1) Formats value to have 8 digits
2) Adds "#" prefix

您的代码中可能存在第二个问题

alpha值的值可以从0(透明)到255(不透明).如果要使图像不透明，则应传递255(0xFF).
现在您通过1和我认为这是一个错误-因为它几乎是透明的.
所以要有不透明的颜色替换线

Possible SECOND problem in your code

The alpha value may have values from 0 (transparent) to 255 (opaque). If you want to have opaque image you should pass 255 (0xFF).
Now you pass 1 and I think it's an error - because it's almost transparent.
So to have opaque color replace line

String baseColor = hslToColor(1 ,baseColorHSL[0] , baseColorHSL[1] , (float)0.5);

使用

String baseColor = hslToColor(0xFF ,baseColorHSL[0] , baseColorHSL[1] , (float)0.5);

附件
如果需要获得一组颜色，则应应用一些创造力.
要创建一个色调调色板，您必须同时循环更改 a)饱和度或 b)亮度或 c).
这是一个实现示例，该示例基于10步从0.4到0.6(不包括在内)的亮度变化返回调色板.
实验性"意味着您应该为自己找到价值.

Annex
If one needs to get a set of colors - a bit of creativity should be applied.
To create a tint palette you have to change in a loop a) saturation or b) lightness or c) both of them.
Here is an implementation example that returns palette based on lightness change from 0.4 to 0.6 (non inclusive) in 10 steps.
"Experimental" means that you should find values for yourself.

public static ArrayList<String> returnMaterialDesignColorSet(String baseColorHex, int colorCount) {
    ArrayList<String> resultList = new ArrayList<String>();
     float [] baseColorHSL = colorToHsl(baseColorHex);

    float lght=0.4;// initial lightness value (experimental)
    float lStep=(0.6 - lght) / colorCount; // step to go up to 0.6 lightness (experimental)
    for (int i = 0; i < colorCount; i++) {
         String baseColor = hslToColor(1 ,baseColorHSL[0] , baseColorHSL[1] , lght);
         resultList.add(baseColor);
         lght += lStep;
    }

    return resultList;
}

这篇关于以编程方式生成“材料设计"颜色集的方式有哪些?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！