Add Modal and Memory::set_modal_layer

Cargo.lock

@@ -2239,7 +2239,7 @@ checksum = "e2db585e1d738fc771bf08a151420d3ed193d9d895a36df7f6f8a9456b911ddc"
 [[package]]
 name = "kittest"
 version = "0.1.0"
-source = "git+https://github.com/rerun-io/kittest?branch=main#63c5b7d58178900e523428ca5edecbba007a2702"
+source = "git+https://github.com/rerun-io/kittest?branch=main#06e01f17fed36a997e1541f37b2d47e3771d7533"
 dependencies = [
  "accesskit",
  "accesskit_consumer",
@@ -2274,7 +2274,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "4979f22fdb869068da03c9f7528f8297c6fd2606bc3a4affe42e6a823fdb8da4"
 dependencies = [
  "cfg-if",
- "windows-targets 0.52.6",
+ "windows-targets 0.48.5",
 ]
 
 [[package]]

crates/egui/src/containers/mod.rs

@@ -6,6 +6,7 @@ pub(crate) mod area;
 pub mod collapsing_header;
 mod combo_box;
 pub mod frame;
+pub mod modal;
 pub mod panel;
 pub mod popup;
 pub(crate) mod resize;
@@ -18,6 +19,7 @@ pub use {
     collapsing_header::{CollapsingHeader, CollapsingResponse},
     combo_box::*,
     frame::Frame,
+    modal::{Modal, ModalResponse},
     panel::{CentralPanel, SidePanel, TopBottomPanel},
     popup::*,
     resize::Resize,

crates/egui/src/containers/modal.rs

@@ -0,0 +1,160 @@
+use crate::{
+    Area, Color32, Context, Frame, Id, InnerResponse, Order, Response, Sense, Ui, UiBuilder,
+};
+use emath::{Align2, Vec2};
+
+/// A modal dialog.
+/// Similar to a [`crate::Window`] but centered and with a backdrop that
+/// blocks input to the rest of the UI.
+///
+/// You can show multiple modals on top of each other. The topmost modal will always be
+/// the most recently shown one.
+pub struct Modal {
+    pub area: Area,
+    pub backdrop_color: Color32,
+    pub frame: Option<Frame>,
+}
+
+impl Modal {
+    /// Create a new Modal. The id is passed to the area.
+    pub fn new(id: Id) -> Self {
+        Self {
+            area: Self::default_area(id),
+            backdrop_color: Color32::from_black_alpha(100),
+            frame: None,
+        }
+    }
+
+    /// Returns an area customized for a modal.
+    /// Makes these changes to the default area:
+    /// - sense: hover
+    /// - anchor: center
+    /// - order: foreground
+    pub fn default_area(id: Id) -> Area {
+        Area::new(id)
+            .sense(Sense::hover())
+            .anchor(Align2::CENTER_CENTER, Vec2::ZERO)
+            .order(Order::Foreground)
+            .interactable(true)
+    }
+
+    /// Set the frame of the modal.
+    ///
+    /// Default is [`Frame::popup`].
+    #[inline]
+    pub fn frame(mut self, frame: Frame) -> Self {
+        self.frame = Some(frame);
+        self
+    }
+
+    /// Set the backdrop color of the modal.
+    ///
+    /// Default is `Color32::from_black_alpha(100)`.
+    #[inline]
+    pub fn backdrop_color(mut self, color: Color32) -> Self {
+        self.backdrop_color = color;
+        self
+    }
+
+    /// Set the area of the modal.
+    ///
+    /// Default is [`Modal::default_area`].
+    #[inline]
+    pub fn area(mut self, area: Area) -> Self {
+        self.area = area;
+        self
+    }
+
+    /// Show the modal.
+    pub fn show<T>(self, ctx: &Context, content: impl FnOnce(&mut Ui) -> T) -> ModalResponse<T> {
+        let Self {
+            area,
+            backdrop_color,
+            frame,
+        } = self;
+
+        let (is_top_modal, any_popup_open) = ctx.memory_mut(|mem| {
+            mem.set_modal_layer(area.layer());
+            (
+                mem.top_modal_layer() == Some(area.layer()),
+                mem.any_popup_open(),
+            )
+        });
+        let InnerResponse {
+            inner: (inner, backdrop_response),
+            response,
+        } = area.show(ctx, |ui| {
+            let bg_rect = ui.ctx().screen_rect();
+            let bg_sense = Sense {
+                click: true,
+                drag: true,
+                focusable: false,
+            };
+            let mut backdrop = ui.new_child(UiBuilder::new().sense(bg_sense).max_rect(bg_rect));
+            backdrop.set_min_size(bg_rect.size());
+            ui.painter().rect_filled(bg_rect, 0.0, backdrop_color);
+            let backdrop_response = backdrop.response();
+
+            let frame = frame.unwrap_or_else(|| Frame::popup(ui.style()));
+
+            // We need the extra scope with the sense since frame can't have a sense and since we
+            // need to prevent the clicks from passing through to the backdrop.
+            let inner = ui
+                .scope_builder(
+                    UiBuilder::new().sense(Sense {
+                        click: true,
+                        drag: true,
+                        focusable: false,
+                    }),
+                    |ui| frame.show(ui, content).inner,
+                )
+                .inner;
+
+            (inner, backdrop_response)
+        });
+
+        ModalResponse {
+            response,
+            backdrop_response,
+            inner,
+            is_top_modal,
+            any_popup_open,
+        }
+    }
+}
+
+/// The response of a modal dialog.
+pub struct ModalResponse<T> {
+    /// The response of the modal contents
+    pub response: Response,
+
+    /// The response of the modal backdrop.
+    ///
+    /// A click on this means the user clicked outside the modal,
+    /// in which case you might want to close the modal.
+    pub backdrop_response: Response,
+
+    /// The inner response from the content closure
+    pub inner: T,
+
+    /// Is this the topmost modal?
+    pub is_top_modal: bool,
+
+    /// Is there any popup open?
+    /// We need to check this before the modal contents are shown, so we can know if any popup
+    /// was open when checking if the escape key was clicked.
+    pub any_popup_open: bool,
+}
+
+impl<T> ModalResponse<T> {
+    /// Should the modal be closed?
+    /// Returns true if:
+    ///  - the backdrop was clicked
+    ///  - this is the topmost modal, no popup is open and the escape key was pressed
+    pub fn should_close(&self) -> bool {
+        let ctx = &self.response.ctx;
+        let escape_clicked = ctx.input(|i| i.key_pressed(crate::Key::Escape));
+        self.backdrop_response.clicked()
+            || (self.is_top_modal && !self.any_popup_open && escape_clicked)
+    }
+}

crates/egui/src/context.rs

@@ -1160,7 +1160,8 @@ impl Context {
     /// same widget, then `allow_focus` should only be true once (like in [`Ui::new`] (true) and [`Ui::remember_min_rect`] (false)).
     #[allow(clippy::too_many_arguments)]
     pub(crate) fn create_widget(&self, w: WidgetRect, allow_focus: bool) -> Response {
-        let interested_in_focus = w.enabled && w.sense.focusable && w.layer_id.allow_interaction();
+        let interested_in_focus =
+            w.enabled && w.sense.focusable && self.memory(|mem| mem.allows_interaction(w.layer_id));
 
         // Remember this widget
         self.write(|ctx| {
@@ -1172,7 +1173,7 @@ impl Context {
             viewport.this_pass.widgets.insert(w.layer_id, w);
 
             if allow_focus && interested_in_focus {
-                ctx.memory.interested_in_focus(w.id);
+                ctx.memory.interested_in_focus(w.id, w.layer_id);
             }
         });
 

crates/egui/src/layers.rs

@@ -95,6 +95,7 @@ impl LayerId {
     }
 
     #[inline(always)]
+    #[deprecated = "Use `Memory::allows_interaction` instead"]
     pub fn allow_interaction(&self) -> bool {
         self.order.allow_interaction()
     }