UIDefaultsLoader: added tint() and shade() color functions (inspired by Less CSS)

This commit is contained in:
Karl Tauber
2021-08-05 23:37:42 +02:00
parent 3f5acda132
commit 0544a605c3
4 changed files with 31 additions and 8 deletions

View File

@@ -608,7 +608,9 @@ class UIDefaultsLoader
case "changeSaturation":return parseColorChange( 1, params, resolver, reportError ); case "changeSaturation":return parseColorChange( 1, params, resolver, reportError );
case "changeLightness": return parseColorChange( 2, params, resolver, reportError ); case "changeLightness": return parseColorChange( 2, params, resolver, reportError );
case "changeAlpha": return parseColorChange( 3, params, resolver, reportError ); case "changeAlpha": return parseColorChange( 3, params, resolver, reportError );
case "mix": return parseColorMix( params, resolver, reportError ); case "mix": return parseColorMix( null, params, resolver, reportError );
case "tint": return parseColorMix( "#fff", params, resolver, reportError );
case "shade": return parseColorMix( "#000", params, resolver, reportError );
} }
} finally { } finally {
parseColorDepth--; parseColorDepth--;
@@ -789,19 +791,23 @@ class UIDefaultsLoader
} }
/** /**
* Syntax: mix(color1,color2[,weight]) * Syntax: mix(color1,color2[,weight]) or
* tint(color[,weight]) or
* shade(color[,weight])
* - color1: a color (e.g. #f00) or a color function * - color1: a color (e.g. #f00) or a color function
* - color2: a color (e.g. #f00) or a color function * - color2: a color (e.g. #f00) or a color function
* - weight: the weight (in range 0-100%) to mix the two colors * - weight: the weight (in range 0-100%) to mix the two colors
* larger weight uses more of first color, smaller weight more of second color * larger weight uses more of first color, smaller weight more of second color
*/ */
private static Object parseColorMix( List<String> params, Function<String, String> resolver, boolean reportError ) { private static Object parseColorMix( String color1Str, List<String> params, Function<String, String> resolver, boolean reportError ) {
String color1Str = params.get( 0 ); int i = 0;
String color2Str = params.get( 1 ); if( color1Str == null )
color1Str = params.get( i++ );
String color2Str = params.get( i++ );
int weight = 50; int weight = 50;
if( params.size() > 2 ) if( params.size() > i )
weight = parsePercentage( params.get( 2 ) ); weight = parsePercentage( params.get( i++ ) );
// parse second color // parse second color
String resolvedColor2Str = resolver.apply( color2Str ); String resolvedColor2Str = resolver.apply( color2Str );

View File

@@ -371,10 +371,17 @@ class FlatCompletionProvider
addFunction( "changeLightness", hslChangeParams ); addFunction( "changeLightness", hslChangeParams );
addFunction( "changeAlpha", hslChangeParams ); addFunction( "changeAlpha", hslChangeParams );
String weightParamDesc = "(optional) 0-100%, default is 50%";
addFunction( "mix", addFunction( "mix",
"color1", colorParamDesc, "color1", colorParamDesc,
"color2", colorParamDesc, "color2", colorParamDesc,
"weight", "(optional) 0-100%, default is 50%" ); "weight", weightParamDesc );
addFunction( "tint",
"color", colorParamDesc,
"weight", weightParamDesc );
addFunction( "shade",
"color", colorParamDesc,
"weight", weightParamDesc );
} }
private void addFunction( String name, String... paramNamesAndDescs ) { private void addFunction( String name, String... paramNamesAndDescs ) {

View File

@@ -69,6 +69,8 @@ public class FlatThemeTokenMaker
tokenMap.put( "changeLightness", TOKEN_FUNCTION ); tokenMap.put( "changeLightness", TOKEN_FUNCTION );
tokenMap.put( "changeAlpha", TOKEN_FUNCTION ); tokenMap.put( "changeAlpha", TOKEN_FUNCTION );
tokenMap.put( "mix", TOKEN_FUNCTION ); tokenMap.put( "mix", TOKEN_FUNCTION );
tokenMap.put( "tint", TOKEN_FUNCTION );
tokenMap.put( "shade", TOKEN_FUNCTION );
tokenMap.put( "lazy", TOKEN_FUNCTION ); tokenMap.put( "lazy", TOKEN_FUNCTION );
// function options // function options

View File

@@ -62,3 +62,11 @@ Prop.colorFunc33 = mix(#f00,#0f0,75%)
Prop.colorFunc34 = mix(#f00,#0f0,90%) Prop.colorFunc34 = mix(#f00,#0f0,90%)
Prop.colorFunc35 = mix($Prop.color1,$Prop.color2) Prop.colorFunc35 = mix($Prop.color1,$Prop.color2)
Prop.colorFunc36 = mix($Prop.colorFunc20,$Prop.colorFunc30) Prop.colorFunc36 = mix($Prop.colorFunc20,$Prop.colorFunc30)
Prop.colorFunc40 = tint(#f0f,25%)
Prop.colorFunc41 = tint(#f0f)
Prop.colorFunc42 = tint(#f0f,75%)
Prop.colorFunc45 = shade(#f0f,25%)
Prop.colorFunc46 = shade(#f0f)
Prop.colorFunc47 = shade(#f0f,75%)