Constrain context menu to the width of the widest item

Co-Authored-By: Nathan Sobo <nathan@zed.dev>
This commit is contained in:
Antonio Scandurra 2022-05-25 14:24:53 +02:00
parent f403d87eff
commit 3b2f1644fb
8 changed files with 200 additions and 93 deletions

View file

@ -1,8 +1,8 @@
use gpui::{
elements::*, geometry::vector::Vector2F, Action, Entity, RenderContext, View, ViewContext,
elements::*, geometry::vector::Vector2F, Action, Axis, Entity, RenderContext, SizeConstraint,
View, ViewContext,
};
use settings::Settings;
use std::{marker::PhantomData, sync::Arc};
pub enum ContextMenuItem {
Item {
@ -12,75 +12,51 @@ pub enum ContextMenuItem {
Separator,
}
pub struct ContextMenu<T> {
pub struct ContextMenu {
position: Vector2F,
items: Arc<[ContextMenuItem]>,
state: UniformListState,
items: Vec<ContextMenuItem>,
widest_item_index: usize,
selected_index: Option<usize>,
widest_item_index: Option<usize>,
visible: bool,
_phantom: PhantomData<T>,
}
impl<T: 'static> Entity for ContextMenu<T> {
impl Entity for ContextMenu {
type Event = ();
}
impl<T: 'static> View for ContextMenu<T> {
impl View for ContextMenu {
fn ui_name() -> &'static str {
"ContextMenu"
}
fn render(&mut self, cx: &mut RenderContext<Self>) -> ElementBox {
enum Tag {}
if !self.visible {
return Empty::new().boxed();
}
let theme = &cx.global::<Settings>().theme;
let menu_style = &theme.project_panel.context_menu;
let separator_style = menu_style.separator;
let item_style = menu_style.item.clone();
let items = self.items.clone();
let selected_ix = self.selected_index;
let style = cx.global::<Settings>().theme.context_menu.clone();
let mut widest_item = self.render_menu_item::<()>(self.widest_item_index, cx, &style);
Overlay::new(
UniformList::new(
self.state.clone(),
self.items.len(),
move |range, elements, cx| {
let start = range.start;
elements.extend(items[range].iter().enumerate().map(|(ix, item)| {
let item_ix = start + ix;
match item {
ContextMenuItem::Item { label, action } => {
let action = action.boxed_clone();
MouseEventHandler::new::<T, _, _>(item_ix, cx, |state, _| {
let style =
item_style.style_for(state, Some(item_ix) == selected_ix);
Flex::row()
.with_child(
Label::new(label.to_string(), style.label.clone())
.boxed(),
)
.boxed()
})
.on_click(move |_, _, cx| {
cx.dispatch_any_action(action.boxed_clone())
})
.boxed()
}
ContextMenuItem::Separator => {
Empty::new().contained().with_style(separator_style).boxed()
}
}
}))
},
)
.with_width_from_item(self.widest_item_index)
.boxed(),
Flex::column()
.with_children(
(0..self.items.len()).map(|ix| self.render_menu_item::<Tag>(ix, cx, &style)),
)
.constrained()
.dynamically(move |constraint, cx| {
SizeConstraint::strict_along(
Axis::Horizontal,
widest_item.layout(constraint, cx).x(),
)
})
.contained()
.with_style(style.container)
.boxed(),
)
.with_abs_position(self.position)
.contained()
.with_style(menu_style.container)
.boxed()
}
@ -90,16 +66,14 @@ impl<T: 'static> View for ContextMenu<T> {
}
}
impl<T: 'static> ContextMenu<T> {
impl ContextMenu {
pub fn new() -> Self {
Self {
position: Default::default(),
items: Arc::from([]),
state: Default::default(),
items: Default::default(),
selected_index: Default::default(),
widest_item_index: Default::default(),
visible: false,
_phantom: PhantomData,
}
}
@ -109,7 +83,9 @@ impl<T: 'static> ContextMenu<T> {
items: impl IntoIterator<Item = ContextMenuItem>,
cx: &mut ViewContext<Self>,
) {
self.items = items.into_iter().collect();
let mut items = items.into_iter().peekable();
assert!(items.peek().is_some(), "must have at least one item");
self.items = items.collect();
self.widest_item_index = self
.items
.iter()
@ -118,10 +94,39 @@ impl<T: 'static> ContextMenu<T> {
ContextMenuItem::Item { label, .. } => label.chars().count(),
ContextMenuItem::Separator => 0,
})
.map(|(ix, _)| ix);
.unwrap()
.0;
self.position = position;
self.visible = true;
cx.focus_self();
cx.notify();
}
fn render_menu_item<T: 'static>(
&self,
ix: usize,
cx: &mut RenderContext<ContextMenu>,
style: &theme::ContextMenu,
) -> ElementBox {
match &self.items[ix] {
ContextMenuItem::Item { label, action } => {
let action = action.boxed_clone();
MouseEventHandler::new::<T, _, _>(ix, cx, |state, _| {
let style = style.item.style_for(state, Some(ix) == self.selected_index);
Flex::row()
.with_child(Label::new(label.to_string(), style.label.clone()).boxed())
.boxed()
})
.on_click(move |_, _, cx| cx.dispatch_any_action(action.boxed_clone()))
.boxed()
}
ContextMenuItem::Separator => Empty::new()
.contained()
.with_style(style.separator)
.constrained()
.with_height(1.)
.flex(1., false)
.boxed(),
}
}
}