Functions with arguments
To reuse similar properties in different classes, functions can be used.
stylesheet! {
fn paddings() {
padding = Px(1) Px(2);
}
class my_class {
color = red;
paddings();
}
class my_another_class {
paddings();
}
}
Functions can take arguments, but the arguments can only be numbers (as "f32") or strings (as "&str").
Number arguments can be used in unit-values.
stylesheet! {
fn paddings(v: f32, h: f32) {
padding = Px(v) Px(h);
}
class my_class {
color = red;
paddings(1, 2);
}
}
String arguments can be used in colors.
stylesheet! {
fn text_color(c: &str) {
color = Color(c);
}
class my_class {
text_color("00d2ff");
}
}
Dynamic Styling
Besides classes, a special kind of functions can also be used in templates.
This kind of functions should contain exactly one argument, and declared with "style" instead of "fn".
stylesheet! {
style text_color(c: &str) {
color = Color(c);
}
}
#[component(Backend = DomBackend)]
struct MyWebsite {
template: template! {
<div style:text_color=&{ self.color }> "My Website" </div>
},
color: String,
}
This can be used when some property values should be dynamically calculated.
