feat(segmented-button): Configurable fonts

This commit is contained in:
Michael Aaron Murphy 2022-12-28 23:39:29 +01:00 committed by Ashley Wulber
parent 5f9ff54352
commit 052d9f655b
2 changed files with 19 additions and 8 deletions

View file

@ -14,6 +14,7 @@ pub fn view_switcher<Message, Data>(
SegmentedButton::new(&state.inner) SegmentedButton::new(&state.inner)
.height(Length::Units(48)) .height(Length::Units(48))
.style(crate::theme::SegmentedButton::ViewSwitcher) .style(crate::theme::SegmentedButton::ViewSwitcher)
.font_active(crate::font::FONT_SEMIBOLD)
} }
/// Appears as a selection of choices for choosing between. /// Appears as a selection of choices for choosing between.
@ -26,4 +27,5 @@ pub fn segmented_selection<Message, Data>(
SegmentedButton::new(&state.inner) SegmentedButton::new(&state.inner)
.height(Length::Units(32)) .height(Length::Units(32))
.style(crate::theme::SegmentedButton::Selection) .style(crate::theme::SegmentedButton::Selection)
.font_active(crate::font::FONT_SEMIBOLD)
} }

View file

@ -72,12 +72,18 @@ struct PrivateWidgetState {
#[derive(Setters)] #[derive(Setters)]
pub struct SegmentedButton<'a, Message, Renderer> pub struct SegmentedButton<'a, Message, Renderer>
where where
Renderer: iced_native::Renderer, Renderer: iced_native::Renderer + iced_native::text::Renderer,
Renderer::Theme: StyleSheet, Renderer::Theme: StyleSheet,
{ {
/// Contains application state also used for drawing. /// Contains application state also used for drawing.
#[setters(skip)] #[setters(skip)]
state: &'a WidgetState, state: &'a WidgetState,
/// The desired font for active tabs.
font_active: Renderer::Font,
/// The desired font for hovered tabs.
font_hovered: Renderer::Font,
/// The desired font for inactive tabs.
font_inactive: Renderer::Font,
/// The desired width of the widget. /// The desired width of the widget.
width: Length, width: Length,
/// The desired height of the widget. /// The desired height of the widget.
@ -94,13 +100,16 @@ where
impl<'a, Message, Renderer> SegmentedButton<'a, Message, Renderer> impl<'a, Message, Renderer> SegmentedButton<'a, Message, Renderer>
where where
Renderer: iced_native::Renderer, Renderer: iced_native::Renderer + iced_native::text::Renderer,
Renderer::Theme: StyleSheet, Renderer::Theme: StyleSheet,
{ {
#[must_use] #[must_use]
pub fn new(state: &'a WidgetState) -> Self { pub fn new(state: &'a WidgetState) -> Self {
Self { Self {
state, state,
font_active: Renderer::Font::default(),
font_hovered: Renderer::Font::default(),
font_inactive: Renderer::Font::default(),
height: Length::Units(32), height: Length::Units(32),
width: Length::Fill, width: Length::Fill,
spacing: 0, spacing: 0,
@ -123,7 +132,7 @@ pub fn segmented_button<Message, Renderer, Data>(
state: &State<Data>, state: &State<Data>,
) -> SegmentedButton<Message, Renderer> ) -> SegmentedButton<Message, Renderer>
where where
Renderer: iced_native::Renderer, Renderer: iced_native::Renderer + iced_native::text::Renderer,
Renderer::Theme: StyleSheet, Renderer::Theme: StyleSheet,
{ {
SegmentedButton::new(&state.inner) SegmentedButton::new(&state.inner)
@ -258,12 +267,12 @@ where
bounds.width = button_width; bounds.width = button_width;
bounds.x += num as f32 * button_width; bounds.x += num as f32 * button_width;
let button_appearance = if self.state.active == key { let (button_appearance, font) = if self.state.active == key {
appearance.button_active (appearance.button_active, &self.font_active)
} else if state.hovered == key { } else if state.hovered == key {
appearance.button_hover (appearance.button_hover, &self.font_hovered)
} else { } else {
appearance.button_inactive (appearance.button_inactive, &self.font_inactive)
}; };
let x = bounds.center_x(); let x = bounds.center_x();
@ -313,7 +322,7 @@ where
size: f32::from(renderer.default_size()), size: f32::from(renderer.default_size()),
bounds: Rectangle { x, y, ..bounds }, bounds: Rectangle { x, y, ..bounds },
color: button_appearance.text_color, color: button_appearance.text_color,
font: Default::default(), font: font.clone(),
horizontal_alignment: Horizontal::Center, horizontal_alignment: Horizontal::Center,
vertical_alignment: Vertical::Center, vertical_alignment: Vertical::Center,
}); });