zng/
color.rs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
//! Color and gradient types, functions, properties and macros.
//!
//! # Colors
//!
//! The example demonstrates multiple ways of declaring or selecting a color, all blue in this case.
//!  
//! ```
//! use zng::prelude::*;
//!
//! fn sample(color: impl IntoVar<color::Rgba>) -> impl UiNode {
//!     Wgt! {
//!         layout::size = (100, 40);
//!         widget::background_color = color;
//!     }
//! }
//!
//! # let _scope = APP.defaults();
//! # let _ =
//! Window! {
//!     child = Stack!(top_to_bottom, 5, ui_vec![
//!         sample(hex!(#00F)),
//!         sample(rgb(0, 0, 255)),
//!         sample(rgb(0.0, 0.0, 1.0)),
//!         sample(colors::BLUE),
//!         sample(hsv(240.deg(), 100.pct(), 100.pct())),
//!         sample(hsl(240.deg(), 100.pct(), 50.pct())),
//!     ]);
//! }
//! # ;
//! ```
//!
//! The [`Rgba`] type also provides methods for basic color manipulation and mixing.
//!
//! ```
//! # use zng::prelude::*;
//! # fn sample(_: impl IntoVar<color::Rgba>) -> impl UiNode {
//! # widget::node::NilUiNode
//! # }
//! # let _ = ui_vec![
//! sample(colors::GREEN.darken(50.pct())),
//! sample(colors::GREEN),
//! sample(colors::GREEN.lighten(50.pct())),
//! sample(colors::GREEN.desaturate(50.pct())),
//! sample(colors::GREEN.with_alpha(50.pct()).mix_normal(colors::BLUE)),
//! # ];
//! ```
//!
//! Color mixing methods apply the color over the parameter, that is `foreground.mix_normal(background)`.
//!
//! # Color Filters
//!
//! The [`filter`] module provides implementation of pixel filter graphical effects that you may be
//! familiar with from CSS.
//!
//! ```
//! use zng::prelude::*;
//!
//! # let _scope = APP.defaults();
//! # let _ =
//! Window! {
//!     clear_color = colors::BLACK.transparent();
//!     color::filter::opacity = 50.pct();
//!     child = Text!("translucent window");
//! }
//! # ;
//! ```
//!
//! The example above applies [`filter::opacity`] on the window, making it translucent in view-process
//! implementations that support transparent windows.
//!
//! [`filter::opacity`]: fn@filter::opacity
//!
//! # Gradients
//!
//! The [`gradient`] module provides implementation of linear, radial and conic gradients. Usually the
//! gradient nodes are wrapped in some other property like [`widget::background_conic`], but they can be used directly.
//!
//! [`widget::background_conic`]: fn@crate::widget::background_conic
//!
//! ```
//! use zng::prelude::*;
//!
//! # let _scope = APP.defaults();
//! # let _ =
//! Window! {
//!     widget::background = color::gradient::conic_gradient(50.pct(), 45.deg(), color::gradient::stops![
//!         colors::GREEN, (colors::RED, 30.pct()), colors::BLUE
//!     ]);
//!     // OR
//!     widget::background_conic = {
//!         center: 50.pct(),
//!         angle: 45.deg(),
//!         stops: color::gradient::stops![
//!             colors::GREEN, (colors::RED, 30.pct()), colors::BLUE
//!         ],
//!     };
//! }
//! # ;
//! ```
//!
//! See [`gradient::stops!`] for the macro syntax.
//!
//! # Full API
//!
//! See [`zng_color`], [`zng_wgt_filter`] and [`zng_wgt_fill`] for the full API.

pub use zng_color::{
    colors, hex, hsl, hsla, hsla_linear_sampler, hsla_sampler, hsv, hsva, lerp_space, light_dark, rgb, rgba, rgba_sampler, web_colors,
    with_lerp_space, ColorScheme, Hsla, Hsva, LerpSpace, LightDark, LightDarkVarExt, MixAdjust, MixBlendMode, PreMulRgba,
    RenderMixBlendMode, Rgba, COLOR_SCHEME_VAR,
};

pub use zng_wgt::{accent_color, base_color, color_scheme};

pub use zng_wgt_fill::node::flood;

/// Color filter types and properties.
pub mod filter {
    pub use zng_color::filter::{ColorMatrix, Filter, RenderFilter};

    pub use zng_wgt_filter::{
        backdrop_blur, backdrop_brightness, backdrop_color_matrix, backdrop_contrast, backdrop_filter, backdrop_grayscale,
        backdrop_hue_rotate, backdrop_invert, backdrop_saturate, backdrop_sepia, blur, brightness, child_filter, child_mix_blend,
        child_opacity, color_matrix, contrast, drop_shadow, filter, grayscale, hue_rotate, invert_color, mix_blend, opacity, saturate,
        sepia,
    };
}

/// Color gradient types and nodes.
pub mod gradient {
    pub use zng_color::gradient::{
        stops, ColorStop, ExtendMode, GradientRadius, GradientRadiusBase, GradientStop, GradientStops, LinearGradientAxis,
        RenderExtendMode, RenderGradientStop,
    };

    pub use zng_wgt_fill::node::{
        conic_gradient, gradient, linear_gradient, radial_gradient, ConicGradient, GradientBuilder, LinearGradient, RadialGradient,
        TiledConicGradient, TiledLinearGradient, TiledRadialGradient,
    };
}