From f790e248e46230365910b2bacf00f55300a7535c Mon Sep 17 00:00:00 2001
From: ItsEthra <107059409+ItsEthra@users.noreply.github.com>
Date: Fri, 11 Nov 2022 16:09:54 +0300
Subject: [PATCH] Fixed color edit popup going outside the screen (#2270)

* Fixed color edit popup going outside the screen

* Added option to constrain areas

* Constrain color picker area

* Constrain popups

* Updated changelog
---
 CHANGELOG.md                            |  2 ++
 crates/egui/src/containers/area.rs      | 15 +++++++++++++++
 crates/egui/src/containers/popup.rs     |  1 +
 crates/egui/src/widgets/color_picker.rs |  6 +++++-
 4 files changed, 23 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 57a3bef2..c530657d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -18,6 +18,7 @@ NOTE: [`epaint`](crates/epaint/CHANGELOG.md), [`eframe`](crates/eframe/CHANGELOG
 * Added `egui::gui_zoom` module with helpers for scaling the whole GUI of an app ([#2239](https://github.com/emilk/egui/pull/2239)).
 * You can now put one interactive widget on top of another, and only one will get interaction at a time ([#2244](https://github.com/emilk/egui/pull/2244)).
 * Add `ui.centered`.
+* Added `Area::constrain` which constrains area to the screen bounds. ([#2270](https://github.com/emilk/egui/pull/2270)).
 
 ### Changed 🔧
 * Panels always have a separator line, but no stroke on other sides. Their spacing has also changed slightly ([#2261](https://github.com/emilk/egui/pull/2261)).
@@ -27,6 +28,7 @@ NOTE: [`epaint`](crates/epaint/CHANGELOG.md), [`eframe`](crates/eframe/CHANGELOG
 * ⚠️ BREAKING: Fix text being too small ([#2069](https://github.com/emilk/egui/pull/2069)).
 * Improved text rendering ([#2071](https://github.com/emilk/egui/pull/2071)).
 * Less jitter when calling `Context::set_pixels_per_point` ([#2239](https://github.com/emilk/egui/pull/2239)).
+* Fixed popups and color edit going outside the screen.
 
 
 ## 0.19.0 - 2022-08-20
diff --git a/crates/egui/src/containers/area.rs b/crates/egui/src/containers/area.rs
index befa0a7f..7ce2bab5 100644
--- a/crates/egui/src/containers/area.rs
+++ b/crates/egui/src/containers/area.rs
@@ -46,6 +46,7 @@ pub struct Area {
     movable: bool,
     interactable: bool,
     enabled: bool,
+    constrain: bool,
     order: Order,
     default_pos: Option<Pos2>,
     anchor: Option<(Align2, Vec2)>,
@@ -59,6 +60,7 @@ impl Area {
             id: id.into(),
             movable: true,
             interactable: true,
+            constrain: false,
             enabled: true,
             order: Order::Middle,
             default_pos: None,
@@ -120,6 +122,12 @@ impl Area {
         self
     }
 
+    /// Constrains this area to the screen bounds.
+    pub fn constrain(mut self, constrain: bool) -> Self {
+        self.constrain = constrain;
+        self
+    }
+
     /// Positions the window and prevents it from being moved
     pub fn fixed_pos(mut self, fixed_pos: impl Into<Pos2>) -> Self {
         self.new_pos = Some(fixed_pos.into());
@@ -202,6 +210,7 @@ impl Area {
             new_pos,
             anchor,
             drag_bounds,
+            constrain,
         } = self;
 
         let layer_id = LayerId::new(order, id);
@@ -274,6 +283,12 @@ impl Area {
 
         state.pos = ctx.round_pos_to_pixels(state.pos);
 
+        if constrain {
+            state.pos = ctx
+                .constrain_window_rect_to_area(state.rect(), drag_bounds)
+                .min;
+        }
+
         Prepared {
             layer_id,
             state,
diff --git a/crates/egui/src/containers/popup.rs b/crates/egui/src/containers/popup.rs
index 51381de6..992b6cf9 100644
--- a/crates/egui/src/containers/popup.rs
+++ b/crates/egui/src/containers/popup.rs
@@ -325,6 +325,7 @@ pub fn popup_below_widget<R>(
     if ui.memory().is_popup_open(popup_id) {
         let inner = Area::new(popup_id)
             .order(Order::Foreground)
+            .constrain(true)
             .fixed_pos(widget_response.rect.left_bottom())
             .show(ui.ctx(), |ui| {
                 // Note: we use a separate clip-rect for this area, so the popup can be outside the parent.
diff --git a/crates/egui/src/widgets/color_picker.rs b/crates/egui/src/widgets/color_picker.rs
index 36231efe..a9935f4d 100644
--- a/crates/egui/src/widgets/color_picker.rs
+++ b/crates/egui/src/widgets/color_picker.rs
@@ -350,13 +350,17 @@ pub fn color_edit_button_hsva(ui: &mut Ui, hsva: &mut Hsva, alpha: Alpha) -> Res
     if button_response.clicked() {
         ui.memory().toggle_popup(popup_id);
     }
+
+    const COLOR_SLIDER_WIDTH: f32 = 210.0;
+
     // TODO(emilk): make it easier to show a temporary popup that closes when you click outside it
     if ui.memory().is_popup_open(popup_id) {
         let area_response = Area::new(popup_id)
             .order(Order::Foreground)
             .fixed_pos(button_response.rect.max)
+            .constrain(true)
             .show(ui.ctx(), |ui| {
-                ui.spacing_mut().slider_width = 210.0;
+                ui.spacing_mut().slider_width = COLOR_SLIDER_WIDTH;
                 Frame::popup(ui.style()).show(ui, |ui| {
                     if color_picker_hsva_2d(ui, hsva, alpha) {
                         button_response.mark_changed();