Handle a lot more layout options

expenses · expenses · commit 94cda8e43b3d · 2025-09-24T09:55:31.000+02:00
diff --git a/internal/renderers/femtovg/fonts.rs b/internal/renderers/femtovg/fonts.rs
@@ -7,7 +7,11 @@ use crate::{PhysicalLength, PhysicalPoint};
 use core::num::NonZeroUsize;
 use femtovg::TextContext;
 use i_slint_common::sharedfontique::{self, parley};
-use i_slint_core::{items::TextHorizontalAlignment, lengths::LogicalLength};
+use i_slint_core::{
+    graphics::FontRequest,
+    items::{TextHorizontalAlignment, TextVerticalAlignment, TextWrap},
+    lengths::LogicalLength,
+};
 use std::cell::RefCell;
 use std::collections::HashMap;
 
@@ -42,34 +46,85 @@ thread_local! {
     pub static FONT_CACHE: RefCell<FontCache> = RefCell::new(Default::default())
 }
 
-pub fn layout(
-    text: &str,
-    max_width: Option<PhysicalLength>,
-    horizontal_align: TextHorizontalAlignment,
-    stroke: Option<sharedfontique::BrushTextStrokeStyle>,
-    selection: Option<std::ops::Range<usize>>,
-) -> parley::Layout<sharedfontique::Brush> {
+pub struct LayoutOptions {
+    pub max_width: Option<PhysicalLength>,
+    pub horizontal_align: TextHorizontalAlignment,
+    pub stroke: Option<sharedfontique::BrushTextStrokeStyle>,
+    pub selection: Option<std::ops::Range<usize>>,
+    pub font_request: Option<FontRequest>,
+    pub text_wrap: TextWrap,
+}
+
+impl Default for LayoutOptions {
+    fn default() -> Self {
+        Self {
+            max_width: None,
+            horizontal_align: TextHorizontalAlignment::Left,
+            stroke: None,
+            selection: None,
+            font_request: None,
+            text_wrap: TextWrap::WordWrap,
+        }
+    }
+}
+
+pub fn layout(text: &str, options: LayoutOptions) -> parley::Layout<sharedfontique::Brush> {
     let mut font_context = sharedfontique::font_context();
     let mut layout_context = sharedfontique::layout_context();
 
     let mut builder = layout_context.ranged_builder(&mut font_context, text, 1.0, true);
-    builder.push_default(parley::StyleProperty::FontSize(16.0));
+    if let Some(ref font_request) = options.font_request {
+        if let Some(family) = &font_request.family {
+            builder.push_default(parley::StyleProperty::FontStack(
+                parley::style::FontStack::Single(parley::style::FontFamily::Named(
+                    family.as_str().into(),
+                )),
+            ));
+        }
+        if let Some(weight) = font_request.weight {
+            builder.push_default(parley::StyleProperty::FontWeight(
+                parley::style::FontWeight::new(weight as f32),
+            ));
+        }
+        if let Some(letter_spacing) = font_request.letter_spacing {
+            builder.push_default(parley::StyleProperty::LetterSpacing(letter_spacing.get()));
+        }
+        builder.push_default(parley::StyleProperty::FontStyle(if font_request.italic {
+            parley::style::FontStyle::Italic
+        } else {
+            parley::style::FontStyle::Normal
+        }));
+    }
+    let pixel_size = options
+        .font_request
+        .and_then(|font_request| font_request.pixel_size)
+        .unwrap_or(DEFAULT_FONT_SIZE);
+    builder.push_default(parley::StyleProperty::FontSize(pixel_size.get()));
+    builder.push_default(parley::StyleProperty::WordBreak(match options.text_wrap {
+        TextWrap::NoWrap => parley::style::WordBreakStrength::KeepAll,
+        TextWrap::WordWrap => parley::style::WordBreakStrength::Normal,
+        TextWrap::CharWrap => parley::style::WordBreakStrength::BreakAll,
+    }));
+
     builder.push_default(parley::StyleProperty::Brush(sharedfontique::Brush {
-        stroke,
+        stroke: options.stroke,
         ..Default::default()
     }));
-    if let Some(selection) = selection {
+    if let Some(selection) = options.selection {
         builder.push(
-            parley::StyleProperty::Brush(sharedfontique::Brush { stroke, is_selected: true }),
+            parley::StyleProperty::Brush(sharedfontique::Brush {
+                stroke: options.stroke,
+                is_selected: true,
+            }),
             selection,
         );
     }
 
     let mut layout: parley::Layout<sharedfontique::Brush> = builder.build(text);
-    layout.break_all_lines(max_width.map(|max_width| max_width.get()));
+    layout.break_all_lines(options.max_width.map(|max_width| max_width.get()));
     layout.align(
-        max_width.map(|max_width| max_width.get()),
-        match horizontal_align {
+        options.max_width.map(|max_width| max_width.get()),
+        match options.horizontal_align {
             TextHorizontalAlignment::Left => parley::Alignment::Left,
             TextHorizontalAlignment::Center => parley::Alignment::Middle,
             TextHorizontalAlignment::Right => parley::Alignment::Right,
@@ -110,3 +165,15 @@ pub fn get_cursor_location_and_size(
 
     cursor_point
 }
+
+pub fn get_offset(
+    vertical_align: TextVerticalAlignment,
+    max_height: PhysicalLength,
+    layout: &parley::Layout<sharedfontique::Brush>,
+) -> f32 {
+    match vertical_align {
+        TextVerticalAlignment::Top => 0.0,
+        TextVerticalAlignment::Center => (max_height.get() - layout.height()) / 2.0,
+        TextVerticalAlignment::Bottom => max_height.get() - layout.height(),
+    }
+}
diff --git a/internal/renderers/femtovg/itemrenderer.rs b/internal/renderers/femtovg/itemrenderer.rs
@@ -18,7 +18,7 @@ use i_slint_core::item_rendering::{
 };
 use i_slint_core::items::{
     self, Clip, FillRule, ImageRendering, ImageTiling, ItemRc, Layer, Opacity, RenderingResult,
-    TextHorizontalAlignment, TextStrokeStyle, TextVerticalAlignment,
+    TextStrokeStyle,
 };
 use i_slint_core::lengths::{
     LogicalBorderRadius, LogicalLength, LogicalPoint, LogicalRect, LogicalSize, LogicalVector,
@@ -264,18 +264,6 @@ fn draw_glyphs<R: femtovg::Renderer + TextureImporter>(
     }
 }
 
-fn get_offset(
-    vertical_align: TextVerticalAlignment,
-    max_height: PhysicalLength,
-    layout: &parley::Layout<sharedfontique::Brush>,
-) -> f32 {
-    match vertical_align {
-        TextVerticalAlignment::Top => 0.0,
-        TextVerticalAlignment::Center => (max_height.get() - layout.height()) / 2.0,
-        TextVerticalAlignment::Bottom => max_height.get() - layout.height(),
-    }
-}
-
 impl<'a, R: femtovg::Renderer + TextureImporter> ItemRenderer for GLItemRenderer<'a, R> {
     fn draw_rectangle(
         &mut self,
@@ -407,7 +395,7 @@ impl<'a, R: femtovg::Renderer + TextureImporter> ItemRenderer for GLItemRenderer
     fn draw_text(
         &mut self,
         text: Pin<&dyn RenderText>,
-        _self_rc: &ItemRc,
+        self_rc: &ItemRc,
         size: LogicalSize,
         _cache: &CachedRenderingData,
     ) {
@@ -425,12 +413,12 @@ impl<'a, R: femtovg::Renderer + TextureImporter> ItemRenderer for GLItemRenderer
         let (horizontal_align, vertical_align) = text.alignment();
         let color = text.color();
         // TODO
-        let _wrap = text.wrap();
-        // TODO
         let _overflow = text.overflow();
         // TODO
         let _letter_spacing = text.letter_spacing();
 
+        let font_request = text.font_request(self_rc);
+
         let text_path = rect_to_path((size * self.scale_factor).into());
         let paint = match self.brush_to_paint(color, &text_path) {
             Some(paint) => paint,
@@ -462,25 +450,29 @@ impl<'a, R: femtovg::Renderer + TextureImporter> ItemRenderer for GLItemRenderer
 
         let layout = fonts::layout(
             text.text().as_str(),
-            Some(max_width),
-            horizontal_align,
-            stroke_paint.is_some().then_some(stroke_style).map(|style| match style {
-                TextStrokeStyle::Outside => sharedfontique::BrushTextStrokeStyle::Outside,
-                TextStrokeStyle::Center => sharedfontique::BrushTextStrokeStyle::Center,
-            }),
-            None,
+            fonts::LayoutOptions {
+                horizontal_align,
+                max_width: Some(max_width),
+                stroke: stroke_paint.is_some().then_some(stroke_style).map(|style| match style {
+                    TextStrokeStyle::Outside => sharedfontique::BrushTextStrokeStyle::Outside,
+                    TextStrokeStyle::Center => sharedfontique::BrushTextStrokeStyle::Center,
+                }),
+                font_request: Some(font_request),
+                text_wrap: text.wrap(),
+                ..Default::default()
+            },
         );
 
         let mut canvas = self.canvas.borrow_mut();
-        let offset = get_offset(vertical_align, max_height, &layout);
+        let offset = fonts::get_offset(vertical_align, max_height, &layout);
 
         draw_glyphs(&layout, &mut canvas, &paint, offset, Color::default(), Color::default());
     }
 
     fn draw_text_input(
         &mut self,
         text_input: Pin<&items::TextInput>,
-        _self_rc: &ItemRc,
+        self_rc: &ItemRc,
         size: LogicalSize,
     ) {
         let width = size.width_length() * self.scale_factor;
@@ -493,6 +485,8 @@ impl<'a, R: femtovg::Renderer + TextureImporter> ItemRenderer for GLItemRenderer
             return;
         }
 
+        let font_request = text_input.font_request(self_rc);
+
         let visual_representation = text_input.visual_representation(None);
 
         let paint = match self.brush_to_paint(
@@ -521,12 +515,14 @@ impl<'a, R: femtovg::Renderer + TextureImporter> ItemRenderer for GLItemRenderer
 
         let layout = fonts::layout(
             &text,
-            Some(width),
-            TextHorizontalAlignment::Left,
-            None,
-            Some(min_select..max_select),
+            fonts::LayoutOptions {
+                max_width: Some(width),
+                selection: Some(min_select..max_select),
+                font_request: Some(font_request),
+                ..Default::default()
+            },
         );
-        let offset = get_offset(text_input.vertical_alignment(), height, &layout);
+        let offset = fonts::get_offset(text_input.vertical_alignment(), height, &layout);
         draw_glyphs(
             &layout,
             &mut canvas,
@@ -979,7 +975,7 @@ impl<'a, R: femtovg::Renderer + TextureImporter> ItemRenderer for GLItemRenderer
     }
 
     fn draw_string(&mut self, string: &str, color: Color) {
-        let layout = fonts::layout(string, None, TextHorizontalAlignment::Left, None, None);
+        let layout = fonts::layout(string, Default::default());
         let paint = femtovg::Paint::color(to_femtovg_color(&color));
         let mut canvas = self.canvas.borrow_mut();
         draw_glyphs(&layout, &mut canvas, &paint, 0.0, color, color);
diff --git a/internal/renderers/femtovg/lib.rs b/internal/renderers/femtovg/lib.rs
@@ -15,7 +15,7 @@ use i_slint_core::graphics::{euclid, rendering_metrics_collector::RenderingMetri
 use i_slint_core::graphics::{BorderRadius, Rgba8Pixel};
 use i_slint_core::graphics::{FontRequest, SharedPixelBuffer};
 use i_slint_core::item_rendering::ItemRenderer;
-use i_slint_core::items::{TextHorizontalAlignment, TextWrap};
+use i_slint_core::items::TextWrap;
 use i_slint_core::lengths::{
     LogicalLength, LogicalPoint, LogicalRect, LogicalSize, PhysicalPx, ScaleFactor,
 };
@@ -281,19 +281,20 @@ impl<B: GraphicsBackend> FemtoVGRenderer<B> {
 impl<B: GraphicsBackend> RendererSealed for FemtoVGRenderer<B> {
     fn text_size(
         &self,
-        // TODO
-        _font_request: i_slint_core::graphics::FontRequest,
+        font_request: i_slint_core::graphics::FontRequest,
         text: &str,
         max_width: Option<LogicalLength>,
         scale_factor: ScaleFactor,
-        _text_wrap: TextWrap, //TODO: Add support for char-wrap
+        text_wrap: TextWrap,
     ) -> LogicalSize {
         let layout = fonts::layout(
             text,
-            max_width.map(|max_width| max_width * scale_factor),
-            TextHorizontalAlignment::Left,
-            None,
-            None,
+            fonts::LayoutOptions {
+                max_width: max_width.map(|max_width| max_width * scale_factor),
+                text_wrap,
+                font_request: Some(font_request),
+                ..Default::default()
+            },
         );
         LogicalSize::new(layout.width(), layout.height())
     }
@@ -310,22 +311,32 @@ impl<B: GraphicsBackend> RendererSealed for FemtoVGRenderer<B> {
         &self,
         text_input: Pin<&i_slint_core::items::TextInput>,
         pos: LogicalPoint,
-        // TODO
-        _font_request: FontRequest,
+        font_request: FontRequest,
         scale_factor: ScaleFactor,
     ) -> usize {
         let pos = pos * scale_factor;
         let text = text_input.text();
 
-        // TODO
-        let result = text.len();
-
         let width = text_input.width() * scale_factor;
         let height = text_input.height() * scale_factor;
         if width.get() <= 0. || height.get() <= 0. || pos.y < 0. {
             return 0;
         }
 
+        let layout = fonts::layout(
+            &text,
+            fonts::LayoutOptions {
+                font_request: Some(font_request),
+                max_width: Some(width),
+
+                ..Default::default()
+            },
+        );
+        let _offset = fonts::get_offset(text_input.vertical_alignment(), height, &layout);
+
+        // TODO
+        let result = text.len();
+
         let visual_representation = text_input.visual_representation(None);
 
         visual_representation.map_byte_offset_from_byte_offset_in_visual_text(result)
@@ -351,7 +362,10 @@ impl<B: GraphicsBackend> RendererSealed for FemtoVGRenderer<B> {
             );
         }
 
-        let layout = fonts::layout(&text, Some(width), TextHorizontalAlignment::Left, None, None);
+        let layout = fonts::layout(
+            &text,
+            fonts::LayoutOptions { max_width: Some(width), ..Default::default() },
+        );
         let cursor_position = fonts::get_cursor_location_and_size(&layout, byte_offset, 0.0)
             .map(|location| location.0);
 
