|
4 | 4 | #
|
5 | 5 |
|
6 | 6 | defmodule Scenic.Color do
|
7 |
| - @moduledoc """ |
8 |
| - APIs to create and work with colors. |
9 |
| -
|
10 |
| - Colors are used in multiple places in Scenic. Fills and Strokes of a |
11 |
| - single color are quite common. |
12 |
| -
|
13 |
| - ## Data Format |
14 |
| -
|
15 |
| - There are multiple ways to define colors. |
16 |
| -
|
17 |
| - The native format of color on modern computers is RGBA. This is four channels |
18 |
| - including Red, Green, Blue, and Alpha. Alpha indicates transparency, and is |
19 |
| - used to blend the color being applied at any given location with the color |
20 |
| - that is already there. |
21 |
| -
|
22 |
| - Most of the time, you will use one of the pre-defined named colors from the |
23 |
| - Named Colors table. However, there are times when you want to work with |
24 |
| - other color formats ranging from simple grayscale to rgb to hsl. |
25 |
| -
|
26 |
| - The following formats are all supported by the `Scenic.Color` module. |
27 |
| - The values of r, g, b, and a are integers between 0 and 255. |
28 |
| - For HSL and HSV, h is a float between 0 and 360, while the s, v and l values |
29 |
| - are floats between 0 and 100. |
30 |
| -
|
31 |
| - | Format | Implicit | Explicit | |
32 |
| - |---------------|------------------------|-----------| |
33 |
| - | Named Color | *na* | See the Named Color Table | |
34 |
| - | Grayscale | `g` | `{:g, g}` | |
35 |
| - | Gray, Alpha | `{g, a}` | `{:g, {g, a}}` | |
36 |
| - | Red, Green, Blue | `{r, g, b}` | `{:rgb, {r, g, b}}` | |
37 |
| - | Red, Green, Blue, Alpha | `{r, g, b, a}` | `{:rgba, {r, g, b, a}}` | |
38 |
| - | Hue, Saturation, Value | *na* | `{:hsv, {h, s, v}}` | |
39 |
| - | Hue, Saturation, Lightness | *na* | `{:hsl, {h, s, l}}` | |
40 |
| -
|
41 |
| -
|
42 |
| - ## Named Colors |
43 |
| -
|
44 |
| - The simplest is to used a named color (see the table below). Named colors are simply |
45 |
| - referred to by an atom, which is their name. Named colors are opaque by default. |
46 |
| - I failed to figure out how to show a table with colored cells in exdoc. So, Please see |
47 |
| - this page for a visual list of all the named colors. |
48 |
| -
|
49 |
| - ADD LINK TO COLORS HERE. |
50 |
| -
|
51 |
| - ## Additional Named Colors |
52 |
| -
|
53 |
| - | Name | Value | |
54 |
| - |---------------|------------------------| |
55 |
| - | `:clear` | `{0x80, 0x80, 0x80, 0x00}` | |
56 |
| - | `:transparent` | `{0x80, 0x80, 0x80, 0x00}` | |
57 |
| -
|
58 |
| - ## Converting Between Color Formats |
59 |
| -
|
60 |
| - By using the functions `to_g`, `to_ga`, `to_rgb`, `to_rgb`, `to_hsl`, and `to_hsv` |
61 |
| - you can convert between any implicit or explicit color type to any explicit color type. |
62 |
| - """ |
63 |
| - |
64 |
| - # import IEx |
65 |
| - |
66 |
| - @g :color_g |
67 |
| - @ga :color_ga |
68 |
| - @rgb :color_rgb |
69 |
| - @rgba :color_rgba |
70 |
| - @hsv :color_hsv |
71 |
| - @hsl :color_hsl |
72 |
| - |
73 |
| - @type implicit :: |
74 |
| - atom |
75 |
| - | {name :: atom, a :: integer} |
76 |
| - | (gray :: integer) |
77 |
| - | {gray :: integer, alpha :: integer} |
78 |
| - | {red :: integer, green :: integer, blue :: integer} |
79 |
| - | {red :: integer, green :: integer, blue :: integer, alpha :: integer} |
80 |
| - |
81 |
| - @type g :: {:color_g, grey :: integer} |
82 |
| - @type ga :: {:color_ga, {grey :: integer, alpha :: integer}} |
83 |
| - @type rgb :: {:color_rgb, {red :: integer, green :: integer, blue :: integer}} |
84 |
| - @type rgba :: |
85 |
| - {:color_rgba, {red :: integer, green :: integer, blue :: integer, alpha :: integer}} |
86 |
| - @type hsv :: {:color_hsv, {hue :: number, saturation :: number, value :: number}} |
87 |
| - @type hsl :: {:color_hsl, {hue :: number, saturation :: number, lightness :: number}} |
88 |
| - @type explicit :: g | ga | rgb | rgba | hsl | hsv |
89 |
| - |
90 |
| - @type t :: implicit | explicit |
91 |
| - |
92 | 7 | @named_colors %{
|
93 | 8 | alice_blue: {0xF0, 0xF8, 0xFF},
|
94 | 9 | antique_white: {0xFA, 0xEB, 0xD7},
|
@@ -241,6 +156,93 @@ defmodule Scenic.Color do
|
241 | 156 | yellow_green: {0x9A, 0xCD, 0x32}
|
242 | 157 | }
|
243 | 158 |
|
| 159 | + @moduledoc """ |
| 160 | + APIs to create and work with colors. |
| 161 | +
|
| 162 | + Colors are used in multiple places in Scenic. Fills and Strokes of a |
| 163 | + single color are quite common. |
| 164 | +
|
| 165 | + ## Data Format |
| 166 | +
|
| 167 | + There are multiple ways to define colors. |
| 168 | +
|
| 169 | + The native format of color on modern computers is RGBA. This is four channels |
| 170 | + including Red, Green, Blue, and Alpha. Alpha indicates transparency, and is |
| 171 | + used to blend the color being applied at any given location with the color |
| 172 | + that is already there. |
| 173 | +
|
| 174 | + Most of the time, you will use one of the pre-defined named colors from the |
| 175 | + Named Colors table. However, there are times when you want to work with |
| 176 | + other color formats ranging from simple grayscale to rgb to hsl. |
| 177 | +
|
| 178 | + The following formats are all supported by the `Scenic.Color` module. |
| 179 | + The values of r, g, b, and a are integers between 0 and 255. |
| 180 | + For HSL and HSV, h is a float between 0 and 360, while the s, v and l values |
| 181 | + are floats between 0 and 100. |
| 182 | +
|
| 183 | + | Format | Implicit | Explicit | |
| 184 | + |---------------|------------------------|-----------| |
| 185 | + | Named Color | *na* | See the Named Color Table | |
| 186 | + | Grayscale | `g` | `{:g, g}` | |
| 187 | + | Gray, Alpha | `{g, a}` | `{:g, {g, a}}` | |
| 188 | + | Red, Green, Blue | `{r, g, b}` | `{:rgb, {r, g, b}}` | |
| 189 | + | Red, Green, Blue, Alpha | `{r, g, b, a}` | `{:rgba, {r, g, b, a}}` | |
| 190 | + | Hue, Saturation, Value | *na* | `{:hsv, {h, s, v}}` | |
| 191 | + | Hue, Saturation, Lightness | *na* | `{:hsl, {h, s, l}}` | |
| 192 | +
|
| 193 | +
|
| 194 | + ## Named Colors |
| 195 | +
|
| 196 | + The simplest is to used a named color (see the table below). Named colors are simply |
| 197 | + referred to by an atom, which is their name. Named colors are opaque by default. |
| 198 | + I failed to figure out how to show a table with colored cells in exdoc. So this is |
| 199 | + a list of all the color names. I'll eventually add a link to a page that shows them |
| 200 | + visually. |
| 201 | +
|
| 202 | + #{inspect(Enum.map(@named_colors, fn {k, _v} -> k end), limit: :infinity, pretty: true)} |
| 203 | +
|
| 204 | +
|
| 205 | + ## Additional Named Colors |
| 206 | +
|
| 207 | + | Name | Value | |
| 208 | + |---------------|------------------------| |
| 209 | + | `:clear` | `{0x80, 0x80, 0x80, 0x00}` | |
| 210 | + | `:transparent` | `{0x80, 0x80, 0x80, 0x00}` | |
| 211 | +
|
| 212 | + ## Converting Between Color Formats |
| 213 | +
|
| 214 | + By using the functions `to_g`, `to_ga`, `to_rgb`, `to_rgb`, `to_hsl`, and `to_hsv` |
| 215 | + you can convert between any implicit or explicit color type to any explicit color type. |
| 216 | + """ |
| 217 | + |
| 218 | + # import IEx |
| 219 | + |
| 220 | + @g :color_g |
| 221 | + @ga :color_ga |
| 222 | + @rgb :color_rgb |
| 223 | + @rgba :color_rgba |
| 224 | + @hsv :color_hsv |
| 225 | + @hsl :color_hsl |
| 226 | + |
| 227 | + @type implicit :: |
| 228 | + atom |
| 229 | + | {name :: atom, a :: integer} |
| 230 | + | (gray :: integer) |
| 231 | + | {gray :: integer, alpha :: integer} |
| 232 | + | {red :: integer, green :: integer, blue :: integer} |
| 233 | + | {red :: integer, green :: integer, blue :: integer, alpha :: integer} |
| 234 | + |
| 235 | + @type g :: {:color_g, grey :: integer} |
| 236 | + @type ga :: {:color_ga, {grey :: integer, alpha :: integer}} |
| 237 | + @type rgb :: {:color_rgb, {red :: integer, green :: integer, blue :: integer}} |
| 238 | + @type rgba :: |
| 239 | + {:color_rgba, {red :: integer, green :: integer, blue :: integer, alpha :: integer}} |
| 240 | + @type hsv :: {:color_hsv, {hue :: number, saturation :: number, value :: number}} |
| 241 | + @type hsl :: {:color_hsl, {hue :: number, saturation :: number, lightness :: number}} |
| 242 | + @type explicit :: g | ga | rgb | rgba | hsl | hsv |
| 243 | + |
| 244 | + @type t :: implicit | explicit |
| 245 | + |
244 | 246 | # ============================================================================
|
245 | 247 | # https://www.w3schools.com/colors/colors_names.asp
|
246 | 248 |
|
|
0 commit comments