Iced Canvas Update Function Rectangle: How do calculate bounds to fit around text

help
1

I have an iced program that displays a line graph of data. On the canvas below the graph I list 4 time periods, 90 Days, 180 Days, 365 Days and All Days as Text. In the canvas program update function I create bounding rectangles and the appropriate code to make the 4 text items clickable and in turn change the time span displayed in the graph. It works but I could not figure out how do calculate the x, y, width & height of the bounding rectangles. So, I had to assign ballpark values then through visual testing make adjustments. How do I determine the size of the text in pixels, or is there a good rule of thumb, so that I can then just perform simple addition and subtraction from the text position to get bounding rectangle values that run along the left, right, top and bottom edges of the text? Below is the code that displays the text, the text structure values being used via a function and the bounding rectangles being used in the update function.

    let content1: String = "90 Days".to_string();
    let position1 = Point { x: 240.0 , y: 760.0 };
    frame.fill_text(button_label(content1, position1, color90));
    let content1: String = "180 Days".to_string();
    let position1 = Point { x: 380.0 , y: 760.0 };
    frame.fill_text(button_label(content1, position1, color180));
    let content1: String = "365 Days".to_string();
    let position1 = Point { x: 520.0 , y: 760.0 };
    frame.fill_text(button_label(content1, position1, color365));
    let content1: String = "All Days".to_string();
    let position1 = Point { x: 660.0 , y: 760.0 };
    frame.fill_text(button_label(content1, position1, color_all));

pub fn button_label(content: String, position:  Point, text_color: Color) -> Text {
    Text {
        content: content,
        position: position,
        max_width: 80.0,
        color: text_color,
        size: iced::Pixels(16.0),
        line_height: iced::advanced::text::LineHeight::Absolute(iced::Pixels(20.0)),
        font: iced::Font::default(),
        align_x: iced::advanced::text::Alignment::Center,
        align_y: iced::alignment::Vertical::Center,
        shaping: iced::advanced::text::Shaping::Auto,
    }
}

// update function in "impl canvas::Program<Message> for LineGraph"
    fn update(
        &self,
        _state: &mut Self::State,
        event: &iced::Event,
        bounds: Rectangle,
        cursor: Cursor,
    ) -> Option<iced::widget::Action<Message>>   {

        let text_bounds_90 = Rectangle{x: 210.0, y: 755.0, width: 65.0, height: 10.0};             
        let text_bounds_180 = Rectangle{x: 350.0, y: 755.0, width: 65.0, height: 10.0};             
        let text_bounds_365 = Rectangle{x: 490.0, y: 755.0, width: 65.0, height: 10.0};             
        let text_bounds_all = Rectangle{x: 630.0, y: 755.0, width: 65.0, height: 10.0};
2

that's what text shaping is for.

it is not a simple calculation, many qurks and nuances must be considered to get a good result, for example, a font may have kerning rules and glyph substituion rules (e.g. ligatures), unicode also has complicated rules for combining characters.

so it is not a cheap operation either. you probably want to pre-calculate it for each label you want to draw, instead of measurement per-frame.

luckily, I have not been needing to do manual text shaping and measurement myself, but the text shaping engine of iced is exposed in the iced_core::text and iced_graphics::text submodules. I think the iced crate re-exports some of the text shaping apis too.

I think the iced_graphics::text::Paragraph struct can be used to do the text shaping and measurement, specifically, I believe min_bounds() is likely the api you need. but that's all I can figure out for now without delving into the rabbit hole too much.