Difference between revisions of "S2 Cookbook: Colors"

From Dreamwidth Notes
Jump to: navigation, search
(Created page with 'To work with colors we use the [http://www.dreamwidth.org/customize/advanced/layerbrowse?id=core2#class.Color Color] class. With it, you can work with RGB or HSL values. == Cre…')
 
Line 2: Line 2:
  
 
== Creating a color from a hex string ==
 
== Creating a color from a hex string ==
 +
 +
You can create a new <code>Color</code> variable from a valid hex string just by assigning the string to the variable.  If the string isn't a valid color, the resulting variable will be undefined.
 +
 +
<syntaxhighlight lang="s2">"""<pre>""";
 +
 +
var Color white = "#FFF";
 +
# prints "#ffffff"
 +
print $white + "\n";
 +
$white = "#000000";
 +
print $white + "\n";
 +
 +
# $invalid will end up undefined
 +
var Color invalid = "none";
 +
# prints nothing
 +
print $invalid;
 +
 +
# prints "Not defined!"
 +
if ( not defined $invalid ) {
 +
  print "Not defined!\n";
 +
}
 +
 +
"""</pre>""";</syntaxhighlight>
  
 
== Making a copy of a color ==
 
== Making a copy of a color ==
  
 
== Getting the hex string from a color ==
 
== Getting the hex string from a color ==
 +
 +
Unlike most objects, you can assign directly between strings and Color objects.  You can use a Color class' member variable <code>as_string</code>.
 +
 +
<syntaxhighlight lang="s2">
 +
"""<pre>""";
 +
 +
var Color white = "#FFF";
 +
var string background = $white;
 +
 +
# prints "#ffffff"
 +
print $background + "\n";
 +
 +
$background = $white.as_string;
 +
# prints "#ffffff"
 +
print $background + "\n";
 +
 +
"""</pre>""";
 +
 +
</syntaxhighlight>
  
 
== Blending two colors together ==
 
== Blending two colors together ==
 +
 +
If you want a straight up average between two colors:
 +
 +
<syntaxhighlight lang="s2">
 +
var Color white = "#FFF";
 +
var Color black = "#000";
 +
var Color mix = $white->average($black);
 +
 +
# prints "#808080"
 +
print $mix;
 +
</syntaxhighlight>
 +
 +
If you want to blend one color with another at a certain percentage/weight:
 +
 +
<syntaxhighlight lang="s2">
 +
var Color white = "#FFF";
 +
var Color black = "#000";
 +
# 75% black, 25% white
 +
var Color mix = $white->blend($black, 75);
 +
 +
# prints "#404040"
 +
print $mix;
 +
</syntaxhighlight>
  
 
== Getting a lighter or darker version of a color ==
 
== Getting a lighter or darker version of a color ==
 +
 +
== Getting the inverse of a color ==
  
 
== Altering a color's values ==
 
== Altering a color's values ==
  
 
[[Category: S2 Cookbook]]
 
[[Category: S2 Cookbook]]

Revision as of 04:24, 8 August 2010

To work with colors we use the Color class. With it, you can work with RGB or HSL values.

Creating a color from a hex string

You can create a new Color variable from a valid hex string just by assigning the string to the variable. If the string isn't a valid color, the resulting variable will be undefined. 

"""<pre>""";
 
var Color white = "#FFF";
# prints "#ffffff"
print $white + "\n";
$white = "#000000";
print $white + "\n";
 
# $invalid will end up undefined
var Color invalid = "none";
# prints nothing
print $invalid;
 
# prints "Not defined!"
if ( not defined $invalid ) {
   print "Not defined!\n";
}
 
"""</pre>""";

Making a copy of a color

Getting the hex string from a color

Unlike most objects, you can assign directly between strings and Color objects. You can use a Color class' member variable as_string. 

"""<pre>""";
 
var Color white = "#FFF";
var string background = $white;
 
# prints "#ffffff"
print $background + "\n";
 
$background = $white.as_string;
# prints "#ffffff"
print $background + "\n";
 
"""</pre>""";

Blending two colors together

If you want a straight up average between two colors: 

var Color white = "#FFF";
var Color black = "#000";
var Color mix = $white->average($black);
 
# prints "#808080"
print $mix;

If you want to blend one color with another at a certain percentage/weight: 

var Color white = "#FFF";
var Color black = "#000";
# 75% black, 25% white
var Color mix = $white->blend($black, 75);
 
# prints "#404040"
print $mix;

Getting a lighter or darker version of a color

Getting the inverse of a color

Altering a color's values

Retrieved from "http://wiki.dreamwidth.net/wiki/index.php?title=S2_Cookbook:_Colors&oldid=8917"