Improve popup menu to leave some margin with window edges (#17159)

Release Notes:

- Improved popup menu to leave some margin with window edges.

## Updates in GPUI

- gpui: Add `snap_to_window_with_margin` method to `anchored` to support
leave margin to window edges.

## Before

<img width="609" alt="before-snap-to-window 2024-08-30 222506"
src="https://github.com/user-attachments/assets/62bb6791-7c89-4558-9484-5c7b31f5e91e">

## After

<img width="698" alt="snap-to-window1 2024-08-30 222506"
src="https://github.com/user-attachments/assets/51634e79-2a95-42fe-8362-a3c7003648eb">

<img width="622" alt="snap-to-window 2024-08-30 222506"
src="https://github.com/user-attachments/assets/43a865d6-d238-4fdc-ae9d-8160b9ba7953">
This commit is contained in:
Jason Lee 2024-09-07 09:05:57 +08:00 committed by GitHub
parent b401f6951b
commit 47aec5e64d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 40 additions and 18 deletions

View file

@ -252,7 +252,9 @@ impl<M: ManagedView> Element for PopoverMenu<M> {
let mut menu_layout_id = None;
let menu_element = element_state.menu.borrow_mut().as_mut().map(|menu| {
let mut anchored = anchored().snap_to_window().anchor(self.anchor);
let mut anchored = anchored()
.snap_to_window_with_margin(px(8.))
.anchor(self.anchor);
if let Some(child_bounds) = element_state.child_bounds {
anchored = anchored.position(
self.resolved_attach().corner(child_bounds) + self.resolved_offset(cx),

View file

@ -1,7 +1,7 @@
use std::{cell::RefCell, rc::Rc};
use gpui::{
anchored, deferred, div, AnchorCorner, AnyElement, Bounds, DismissEvent, DispatchPhase,
anchored, deferred, div, px, AnchorCorner, AnyElement, Bounds, DismissEvent, DispatchPhase,
Element, ElementId, GlobalElementId, Hitbox, InteractiveElement, IntoElement, LayoutId,
ManagedView, MouseButton, MouseDownEvent, ParentElement, Pixels, Point, View, VisualContext,
WindowContext,
@ -118,7 +118,7 @@ impl<M: ManagedView> Element for RightClickMenu<M> {
let mut menu_layout_id = None;
let menu_element = element_state.menu.borrow_mut().as_mut().map(|menu| {
let mut anchored = anchored().snap_to_window();
let mut anchored = anchored().snap_to_window_with_margin(px(8.));
if let Some(anchor) = this.anchor {
anchored = anchored.anchor(anchor);
}