azul_layout/widgets/
label.rs

1//! Label widget for displaying static text with platform-specific default styling.
2
3use azul_core::dom::{Dom, IdOrClass, IdOrClass::Class, IdOrClassVec};
4use azul_css::dynamic_selector::{CssPropertyWithConditions, CssPropertyWithConditionsVec};
5use azul_css::{
6    props::{
7        basic::*,
8        layout::*,
9        property::{CssProperty, *},
10        style::*,
11    },
12    *,
13};
14
15/// A static text label widget with platform-appropriate default styling.
16#[derive(Debug, Clone)]
17#[repr(C)]
18pub struct Label {
19    pub string: AzString,
20    pub label_style: CssPropertyWithConditionsVec,
21}
22
23const SANS_SERIF_STR: &str = "system:ui";
24const SANS_SERIF: AzString = AzString::from_const_str(SANS_SERIF_STR);
25const SANS_SERIF_FAMILIES: &[StyleFontFamily] = &[StyleFontFamily::System(SANS_SERIF)];
26const SANS_SERIF_FAMILY: StyleFontFamilyVec =
27    StyleFontFamilyVec::from_const_slice(SANS_SERIF_FAMILIES);
28
29/// Standard label text color (#4C4C4C), matching platform UI defaults.
30const COLOR_4C4C4C: ColorU = ColorU {
31    r: 76,
32    g: 76,
33    b: 76,
34    a: 255,
35};
36
37static LABEL_STYLE_WINDOWS: &[CssPropertyWithConditions] = &[
38    CssPropertyWithConditions::simple(CssProperty::const_display(LayoutDisplay::Flex)),
39    CssPropertyWithConditions::simple(CssProperty::const_flex_direction(
40        LayoutFlexDirection::Column,
41    )),
42    CssPropertyWithConditions::simple(CssProperty::const_justify_content(
43        LayoutJustifyContent::Center,
44    )),
45    CssPropertyWithConditions::simple(CssProperty::const_align_items(LayoutAlignItems::Center)),
46    CssPropertyWithConditions::simple(CssProperty::const_flex_grow(LayoutFlexGrow::const_new(1))),
47    CssPropertyWithConditions::simple(CssProperty::const_text_color(StyleTextColor {
48        inner: COLOR_4C4C4C,
49    })),
50    CssPropertyWithConditions::simple(CssProperty::const_font_size(StyleFontSize::const_px(13))),
51    CssPropertyWithConditions::simple(CssProperty::const_text_align(StyleTextAlign::Center)),
52    CssPropertyWithConditions::simple(CssProperty::const_font_family(SANS_SERIF_FAMILY)),
53];
54
55static LABEL_STYLE_LINUX: &[CssPropertyWithConditions] = &[
56    CssPropertyWithConditions::simple(CssProperty::const_display(LayoutDisplay::Flex)),
57    CssPropertyWithConditions::simple(CssProperty::const_flex_direction(
58        LayoutFlexDirection::Column,
59    )),
60    CssPropertyWithConditions::simple(CssProperty::const_justify_content(
61        LayoutJustifyContent::Center,
62    )),
63    CssPropertyWithConditions::simple(CssProperty::const_align_items(LayoutAlignItems::Center)),
64    CssPropertyWithConditions::simple(CssProperty::const_flex_grow(LayoutFlexGrow::const_new(1))),
65    CssPropertyWithConditions::simple(CssProperty::const_text_color(StyleTextColor {
66        inner: COLOR_4C4C4C,
67    })),
68    CssPropertyWithConditions::simple(CssProperty::const_font_size(StyleFontSize::const_px(13))),
69    CssPropertyWithConditions::simple(CssProperty::const_text_align(StyleTextAlign::Center)),
70    CssPropertyWithConditions::simple(CssProperty::const_font_family(SANS_SERIF_FAMILY)),
71];
72
73static LABEL_STYLE_MAC: &[CssPropertyWithConditions] = &[
74    CssPropertyWithConditions::simple(CssProperty::const_display(LayoutDisplay::Flex)),
75    CssPropertyWithConditions::simple(CssProperty::const_flex_direction(
76        LayoutFlexDirection::Column,
77    )),
78    CssPropertyWithConditions::simple(CssProperty::const_justify_content(
79        LayoutJustifyContent::Center,
80    )),
81    CssPropertyWithConditions::simple(CssProperty::const_align_items(LayoutAlignItems::Center)),
82    CssPropertyWithConditions::simple(CssProperty::const_flex_grow(LayoutFlexGrow::const_new(1))),
83    CssPropertyWithConditions::simple(CssProperty::const_text_color(StyleTextColor {
84        inner: COLOR_4C4C4C,
85    })),
86    CssPropertyWithConditions::simple(CssProperty::const_font_size(StyleFontSize::const_px(12))),
87    CssPropertyWithConditions::simple(CssProperty::const_text_align(StyleTextAlign::Center)),
88    CssPropertyWithConditions::simple(CssProperty::const_font_family(SANS_SERIF_FAMILY)),
89];
90
91/// No default styling on unsupported platforms (e.g. WASM, FreeBSD);
92/// callers should provide explicit styles via `label_style`.
93static LABEL_STYLE_OTHER: &[CssPropertyWithConditions] = &[];
94
95impl Label {
96    /// Creates a new label with the given text and platform-specific default styling.
97    #[inline]
98    pub fn create(string: AzString) -> Self {
99        Self {
100            string,
101            #[cfg(target_os = "windows")]
102            label_style: CssPropertyWithConditionsVec::from_const_slice(LABEL_STYLE_WINDOWS),
103            #[cfg(target_os = "linux")]
104            label_style: CssPropertyWithConditionsVec::from_const_slice(LABEL_STYLE_LINUX),
105            #[cfg(target_os = "macos")]
106            label_style: CssPropertyWithConditionsVec::from_const_slice(LABEL_STYLE_MAC),
107            #[cfg(not(any(target_os = "windows", target_os = "linux", target_os = "macos")))]
108            label_style: CssPropertyWithConditionsVec::from_const_slice(LABEL_STYLE_OTHER),
109        }
110    }
111
112    /// Replaces `self` with an empty default label, returning the original.
113    #[inline]
114    pub fn swap_with_default(&mut self) -> Self {
115        let mut s = Label::create(AzString::from_const_str(""));
116        core::mem::swap(&mut s, self);
117        s
118    }
119
120    /// Converts this label into a DOM text node with the `__azul-native-label` class.
121    #[inline]
122    pub fn dom(self) -> Dom {
123        static LABEL_CLASS: &[IdOrClass] =
124            &[Class(AzString::from_const_str("__azul-native-label"))];
125
126        Dom::create_text(self.string)
127            .with_ids_and_classes(IdOrClassVec::from_const_slice(LABEL_CLASS))
128            .with_css_props(self.label_style)
129    }
130}
131
132impl From<Label> for Dom {
133    fn from(l: Label) -> Dom {
134        l.dom()
135    }
136}
azul_layout/widgets/label.rs

azul_layout/widgets/
label.rs
