From f56b543a0be1bc3822e9e5ba033f124501489cda Mon Sep 17 00:00:00 2001 From: Candifloss Date: Sun, 9 Nov 2025 15:23:52 +0530 Subject: [PATCH] Change layout - Divide everything into individual components & join them - Needs cleanup --- widget/src/show_popup.rs | 245 +++++++++++++++++++++++---------------- 1 file changed, 143 insertions(+), 102 deletions(-) diff --git a/widget/src/show_popup.rs b/widget/src/show_popup.rs index 18f00a7..0334f92 100644 --- a/widget/src/show_popup.rs +++ b/widget/src/show_popup.rs @@ -55,22 +55,146 @@ impl WeatherPopup { // UI let default_font = "IosevkaTermSlab Nerd Font Mono"; - column![ - container( - Row::with_children(vec![ - Text::new(format!("{city}, {country}")) - .font(Font { - family: Family::Name(default_font), - ..Font::DEFAULT - }) - .size(16) - .color(Color::from_rgb(1.0, 1.0, 1.0)) - .width(Length::Fill) - .align_x(Horizontal::Right) - .into(), - ]) - .width(Length::Fill), - ) + //row1col1 + let icon_text: Text = Text::new(icon_to_nerd_font(&icon_code)) + .font(Font { + family: Family::Name(default_font), + ..Font::DEFAULT + }) + .align_x(Horizontal::Left) + .size(60) + .color(Color::from_rgb(1.0, 1.0, 1.0)) + .into(); + let icon_column = Column::new().push(icon_text).width(Length::FillPortion(1)); + // row1col2row1 + let location_text: Text = Text::new(format!("{city}, {country}")) + .font(Font { + family: Family::Name(default_font), + ..Font::DEFAULT + }) + .size(16) + .color(Color::from_rgb(1.0, 1.0, 1.0)) + .width(Length::Fill) + .align_x(Horizontal::Right) + .into(); + let location_row = Column::new() + .push(location_text) + .width(Length::FillPortion(1)); + + // row1col2row2col1 + let temp_val_text: Text = Text::new(format!("{temperature}")) + .font(Font { + family: Family::Name(default_font), + ..Font::DEFAULT + }) + .size(40) + .color(Color::from_rgb(1.0, 1.0, 1.0)) + .into(); + let temp_val_col = Column::new() + .push(temp_val_text) + .height(40) + .width(Length::Fill); + + // row1col2row2col2row1 + let degree_symbol: Text = Text::new(format!("°")) + .font(Font { + family: Family::Name(default_font), + ..Font::DEFAULT + }) + .size(16) + .color(Color::from_rgb(1.0, 1.0, 1.0)) + .into(); + let degree_symbol_row: Row = + Row::new().push(degree_symbol).height(20).width(10).into(); + + // row1col2row2col2row2 + let unit_symbol: Text = Text::new(format!("{unit}")) + .font(Font { + family: Family::Name(default_font), + ..Font::DEFAULT + }) + .size(16) + .color(Color::from_rgb(1.0, 1.0, 1.0)) + .into(); + let unit_symbol_row: Row = + Row::new().push(unit_symbol).height(20).width(10).into(); + + // row1col2row2col2 + let temp_unit_col: Column = Column::new() + .push(degree_symbol_row) + .push(unit_symbol_row) + .height(40) + .width(10) + .into(); + + // row1col2row2 + let temp_row: Row = Row::new() + .push(temp_val_col) + .push(temp_unit_col) + .height(Length::FillPortion(3)) + .width(Length::Fill); + + let row1col2: Column = Column::new() + .push(location_row) + .push(temp_row) + .height(Length::Fill) + .width(Length::Fill) + .into(); + + // row2col1 + let weather_main_text: Text = Text::new(format!("{weather_main}")) + .font(Font { + family: Family::Name(default_font), + ..Font::DEFAULT + }) + .size(16) + .color(Color::from_rgb(1.0, 1.0, 1.0)) + .width(Length::Fill) + .into(); + let weather_main_col: Column = Column::new() + .push(weather_main_text) + .height(Length::Fill) + .width(Length::FillPortion(3)) + .into(); + + // row2col1 + let weather_descr_text: Text = Text::new(format!("{weather_description}")) + .font(Font { + family: Family::Name(default_font), + ..Font::DEFAULT + }) + .size(16) + .color(Color::from_rgb(1.0, 1.0, 1.0)) + .width(Length::Fill) + .into(); + let weather_descr_col: Column = Column::new() + .push(weather_descr_text) + .height(Length::Fill) + .width(Length::FillPortion(4)) + .into(); + + let row2: Row = Row::new() + .push(weather_main_col) + .push(weather_descr_col) + .height(Length::FillPortion(3)) + .width(Length::Fill) + .into(); + + let row1: Row = Row::new() + .push(icon_column) + .push(row1col2) + .height(Length::FillPortion(8)) + .width(Length::Fill) + .into(); + + let whole_thing: Column = Column::new() + .push(row1) + .push(row2) + .height(Length::Fill) + .width(Length::Fill) + .into(); + + container(whole_thing) .style(|_theme| Style { background: Some(Background::from(Color::from_rgba(0.20, 0.43, 0.55, 0.25))), text_color: Some(Color::from_rgba(1.0, 1.0, 1.0, 0.25)), @@ -86,92 +210,9 @@ impl WeatherPopup { }, }) .width(Length::Fill) - .height(Length::FillPortion(1)), - container( - Row::with_children(vec![ - Text::new(icon_to_nerd_font(&icon_code)) - .font(Font { - family: Family::Name(default_font), - ..Font::DEFAULT - }) - .align_x(Horizontal::Left) - .size(40) - .color(Color::from_rgb(1.0, 1.0, 1.0)) - .into(), - Space::with_width(Length::Fill).into(), - Text::new(format!("{temperature}°{unit}")) - .font(Font { - family: Family::Name(default_font), - ..Font::DEFAULT - }) - .size(32) - .color(Color::from_rgb(1.0, 1.0, 1.0)) - .into(), - ]) - .width(Length::Fill), - ) - .style(|_theme| Style { - background: Some(Background::from(Color::from_rgba(0.20, 0.43, 0.55, 0.25))), - text_color: Some(Color::from_rgba(1.0, 1.0, 1.0, 0.25)), - border: Border { - color: Color::TRANSPARENT, - width: 0.0, - radius: border::Radius::from(10.0), - }, - shadow: Shadow { - color: Color::TRANSPARENT, - offset: Vector { x: 0.0, y: 0.0 }, - blur_radius: 0.0, - }, - }) - .width(Length::Fill) - .height(Length::FillPortion(2)), - container( - Row::with_children(vec![ - Text::new(format!("{weather_main}")) - .font(Font { - family: Family::Name(default_font), - ..Font::DEFAULT - }) - .size(16) - .color(Color::from_rgb(1.0, 1.0, 1.0)) - .width(Length::FillPortion(3)) - .into(), - Text::new(format!("{weather_description}")) - .font(Font { - family: Family::Name(default_font), - ..Font::DEFAULT - }) - .size(16) - .color(Color::from_rgb(1.0, 1.0, 1.0)) - .width(Length::FillPortion(4)) - .into(), - ]) - .width(Length::Fill), - ) - .style(|_theme| Style { - background: Some(Background::from(Color::from_rgba(0.20, 0.43, 0.55, 0.25))), - text_color: Some(Color::from_rgba(1.0, 1.0, 1.0, 0.25)), - border: Border { - color: Color::TRANSPARENT, - width: 0.0, - radius: border::Radius::from(10.0), - }, - shadow: Shadow { - color: Color::TRANSPARENT, - offset: Vector { x: 0.0, y: 0.0 }, - blur_radius: 0.0, - }, - }) - .width(Length::Fill) - .height(Length::FillPortion(1)), - ] - .width(Length::Fill) - .height(Length::Fill) - .spacing(0) - .padding(0) - .align_x(Horizontal::Center) - .into() + .height(Length::Fill) + .padding(10) + .into() } }