diff --git a/examples/WidgetIDReturn/Cargo.toml b/examples/WidgetIDReturn/Cargo.toml index 929961ec..dd9feb5b 100644 --- a/examples/WidgetIDReturn/Cargo.toml +++ b/examples/WidgetIDReturn/Cargo.toml @@ -11,7 +11,5 @@ iced_aw = { workspace = true, features = [ "number_input", "icons", ] } -iced = { workspace = true, features = [ - "wgpu", -] } +iced.workspace=true num-traits = "0.2.16" diff --git a/examples/badge/Cargo.toml b/examples/badge/Cargo.toml index 72a1d1fd..a5d9acef 100644 --- a/examples/badge/Cargo.toml +++ b/examples/badge/Cargo.toml @@ -12,6 +12,4 @@ iced_aw = { workspace = true, features = [ "icons", ] } -iced = { workspace = true, features = [ - "wgpu", -] } +iced.workspace=true diff --git a/examples/card/Cargo.toml b/examples/card/Cargo.toml index ee0d0aee..7052edb4 100644 --- a/examples/card/Cargo.toml +++ b/examples/card/Cargo.toml @@ -10,6 +10,5 @@ edition = "2021" iced_aw = { workspace = true, features = [ "card", "icons" ] } -iced = { workspace = true, features = [ - "wgpu", -] } +iced.workspace=true + diff --git a/examples/color_picker/Cargo.toml b/examples/color_picker/Cargo.toml index d1ff5792..aca43735 100644 --- a/examples/color_picker/Cargo.toml +++ b/examples/color_picker/Cargo.toml @@ -10,6 +10,5 @@ edition = "2021" iced_aw = { workspace = true, features = [ "color_picker", ] } -iced = { workspace = true, features = [ - "wgpu", -] } +iced.workspace=true + diff --git a/examples/drop_down/Cargo.toml b/examples/drop_down/Cargo.toml index a8dd458a..7e647a9e 100644 --- a/examples/drop_down/Cargo.toml +++ b/examples/drop_down/Cargo.toml @@ -10,6 +10,4 @@ iced_aw = { workspace = true, features = [ "drop_down", "icons", ] } -iced = { workspace = true, features = [ - "wgpu", -] } +iced.workspace=true diff --git a/examples/floating_element multioverlay/Cargo.toml b/examples/floating_element multioverlay/Cargo.toml index 4ad4b830..c2e64ff9 100644 --- a/examples/floating_element multioverlay/Cargo.toml +++ b/examples/floating_element multioverlay/Cargo.toml @@ -11,6 +11,4 @@ iced_aw = { workspace = true, features = [ "floating_element", "icons", ] } -iced = { workspace = true, features = [ - "wgpu", -] } +iced.workspace=true diff --git a/examples/font_loading/Cargo.toml b/examples/font_loading/Cargo.toml index 9f97258b..ae41d710 100644 --- a/examples/font_loading/Cargo.toml +++ b/examples/font_loading/Cargo.toml @@ -7,8 +7,6 @@ edition = "2021" # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html [dependencies] -iced = { workspace = true, features = [ - "wgpu", -] } +iced.workspace=true iced_aw = { workspace = true, features = [ "icons" ] } diff --git a/examples/menu/Cargo.toml b/examples/menu/Cargo.toml index 506c9b2e..b62673bb 100644 --- a/examples/menu/Cargo.toml +++ b/examples/menu/Cargo.toml @@ -10,4 +10,4 @@ iced_aw = { workspace = true, features = [ "quad", "icons" ] } -iced = {workspace = true, features = ["svg", "wgpu"]} +iced = {workspace = true, features = ["svg"]} diff --git a/examples/multiple_modals/Cargo.toml b/examples/multiple_modals/Cargo.toml index c255afea..fb06a0a9 100644 --- a/examples/multiple_modals/Cargo.toml +++ b/examples/multiple_modals/Cargo.toml @@ -8,6 +8,4 @@ edition = "2021" [dependencies] iced_aw = { workspace = true, features = ["card", "modal", "icons"] } -iced = { workspace = true, features = [ - "wgpu", -] } +iced.workspace = true diff --git a/examples/multiple_modals/src/main.rs b/examples/multiple_modals/src/main.rs index 2c2a3b36..b901a9fe 100644 --- a/examples/multiple_modals/src/main.rs +++ b/examples/multiple_modals/src/main.rs @@ -8,7 +8,7 @@ fn main() -> iced::Result { window: window::Settings { size: iced::Size { width: 500.0, - height: 150.0, + height: 175.0, }, position: window::Position::Centered, ..Default::default() diff --git a/examples/number_input/Cargo.toml b/examples/number_input/Cargo.toml index 4a99f30f..b54e685e 100644 --- a/examples/number_input/Cargo.toml +++ b/examples/number_input/Cargo.toml @@ -12,6 +12,4 @@ iced_aw = { workspace = true, features = [ "icons", ] } -iced = { workspace = true, features = [ - "wgpu", -] } +iced.workspace=true diff --git a/examples/sliderbar/Cargo.toml b/examples/sliderbar/Cargo.toml index 1d8bd14c..a95e5220 100644 --- a/examples/sliderbar/Cargo.toml +++ b/examples/sliderbar/Cargo.toml @@ -12,6 +12,5 @@ iced_aw = { workspace = true, features = [ "icons", "number_input", ] } -iced = { workspace = true, features = [ - "wgpu", -] } +iced.workspace=true + diff --git a/examples/tab_bar/Cargo.toml b/examples/tab_bar/Cargo.toml index 0bef103b..2180884d 100644 --- a/examples/tab_bar/Cargo.toml +++ b/examples/tab_bar/Cargo.toml @@ -8,6 +8,4 @@ edition = "2021" [dependencies] iced_aw = { workspace = true, features = ["tab_bar", "icons"] } -iced = { workspace = true, features = [ - "wgpu", -] } +iced.workspace = true diff --git a/src/widgets/badge.rs b/src/widgets/badge.rs index 1135763e..dd383ea2 100644 --- a/src/widgets/badge.rs +++ b/src/widgets/badge.rs @@ -233,18 +233,20 @@ where .border_radius .unwrap_or(bounds.height / BORDER_RADIUS_RATIO); - renderer.fill_quad( - renderer::Quad { - bounds, - border: Border { - radius: border_radius.into(), - width: style_sheet.border_width, - color: style_sheet.border_color.unwrap_or(Color::BLACK), + if bounds.intersects(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: border_radius.into(), + width: style_sheet.border_width, + color: style_sheet.border_color.unwrap_or(Color::BLACK), + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - style_sheet.background, - ); + style_sheet.background, + ); + } self.content.as_widget().draw( &tree.children[0], diff --git a/src/widgets/card.rs b/src/widgets/card.rs index 37502f56..fc9f1934 100644 --- a/src/widgets/card.rs +++ b/src/widgets/card.rs @@ -502,34 +502,36 @@ where let mut children = layout.children(); let style_sheet = theme.active(&self.style); - // Background - renderer.fill_quad( - renderer::Quad { - bounds, - border: Border { - radius: style_sheet.border_radius.into(), - width: style_sheet.border_width, - color: style_sheet.border_color, + if bounds.intersects(viewport) { + // Background + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: style_sheet.border_radius.into(), + width: style_sheet.border_width, + color: style_sheet.border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - style_sheet.background, - ); - - // Border - renderer.fill_quad( - // TODO: fill not necessary - renderer::Quad { - bounds, - border: Border { - radius: style_sheet.border_radius.into(), - width: style_sheet.border_width, - color: style_sheet.border_color, + style_sheet.background, + ); + + // Border + renderer.fill_quad( + // TODO: fill not necessary + renderer::Quad { + bounds, + border: Border { + radius: style_sheet.border_radius.into(), + width: style_sheet.border_width, + color: style_sheet.border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - Color::TRANSPARENT, - ); + Color::TRANSPARENT, + ); + } // ----------- Head ---------------------- let head_layout = children @@ -758,37 +760,42 @@ fn draw_head( let border_radius = style_sheet.border_radius; // Head background - renderer.fill_quad( - renderer::Quad { - bounds, - border: Border { - radius: border_radius.into(), - width: 0.0, - color: Color::TRANSPARENT, + if bounds.intersects(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: border_radius.into(), + width: 0.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - style_sheet.head_background, - ); + style_sheet.head_background, + ); + } // cover rounded button of header - renderer.fill_quad( - renderer::Quad { - bounds: Rectangle { - x: bounds.x, - y: bounds.y + bounds.height - border_radius, - width: bounds.width, - height: border_radius, - }, - border: Border { - radius: (0.0).into(), - width: 0.0, - color: Color::TRANSPARENT, + let button_bounds = Rectangle { + x: bounds.x, + y: bounds.y + bounds.height - border_radius, + width: bounds.width, + height: border_radius, + }; + if button_bounds.intersects(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds: button_bounds, + border: Border { + radius: (0.0).into(), + width: 0.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - style_sheet.head_background, - ); + style_sheet.head_background, + ); + } head.as_widget().draw( state, @@ -846,20 +853,23 @@ fn draw_body( { let mut body_children = layout.children(); let style_sheet = theme.active(style); + let bounds = layout.bounds(); // Body background - renderer.fill_quad( - renderer::Quad { - bounds: layout.bounds(), - border: Border { - radius: (0.0).into(), - width: 0.0, - color: Color::TRANSPARENT, + if bounds.intersects(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: (0.0).into(), + width: 0.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - style_sheet.body_background, - ); + style_sheet.body_background, + ); + } body.as_widget().draw( state, @@ -893,20 +903,23 @@ fn draw_foot( { let mut foot_children = layout.children(); let style_sheet = theme.active(style); + let bounds = layout.bounds(); // Foot background - renderer.fill_quad( - renderer::Quad { - bounds: layout.bounds(), - border: Border { - radius: style_sheet.border_radius.into(), - width: 0.0, - color: Color::TRANSPARENT, + if bounds.intersects(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: style_sheet.border_radius.into(), + width: 0.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - style_sheet.foot_background, - ); + style_sheet.foot_background, + ); + } if let Some((foot, state)) = foot.as_ref().zip(state) { foot.as_widget().draw( diff --git a/src/widgets/cupertino/cupertino_button.rs b/src/widgets/cupertino/cupertino_button.rs index 32473bd1..36854f3e 100644 --- a/src/widgets/cupertino/cupertino_button.rs +++ b/src/widgets/cupertino/cupertino_button.rs @@ -149,66 +149,68 @@ where cursor: Cursor, viewport: &Rectangle, ) { - if self.is_filled { - let colour: Color = if self.on_pressed.is_none() { - secondary_system_fill() - } else { - system_blue(1.0) - }; + let bounds: Rectangle = layout.bounds(); + if let Some(clipped_viewport) = layout.bounds().intersection(viewport) { + if self.is_filled { + let colour: Color = if self.on_pressed.is_none() { + secondary_system_fill() + } else { + system_blue(1.0) + }; - let bounds: Rectangle = layout.bounds(); - let center: Point = bounds.center(); + let center: Point = bounds.center(); - let rectangle: Rectangle = Rectangle::new( - Point { - x: bounds.x, - y: center.y - 3.0 * VERTICAL_PADDING, - }, - Size { - width: bounds.width, - height: bounds.height + VERTICAL_PADDING, - }, - ); + let rectangle: Rectangle = Rectangle::new( + Point { + x: bounds.x, + y: center.y - 3.0 * VERTICAL_PADDING, + }, + Size { + width: bounds.width, + height: bounds.height + VERTICAL_PADDING, + }, + ); - renderer.fill_quad( - Quad { - bounds: rectangle, - border: Border { - radius: (16.0).into(), - width: 5.0, - color: Color::TRANSPARENT, + renderer.fill_quad( + Quad { + bounds: rectangle, + border: Border { + radius: (16.0).into(), + width: 5.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - Background::Color(colour), - ); - } + Background::Color(colour), + ); + } - let new_style: &mut renderer::Style = &mut renderer::Style::default(); + let new_style: &mut renderer::Style = &mut renderer::Style::default(); - new_style.clone_from(style); + new_style.clone_from(style); - if self.colour.is_some() { - new_style.text_color = self.colour.expect("Unable to retrieve the text colour"); - } else if self.is_filled && self.on_pressed.is_some() { - new_style.text_color = Color::WHITE; - } else if !self.is_filled && self.on_pressed.is_some() { - new_style.text_color = system_blue(1.0); - } else if self.is_filled && self.on_pressed.is_none() { - new_style.text_color = Color::WHITE; - } else { - new_style.text_color = secondary_system_fill(); - } + if self.colour.is_some() { + new_style.text_color = self.colour.expect("Unable to retrieve the text colour"); + } else if self.is_filled && self.on_pressed.is_some() { + new_style.text_color = Color::WHITE; + } else if !self.is_filled && self.on_pressed.is_some() { + new_style.text_color = system_blue(1.0); + } else if self.is_filled && self.on_pressed.is_none() { + new_style.text_color = Color::WHITE; + } else { + new_style.text_color = secondary_system_fill(); + } - self.body.as_widget().draw( - &state.children[0], - renderer, - theme, - new_style, - layout, - cursor, - viewport, - ); + self.body.as_widget().draw( + &state.children[0], + renderer, + theme, + new_style, + layout, + cursor, + &clipped_viewport, + ); + } } fn on_event( diff --git a/src/widgets/menu/menu_tree.rs b/src/widgets/menu/menu_tree.rs index e1b17bb7..2f650287 100644 --- a/src/widgets/menu/menu_tree.rs +++ b/src/widgets/menu/menu_tree.rs @@ -431,14 +431,17 @@ where // debug_draw(renderer, prescroll, check_bounds, offset_bounds); // draw background - renderer.fill_quad( - renderer::Quad { - bounds: pad_rectangle(prescroll, styling.menu_background_expand), - border: styling.menu_border, - shadow: styling.menu_shadow, - }, - styling.menu_background, - ); + let pad_rectangle = pad_rectangle(prescroll, styling.menu_background_expand); + if pad_rectangle.intersects(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds: pad_rectangle, + border: styling.menu_border, + shadow: styling.menu_shadow, + }, + styling.menu_background, + ); + } // draw path if let Some(active) = menu_state.active { @@ -452,14 +455,16 @@ where match draw_path { DrawPath::Backdrop => { - renderer.fill_quad( - renderer::Quad { - bounds: active_bounds, - border: styling.path_border, - ..Default::default() - }, - styling.path, - ); + if active_bounds.intersects(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds: active_bounds, + border: styling.path_border, + ..Default::default() + }, + styling.path, + ); + } } DrawPath::FakeHovering => { if !cursor.is_over(active_bounds) { @@ -621,17 +626,19 @@ where Color::from([0.0, 0.0, 1.0, 0.3]), ]) .for_each(|(b, c)|{ - renderer.fill_quad( - renderer::Quad{ - bounds: *b, - border: Border{ - radius: 6.0.into(), + if (b.width > 0.) && (b.height > 0.) { + renderer.fill_quad( + renderer::Quad{ + bounds: *b, + border: Border{ + radius: 6.0.into(), + ..Default::default() + }, ..Default::default() }, - ..Default::default() - }, - c - ); + c + ); + } }); } */ diff --git a/src/widgets/number_input.rs b/src/widgets/number_input.rs index 6f40c64d..0b855fae 100644 --- a/src/widgets/number_input.rs +++ b/src/widgets/number_input.rs @@ -692,20 +692,22 @@ where let icon_size = Pixels(txt_size * 2.5 / 4.0); // decrease button section - renderer.fill_quad( - renderer::Quad { - bounds: dec_bounds, - border: Border { - radius: (3.0).into(), - width: 0.0, - color: Color::TRANSPARENT, + if dec_bounds.intersects(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds: dec_bounds, + border: Border { + radius: (3.0).into(), + width: 0.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - decrease_btn_style - .button_background - .unwrap_or(Background::Color(Color::TRANSPARENT)), - ); + decrease_btn_style + .button_background + .unwrap_or(Background::Color(Color::TRANSPARENT)), + ); + } renderer.fill_text( iced::advanced::text::Text { @@ -724,20 +726,22 @@ where ); // increase button section - renderer.fill_quad( - renderer::Quad { - bounds: inc_bounds, - border: Border { - radius: (3.0).into(), - width: 0.0, - color: Color::TRANSPARENT, + if inc_bounds.intersects(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds: inc_bounds, + border: Border { + radius: (3.0).into(), + width: 0.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - increase_btn_style - .button_background - .unwrap_or(Background::Color(Color::TRANSPARENT)), - ); + increase_btn_style + .button_background + .unwrap_or(Background::Color(Color::TRANSPARENT)), + ); + } renderer.fill_text( iced::advanced::text::Text { diff --git a/src/widgets/overlay/color_picker.rs b/src/widgets/overlay/color_picker.rs index 033a22cb..7d68476c 100644 --- a/src/widgets/overlay/color_picker.rs +++ b/src/widgets/overlay/color_picker.rs @@ -867,18 +867,20 @@ where style_state = style_state.max(StyleState::Hovered); } - renderer.fill_quad( - renderer::Quad { - bounds, - border: Border { - radius: style_sheet[&style_state].border_radius.into(), - width: style_sheet[&style_state].border_width, - color: style_sheet[&style_state].border_color, + if (bounds.width > 0.) && (bounds.height > 0.) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: style_sheet[&style_state].border_radius.into(), + width: style_sheet[&style_state].border_width, + color: style_sheet[&style_state].border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - style_sheet[&style_state].background, - ); + style_sheet[&style_state].background, + ); + } // ----------- Block 1 ---------------------- let block1_layout = children @@ -1174,33 +1176,39 @@ fn block2( // Buttons are not focusable right now... if color_picker.state.focus == Focus::Cancel { - renderer.fill_quad( - renderer::Quad { - bounds: cancel_button_layout.bounds(), - border: Border { - radius: style_sheet[&StyleState::Focused].border_radius.into(), - width: style_sheet[&StyleState::Focused].border_width, - color: style_sheet[&StyleState::Focused].border_color, + let bounds = cancel_button_layout.bounds(); + if (bounds.width > 0.) && (bounds.height > 0.) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: style_sheet[&StyleState::Focused].border_radius.into(), + width: style_sheet[&StyleState::Focused].border_width, + color: style_sheet[&StyleState::Focused].border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - Color::TRANSPARENT, - ); + Color::TRANSPARENT, + ); + } } if color_picker.state.focus == Focus::Submit { - renderer.fill_quad( - renderer::Quad { - bounds: submit_button_layout.bounds(), - border: Border { - radius: style_sheet[&StyleState::Focused].border_radius.into(), - width: style_sheet[&StyleState::Focused].border_width, - color: style_sheet[&StyleState::Focused].border_color, + let bounds = submit_button_layout.bounds(); + if (bounds.width > 0.) && (bounds.height > 0.) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: style_sheet[&StyleState::Focused].border_radius.into(), + width: style_sheet[&StyleState::Focused].border_width, + color: style_sheet[&StyleState::Focused].border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - Color::TRANSPARENT, - ); + Color::TRANSPARENT, + ); + } } // ----------- Block 2 end ------------------ } @@ -1439,63 +1447,68 @@ fn rgba_color( label_layout.bounds(), ); - let bounds = bar_layout.bounds(); + let bar_bounds = bar_layout.bounds(); - let bar_style_state = if cursor.is_over(bar_layout.bounds()) { + let bar_style_state = if cursor.is_over(bar_bounds) { StyleState::Hovered } else { StyleState::Active }; // Bar background - renderer.fill_quad( - renderer::Quad { - bounds: Rectangle { - x: bounds.x, - y: bounds.y, - width: bounds.width * value, - height: bounds.height, - }, - border: Border { - radius: style_sheet - .get(&bar_style_state) - .expect("Style Sheet not found.") - .bar_border_radius - .into(), - width: style_sheet - .get(&bar_style_state) - .expect("Style Sheet not found.") - .bar_border_width, - color: Color::TRANSPARENT, + let background_bounds = Rectangle { + x: bar_bounds.x, + y: bar_bounds.y, + width: bar_bounds.width * value, + height: bar_bounds.height, + }; + if (background_bounds.width > 0.) && (background_bounds.height > 0.) { + renderer.fill_quad( + renderer::Quad { + bounds: background_bounds, + border: Border { + radius: style_sheet + .get(&bar_style_state) + .expect("Style Sheet not found.") + .bar_border_radius + .into(), + width: style_sheet + .get(&bar_style_state) + .expect("Style Sheet not found.") + .bar_border_width, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - color, - ); + color, + ); + } // Bar - renderer.fill_quad( - renderer::Quad { - bounds, - border: Border { - radius: style_sheet - .get(&bar_style_state) - .expect("Style Sheet not found.") - .bar_border_radius - .into(), - width: style_sheet - .get(&bar_style_state) - .expect("Style Sheet not found.") - .bar_border_width, - color: style_sheet - .get(&bar_style_state) - .expect("Style Sheet not found.") - .bar_border_color, + if (bar_bounds.width > 0.) && (bar_bounds.height > 0.) { + renderer.fill_quad( + renderer::Quad { + bounds: bar_bounds, + border: Border { + radius: style_sheet + .get(&bar_style_state) + .expect("Style Sheet not found.") + .bar_border_radius + .into(), + width: style_sheet + .get(&bar_style_state) + .expect("Style Sheet not found.") + .bar_border_width, + color: style_sheet + .get(&bar_style_state) + .expect("Style Sheet not found.") + .bar_border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - Color::TRANSPARENT, - ); + Color::TRANSPARENT, + ); + } // Value renderer.fill_text( @@ -1517,10 +1530,11 @@ fn rgba_color( value_layout.bounds(), ); - if focus == target { + let bounds = layout.bounds(); + if (focus == target) && (bounds.width > 0.) && (bounds.height > 0.) { renderer.fill_quad( renderer::Quad { - bounds: layout.bounds(), + bounds, border: Border { radius: style_sheet .get(&StyleState::Focused) @@ -1622,23 +1636,26 @@ fn hex_text( StyleState::Active }; - renderer.fill_quad( - renderer::Quad { - bounds: layout.bounds(), - border: Border { - radius: style_sheet[&hex_text_style_state].bar_border_radius.into(), - width: style_sheet[&hex_text_style_state].bar_border_width, - color: style_sheet[&hex_text_style_state].bar_border_color, + let bounds = layout.bounds(); + if (bounds.width > 0.) && (bounds.height > 0.) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: style_sheet[&hex_text_style_state].bar_border_radius.into(), + width: style_sheet[&hex_text_style_state].bar_border_width, + color: style_sheet[&hex_text_style_state].bar_border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - *color, - ); + *color, + ); + } renderer.fill_text( Text { content: &color.as_hex_string(), - bounds: Size::new(layout.bounds().width, layout.bounds().height), + bounds: Size::new(bounds.width, bounds.height), size: renderer.default_size(), font: renderer.default_font(), horizontal_alignment: Horizontal::Center, @@ -1646,7 +1663,7 @@ fn hex_text( line_height: text::LineHeight::Relative(1.3), shaping: text::Shaping::Basic, }, - Point::new(layout.bounds().center_x(), layout.bounds().center_y()), + Point::new(bounds.center_x(), bounds.center_y()), Color { a: 1.0, ..Hsv { @@ -1656,7 +1673,7 @@ fn hex_text( } .into() }, - layout.bounds(), + bounds, ); } diff --git a/src/widgets/overlay/context_menu.rs b/src/widgets/overlay/context_menu.rs index 9415a278..2a0dd3cf 100644 --- a/src/widgets/overlay/context_menu.rs +++ b/src/widgets/overlay/context_menu.rs @@ -112,18 +112,20 @@ where let style_sheet = theme.active(&self.style); // Background - renderer.fill_quad( - renderer::Quad { - bounds, - border: Border { - radius: (0.0).into(), - width: 0.0, - color: Color::TRANSPARENT, + if (bounds.width > 0.) && (bounds.height > 0.) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: (0.0).into(), + width: 0.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - style_sheet.background, - ); + style_sheet.background, + ); + } let content_layout = layout .children() diff --git a/src/widgets/overlay/date_picker.rs b/src/widgets/overlay/date_picker.rs index ca701411..1eaecd6c 100644 --- a/src/widgets/overlay/date_picker.rs +++ b/src/widgets/overlay/date_picker.rs @@ -777,18 +777,20 @@ where } // Background - renderer.fill_quad( - renderer::Quad { - bounds, - border: Border { - radius: style_sheet[&style_state].border_radius.into(), - width: style_sheet[&style_state].border_width, - color: style_sheet[&style_state].border_color, + if (bounds.width > 0.) && (bounds.height > 0.) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: style_sheet[&style_state].border_radius.into(), + width: style_sheet[&style_state].border_width, + color: style_sheet[&style_state].border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - style_sheet[&style_state].background, - ); + style_sheet[&style_state].background, + ); + } // ----------- Year/Month---------------------- let month_year_layout = date_children @@ -853,10 +855,14 @@ where ); // Buttons are not focusable right now... - if self.state.focus == Focus::Cancel { + let cancel_button_bounds = cancel_button_layout.bounds(); + if (self.state.focus == Focus::Cancel) + && (cancel_button_bounds.width > 0.) + && (cancel_button_bounds.height > 0.) + { renderer.fill_quad( renderer::Quad { - bounds: cancel_button_layout.bounds(), + bounds: cancel_button_bounds, border: Border { radius: style_sheet[&StyleState::Focused].border_radius.into(), width: style_sheet[&StyleState::Focused].border_width, @@ -868,10 +874,14 @@ where ); } - if self.state.focus == Focus::Submit { + let submit_button_bounds = submit_button_layout.bounds(); + if (self.state.focus == Focus::Submit) + && (submit_button_bounds.width > 0.) + && (submit_button_bounds.height > 0.) + { renderer.fill_quad( renderer::Quad { - bounds: submit_button_layout.bounds(), + bounds: submit_button_bounds, border: Border { radius: style_sheet[&StyleState::Focused].border_radius.into(), width: style_sheet[&StyleState::Focused].border_width, @@ -1111,10 +1121,11 @@ fn month_year( let left_arrow_hovered = left_bounds.contains(cursor); let right_arrow_hovered = right_bounds.contains(cursor); - if style_state == StyleState::Focused { + let bounds = layout.bounds(); + if (style_state == StyleState::Focused) && (bounds.width > 0.) && (bounds.height > 0.) { renderer.fill_quad( renderer::Quad { - bounds: layout.bounds(), + bounds, border: Border { radius: style .get(&style_state) @@ -1298,45 +1309,47 @@ fn day_table( style_state = style_state.max(StyleState::Hovered); } - renderer.fill_quad( - renderer::Quad { - bounds, - border: Border { - radius: (bounds.height / 2.0).into(), - width: 0.0, - color: Color::TRANSPARENT, - }, - shadow: Shadow::default(), - }, - style - .get(&style_state) - .expect("Style Sheet not found.") - .day_background, - ); - - if focus == Focus::Day && selected { + if (bounds.width > 0.) && (bounds.height > 0.) { renderer.fill_quad( renderer::Quad { bounds, border: Border { - radius: style - .get(&StyleState::Focused) - .expect("Style Sheet not found.") - .border_radius - .into(), - width: style - .get(&StyleState::Focused) - .expect("Style Sheet not found.") - .border_width, - color: style - .get(&StyleState::Focused) - .expect("Style Sheet not found.") - .border_color, + radius: (bounds.height / 2.0).into(), + width: 0.0, + color: Color::TRANSPARENT, }, shadow: Shadow::default(), }, - Color::TRANSPARENT, + style + .get(&style_state) + .expect("Style Sheet not found.") + .day_background, ); + + if focus == Focus::Day && selected { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: style + .get(&StyleState::Focused) + .expect("Style Sheet not found.") + .border_radius + .into(), + width: style + .get(&StyleState::Focused) + .expect("Style Sheet not found.") + .border_width, + color: style + .get(&StyleState::Focused) + .expect("Style Sheet not found.") + .border_color, + }, + shadow: Shadow::default(), + }, + Color::TRANSPARENT, + ); + } } renderer.fill_text( diff --git a/src/widgets/overlay/modal.rs b/src/widgets/overlay/modal.rs index c239724b..10770663 100644 --- a/src/widgets/overlay/modal.rs +++ b/src/widgets/overlay/modal.rs @@ -183,18 +183,20 @@ where let style_sheet = theme.active(&self.style); // Background - renderer.fill_quad( - renderer::Quad { - bounds, - border: Border { - radius: (0.0).into(), - width: 0.0, - color: Color::TRANSPARENT, + if (bounds.width > 0.) && (bounds.height > 0.) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: (0.0).into(), + width: 0.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - style_sheet.background, - ); + style_sheet.background, + ); + } let content_layout = layout .children() diff --git a/src/widgets/overlay/time_picker.rs b/src/widgets/overlay/time_picker.rs index a34c4e59..287c8984 100644 --- a/src/widgets/overlay/time_picker.rs +++ b/src/widgets/overlay/time_picker.rs @@ -866,18 +866,20 @@ where } // Background - renderer.fill_quad( - renderer::Quad { - bounds, - border: Border { - radius: style_sheet[&style_state].border_radius.into(), - width: style_sheet[&style_state].border_width, - color: style_sheet[&style_state].border_color, + if (bounds.width > 0.) && (bounds.height > 0.) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: style_sheet[&style_state].border_radius.into(), + width: style_sheet[&style_state].border_width, + color: style_sheet[&style_state].border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - style_sheet[&style_state].background, - ); + style_sheet[&style_state].background, + ); + } // ----------- Clock canvas -------------------- let clock_layout = children @@ -921,10 +923,14 @@ where ); // Buttons are not focusable right now... - if self.state.focus == Focus::Cancel { + let cancel_button_bounds = cancel_button_layout.bounds(); + if (self.state.focus == Focus::Cancel) + && (cancel_button_bounds.width > 0.) + && (cancel_button_bounds.height > 0.) + { renderer.fill_quad( renderer::Quad { - bounds: cancel_button_layout.bounds(), + bounds: cancel_button_bounds, border: Border { radius: style_sheet[&StyleState::Focused].border_radius.into(), width: style_sheet[&StyleState::Focused].border_width, @@ -936,10 +942,14 @@ where ); } - if self.state.focus == Focus::Submit { + let submit_button_bounds = submit_button_layout.bounds(); + if (self.state.focus == Focus::Submit) + && (submit_button_bounds.width > 0.) + && (submit_button_bounds.height > 0.) + { renderer.fill_quad( renderer::Quad { - bounds: submit_button_layout.bounds(), + bounds: submit_button_bounds, border: Border { radius: style_sheet[&StyleState::Focused].border_radius.into(), width: style_sheet[&StyleState::Focused].border_width, diff --git a/src/widgets/quad.rs b/src/widgets/quad.rs index dabdb904..26f93d4b 100644 --- a/src/widgets/quad.rs +++ b/src/widgets/quad.rs @@ -86,26 +86,29 @@ where _style: &renderer::Style, layout: Layout<'_>, _cursor: Cursor, - _viewport: &Rectangle, + viewport: &Rectangle, ) { - if let Some(b) = self.bg_color { + let bounds = layout.bounds(); + if bounds.intersects(viewport) { + if let Some(b) = self.bg_color { + renderer.fill_quad( + renderer::Quad { + bounds, + border: self.bg_border, + shadow: self.bg_shadow, + }, + b, + ); + } renderer.fill_quad( renderer::Quad { - bounds: layout.bounds(), - border: self.bg_border, - shadow: self.bg_shadow, + bounds: self.inner_bounds.get_bounds(bounds), + border: self.quad_border, + shadow: self.quad_shadow, }, - b, + self.quad_color, ); } - renderer.fill_quad( - renderer::Quad { - bounds: self.inner_bounds.get_bounds(layout.bounds()), - border: self.quad_border, - shadow: self.quad_shadow, - }, - self.quad_color, - ); } } diff --git a/src/widgets/segmented_button.rs b/src/widgets/segmented_button.rs index 145fc3a8..9e5a30a0 100644 --- a/src/widgets/segmented_button.rs +++ b/src/widgets/segmented_button.rs @@ -221,71 +221,63 @@ where theme.active(&self.style) }; - renderer.fill_quad( - renderer::Quad { - bounds, - border: Border { - radius: 2.0.into(), - width: style_sheet.border_width, - color: style_sheet.border_color.unwrap_or(Color::BLACK), - }, - shadow: Shadow::default(), - }, - style_sheet.background, - ); - if self.is_selected { + if let Some(clipped_viewport) = bounds.intersection(viewport) { renderer.fill_quad( renderer::Quad { - bounds: Rectangle { - x: bounds.x, - y: bounds.y, - width: bounds.width, - height: bounds.height, - }, + bounds, border: Border { radius: 2.0.into(), - width: 0.0, - color: Color::TRANSPARENT, + width: style_sheet.border_width, + color: style_sheet.border_color.unwrap_or(Color::BLACK), }, shadow: Shadow::default(), }, - style_sheet.selected_color, + style_sheet.background, ); - } - //just for the testing as of now needs to clearup and make styling based of basecolor - if is_mouse_over && !self.is_selected { - renderer.fill_quad( - renderer::Quad { - bounds: Rectangle { - x: bounds.x, - y: bounds.y, - width: bounds.width, - height: bounds.height, + if self.is_selected { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: 2.0.into(), + width: 0.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - border: Border { - radius: 2.0.into(), - width: 0.0, - color: Color::TRANSPARENT, + style_sheet.selected_color, + ); + } + //just for the testing as of now needs to clearup and make styling based of basecolor + if is_mouse_over && !self.is_selected { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: 2.0.into(), + width: 0.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), + Background::Color([0.0, 0.0, 0.0, 0.5].into()), + ); + } + + self.content.as_widget().draw( + &tree.children[0], + renderer, + theme, + &renderer::Style { + text_color: style_sheet.text_color, }, - Background::Color([0.0, 0.0, 0.0, 0.5].into()), + children + .next() + .expect("Graphics: Layout should have a children layout for SegmentedButton"), + cursor, + &clipped_viewport, ); } - - self.content.as_widget().draw( - &tree.children[0], - renderer, - theme, - &renderer::Style { - text_color: style_sheet.text_color, - }, - children - .next() - .expect("Graphics: Layout should have a children layout for SegmentedButton"), - cursor, - viewport, - ); } } diff --git a/src/widgets/selection_list.rs b/src/widgets/selection_list.rs index 05067706..6bc143bd 100644 --- a/src/widgets/selection_list.rs +++ b/src/widgets/selection_list.rs @@ -267,33 +267,36 @@ where style: &renderer::Style, layout: Layout<'_>, cursor: Cursor, - _viewport: &Rectangle, + viewport: &Rectangle, ) { - renderer.fill_quad( - renderer::Quad { - bounds: layout.bounds(), - border: Border { - radius: (0.0).into(), - width: theme.style(&self.style).border_width, - color: theme.style(&self.style).border_color, + let bounds = layout.bounds(); + if let Some(clipped_viewport) = bounds.intersection(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: (0.0).into(), + width: theme.style(&self.style).border_width, + color: theme.style(&self.style).border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - theme.style(&self.style).background, - ); + theme.style(&self.style).background, + ); - self.container.draw( - &state.children[0], - renderer, - theme, - style, - layout - .children() - .next() - .expect("Scrollable Child Missing in Selection List"), - cursor, - &layout.bounds(), - ); + self.container.draw( + &state.children[0], + renderer, + theme, + style, + layout + .children() + .next() + .expect("Scrollable Child Missing in Selection List"), + cursor, + &clipped_viewport, + ); + } } } diff --git a/src/widgets/selection_list/list.rs b/src/widgets/selection_list/list.rs index 5a6ecdd9..d1703b49 100644 --- a/src/widgets/selection_list/list.rs +++ b/src/widgets/selection_list/list.rs @@ -231,7 +231,7 @@ where height: self.text_size + (self.padding * 2.0), }; - if is_selected || is_hovered { + if (is_selected || is_hovered) && (bounds.width > 0.) && (bounds.height > 0.) { renderer.fill_quad( renderer::Quad { bounds, diff --git a/src/widgets/slide_bar.rs b/src/widgets/slide_bar.rs index 8f1bc613..c53a47e3 100644 --- a/src/widgets/slide_bar.rs +++ b/src/widgets/slide_bar.rs @@ -198,9 +198,9 @@ where _style: &renderer::Style, layout: Layout<'_>, _cursor: Cursor, - _viewport: &Rectangle, + viewport: &Rectangle, ) { - draw(renderer, layout, self); + draw(renderer, layout, viewport, self); } } @@ -291,8 +291,12 @@ where } /// Draws a [`SliderBar`]. -pub fn draw(renderer: &mut R, layout: Layout<'_>, slider: &SlideBar) -where +pub fn draw( + renderer: &mut R, + layout: Layout<'_>, + viewport: &Rectangle, + slider: &SlideBar, +) where T: Into + Copy, Message: Clone, R: renderer::Renderer, @@ -319,20 +323,22 @@ where let background = slider.background.unwrap_or_else(|| Color::from([1.0; 3])); - renderer.fill_quad( - renderer::Quad { - bounds: layout.bounds(), - border: Border { - radius: slider.border_radius.into(), - width: slider.border_width, - color: slider.border_color, + if bounds.intersects(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: slider.border_radius.into(), + width: slider.border_width, + color: slider.border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - background, - ); + background, + ); + } - if active_progress_bounds.width > 0.0 { + if active_progress_bounds.intersects(viewport) { renderer.fill_quad( renderer::Quad { bounds: active_progress_bounds, diff --git a/src/widgets/spinner.rs b/src/widgets/spinner.rs index 7b4ab74b..4d8e4e58 100644 --- a/src/widgets/spinner.rs +++ b/src/widgets/spinner.rs @@ -86,23 +86,25 @@ fn fill_circle( radius: f32, color: Color, ) { - renderer.fill_quad( - renderer::Quad { - bounds: Rectangle { - x: position.x, - y: position.y, - width: radius * 2.0, - height: radius * 2.0, + if radius > 0. { + renderer.fill_quad( + renderer::Quad { + bounds: Rectangle { + x: position.x, + y: position.y, + width: radius * 2.0, + height: radius * 2.0, + }, + border: Border { + radius: radius.into(), + width: 0.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - border: Border { - radius: radius.into(), - width: 0.0, - color: Color::TRANSPARENT, - }, - shadow: Shadow::default(), - }, - color, - ); + color, + ); + } } impl Widget for Spinner diff --git a/src/widgets/split.rs b/src/widgets/split.rs index c3e90b46..127bc38a 100644 --- a/src/widgets/split.rs +++ b/src/widgets/split.rs @@ -353,57 +353,63 @@ where let mut children = layout.children(); // Background - renderer.fill_quad( - renderer::Quad { - bounds: layout.bounds(), - border: Border { - radius: (0.0).into(), - width: theme.active(&self.style).border_width, - color: theme.active(&self.style).border_color, + let bounds = layout.bounds(); + if bounds.intersects(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: (0.0).into(), + width: theme.active(&self.style).border_width, + color: theme.active(&self.style).border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - theme - .active(&self.style) - .background - .unwrap_or_else(|| Color::TRANSPARENT.into()), - ); + theme + .active(&self.style) + .background + .unwrap_or_else(|| Color::TRANSPARENT.into()), + ); + } let first_layout = children .next() .expect("Graphics: Layout should have a first layout"); // First - renderer.fill_quad( - renderer::Quad { - bounds: first_layout.bounds(), - border: Border { - radius: (0.0).into(), - width: 0.0, - color: Color::TRANSPARENT, + let first_layout_bounds = first_layout.bounds(); + if let Some(clipped_viewport) = first_layout_bounds.intersection(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds: first_layout_bounds, + border: Border { + radius: (0.0).into(), + width: 0.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - if first_layout - .bounds() - .contains(cursor.position().unwrap_or_default()) - { - theme.hovered(&self.style).first_background - } else { - theme.active(&self.style).first_background - } - .unwrap_or_else(|| Color::TRANSPARENT.into()), - ); - - self.first.as_widget().draw( - &state.children[0], - renderer, - theme, - style, - first_layout, - cursor, - viewport, - ); + if first_layout + .bounds() + .contains(cursor.position().unwrap_or_default()) + { + theme.hovered(&self.style).first_background + } else { + theme.active(&self.style).first_background + } + .unwrap_or_else(|| Color::TRANSPARENT.into()), + ); + + self.first.as_widget().draw( + &state.children[0], + renderer, + theme, + style, + first_layout, + cursor, + &clipped_viewport, + ); + } let divider_layout = children .next() @@ -414,61 +420,67 @@ where .next() .expect("Graphics: Layout should have a second layout"); - renderer.fill_quad( - renderer::Quad { - bounds: second_layout.bounds(), - border: Border { - radius: (0.0).into(), - width: 0.0, - color: Color::TRANSPARENT, + let second_layout_bounds = second_layout.bounds(); + if let Some(clipped_viewport) = second_layout_bounds.intersection(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds: second_layout_bounds, + border: Border { + radius: (0.0).into(), + width: 0.0, + color: Color::TRANSPARENT, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - if second_layout + if second_layout + .bounds() + .contains(cursor.position().unwrap_or_default()) + { + theme.hovered(&self.style).second_background + } else { + theme.active(&self.style).second_background + } + .unwrap_or_else(|| Color::TRANSPARENT.into()), + ); + + self.second.as_widget().draw( + &state.children[1], + renderer, + theme, + style, + second_layout, + cursor, + &clipped_viewport, + ); + } + + // Divider + let divider_layout_bounds = divider_layout.bounds(); + if divider_layout_bounds.intersects(viewport) { + let divider_style = if split_state.dragging { + theme.dragged(&self.style) + } else if divider_layout .bounds() .contains(cursor.position().unwrap_or_default()) { - theme.hovered(&self.style).second_background + theme.hovered(&self.style) } else { - theme.active(&self.style).second_background - } - .unwrap_or_else(|| Color::TRANSPARENT.into()), - ); - - self.second.as_widget().draw( - &state.children[1], - renderer, - theme, - style, - second_layout, - cursor, - viewport, - ); - - // Divider - let divider_style = if split_state.dragging { - theme.dragged(&self.style) - } else if divider_layout - .bounds() - .contains(cursor.position().unwrap_or_default()) - { - theme.hovered(&self.style) - } else { - theme.active(&self.style) - }; - - renderer.fill_quad( - renderer::Quad { - bounds: divider_layout.bounds(), - border: Border { - radius: (0.0).into(), - width: divider_style.divider_border_width, - color: divider_style.divider_border_color, + theme.active(&self.style) + }; + + renderer.fill_quad( + renderer::Quad { + bounds: divider_layout_bounds, + border: Border { + radius: (0.0).into(), + width: divider_style.divider_border_width, + color: divider_style.divider_border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - divider_style.divider_background, - ); + divider_style.divider_background, + ); + } } fn operate<'b>( diff --git a/src/widgets/tab_bar.rs b/src/widgets/tab_bar.rs index 00013e06..1bac4111 100644 --- a/src/widgets/tab_bar.rs +++ b/src/widgets/tab_bar.rs @@ -597,7 +597,7 @@ where _style: &renderer::Style, layout: Layout<'_>, cursor: Cursor, - _viewport: &Rectangle, + viewport: &Rectangle, ) { let bounds = layout.bounds(); let children = layout.children(); @@ -608,20 +608,22 @@ where theme.active(&self.style, false) }; - renderer.fill_quad( - renderer::Quad { - bounds, - border: Border { - radius: (0.0).into(), - width: style_sheet.border_width, - color: style_sheet.border_color.unwrap_or(Color::TRANSPARENT), + if bounds.intersects(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: (0.0).into(), + width: style_sheet.border_width, + color: style_sheet.border_color.unwrap_or(Color::TRANSPARENT), + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - style_sheet - .background - .unwrap_or_else(|| Color::TRANSPARENT.into()), - ); + style_sheet + .background + .unwrap_or_else(|| Color::TRANSPARENT.into()), + ); + } for ((i, tab), layout) in self.tab_labels.iter().enumerate().zip(children) { draw_tab( @@ -636,6 +638,7 @@ where (self.font.unwrap_or(BOOTSTRAP_FONT), self.icon_size), (self.text_font.unwrap_or_default(), self.text_size), self.close_size, + viewport, ); } } @@ -659,6 +662,7 @@ fn draw_tab( icon_data: (Font, f32), text_data: (Font, f32), close_size: f32, + viewport: &Rectangle, ) where Renderer: renderer::Renderer + iced::advanced::text::Renderer, Theme: StyleSheet + text::StyleSheet, @@ -687,18 +691,20 @@ fn draw_tab( .expect("Graphics: Layout should have a label layout"); let mut label_layout_children = label_layout.children(); - renderer.fill_quad( - renderer::Quad { - bounds, - border: Border { - radius: (0.0).into(), - width: style.tab_label_border_width, - color: style.tab_label_border_color, + if bounds.intersects(viewport) { + renderer.fill_quad( + renderer::Quad { + bounds, + border: Border { + radius: (0.0).into(), + width: style.tab_label_border_width, + color: style.tab_label_border_color, + }, + shadow: Shadow::default(), }, - shadow: Shadow::default(), - }, - style.tab_label_background, - ); + style.tab_label_background, + ); + } match tab { TabLabel::Icon(icon) => { @@ -825,7 +831,7 @@ fn draw_tab( cross_bounds, ); - if is_mouse_over_cross { + if is_mouse_over_cross && cross_bounds.intersects(viewport) { renderer.fill_quad( renderer::Quad { bounds: cross_bounds,