chore: make the ui consistent (#19)
Reviewed-on: #19 Co-authored-by: Ren Amamiya <reya@lume.nu> Co-committed-by: Ren Amamiya <reya@lume.nu>
This commit was merged in pull request #19.
This commit is contained in:
Ren Amamiya
436
crates/ui/src/dock/dock.rs
Normal file
436
crates/ui/src/dock/dock.rs
Normal file
@@ -0,0 +1,436 @@
|
||||
use std::ops::Deref;
|
||||
use std::sync::Arc;
|
||||
|
||||
use gpui::prelude::FluentBuilder as _;
|
||||
use gpui::{
|
||||
App, AppContext, Axis, Context, Element, Empty, Entity, IntoElement, MouseMoveEvent,
|
||||
MouseUpEvent, ParentElement as _, Pixels, Point, Render, Style, StyleRefinement, Styled as _,
|
||||
WeakEntity, Window, div, px,
|
||||
};
|
||||
|
||||
use super::{DockArea, DockItem};
|
||||
use crate::StyledExt;
|
||||
use crate::dock::panel::PanelView;
|
||||
use crate::dock::tab_panel::TabPanel;
|
||||
use crate::resizable::{PANEL_MIN_SIZE, resize_handle};
|
||||
|
||||
#[derive(Clone)]
|
||||
struct ResizePanel;
|
||||
|
||||
impl Render for ResizePanel {
|
||||
fn render(&mut self, _window: &mut Window, _cx: &mut Context<Self>) -> impl IntoElement {
|
||||
Empty
|
||||
}
|
||||
}
|
||||
|
||||
#[derive(Debug, Clone, Copy, PartialEq, Eq)]
|
||||
pub enum DockPlacement {
|
||||
Center,
|
||||
Left,
|
||||
Bottom,
|
||||
Right,
|
||||
}
|
||||
|
||||
impl DockPlacement {
|
||||
fn axis(&self) -> Axis {
|
||||
match self {
|
||||
Self::Left | Self::Right => Axis::Horizontal,
|
||||
Self::Bottom => Axis::Vertical,
|
||||
Self::Center => unreachable!(),
|
||||
}
|
||||
}
|
||||
|
||||
pub fn is_left(&self) -> bool {
|
||||
matches!(self, Self::Left)
|
||||
}
|
||||
|
||||
pub fn is_bottom(&self) -> bool {
|
||||
matches!(self, Self::Bottom)
|
||||
}
|
||||
|
||||
pub fn is_right(&self) -> bool {
|
||||
matches!(self, Self::Right)
|
||||
}
|
||||
}
|
||||
|
||||
/// The Dock is a fixed container that places at left, bottom, right of the Windows.
|
||||
///
|
||||
/// This is unlike Panel, it can't be move or add any other panel.
|
||||
pub struct Dock {
|
||||
pub(super) placement: DockPlacement,
|
||||
dock_area: WeakEntity<DockArea>,
|
||||
|
||||
/// Dock layout
|
||||
pub(crate) panel: DockItem,
|
||||
|
||||
/// The size is means the width or height of the Dock, if the placement is left or right, the size is width, otherwise the size is height.
|
||||
pub(super) size: Pixels,
|
||||
|
||||
/// Whether the Dock is open
|
||||
pub(super) open: bool,
|
||||
|
||||
/// Whether the Dock is collapsible, default: true
|
||||
pub(super) collapsible: bool,
|
||||
|
||||
/// Whether the Dock is resizing
|
||||
resizing: bool,
|
||||
}
|
||||
|
||||
impl Dock {
|
||||
pub(crate) fn new(
|
||||
dock_area: WeakEntity<DockArea>,
|
||||
placement: DockPlacement,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) -> Self {
|
||||
let panel = cx.new(|cx| {
|
||||
let mut tab = TabPanel::new(None, dock_area.clone(), window, cx);
|
||||
tab.closable = true;
|
||||
tab
|
||||
});
|
||||
|
||||
let panel = DockItem::Tabs {
|
||||
items: Vec::new(),
|
||||
active_ix: 0,
|
||||
view: panel.clone(),
|
||||
};
|
||||
|
||||
Self::subscribe_panel_events(dock_area.clone(), &panel, window, cx);
|
||||
|
||||
Self {
|
||||
placement,
|
||||
dock_area,
|
||||
panel,
|
||||
open: true,
|
||||
collapsible: true,
|
||||
size: px(200.0),
|
||||
resizing: false,
|
||||
}
|
||||
}
|
||||
|
||||
pub fn left(
|
||||
dock_area: WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) -> Self {
|
||||
Self::new(dock_area, DockPlacement::Left, window, cx)
|
||||
}
|
||||
|
||||
pub fn bottom(
|
||||
dock_area: WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) -> Self {
|
||||
Self::new(dock_area, DockPlacement::Bottom, window, cx)
|
||||
}
|
||||
|
||||
pub fn right(
|
||||
dock_area: WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) -> Self {
|
||||
Self::new(dock_area, DockPlacement::Right, window, cx)
|
||||
}
|
||||
|
||||
/// Update the Dock to be collapsible or not.
|
||||
///
|
||||
/// And if the Dock is not collapsible, it will be open.
|
||||
pub fn set_collapsible(
|
||||
&mut self,
|
||||
collapsible: bool,
|
||||
_window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
self.collapsible = collapsible;
|
||||
if !collapsible {
|
||||
self.open = true
|
||||
}
|
||||
cx.notify();
|
||||
}
|
||||
|
||||
fn subscribe_panel_events(
|
||||
dock_area: WeakEntity<DockArea>,
|
||||
panel: &DockItem,
|
||||
window: &mut Window,
|
||||
cx: &mut App,
|
||||
) {
|
||||
match panel {
|
||||
DockItem::Tabs { view, .. } => {
|
||||
window.defer(cx, {
|
||||
let view = view.clone();
|
||||
move |window, cx| {
|
||||
_ = dock_area.update(cx, |this, cx| {
|
||||
this.subscribe_panel(&view, window, cx);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
DockItem::Split { items, view, .. } => {
|
||||
for item in items {
|
||||
Self::subscribe_panel_events(dock_area.clone(), item, window, cx);
|
||||
}
|
||||
window.defer(cx, {
|
||||
let view = view.clone();
|
||||
move |window, cx| {
|
||||
_ = dock_area.update(cx, |this, cx| {
|
||||
this.subscribe_panel(&view, window, cx);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
DockItem::Panel { .. } => {
|
||||
// Not supported
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
pub fn set_panel(&mut self, panel: DockItem, _window: &mut Window, cx: &mut Context<Self>) {
|
||||
self.panel = panel;
|
||||
cx.notify();
|
||||
}
|
||||
|
||||
pub fn is_open(&self) -> bool {
|
||||
self.open
|
||||
}
|
||||
|
||||
pub fn toggle_open(&mut self, window: &mut Window, cx: &mut Context<Self>) {
|
||||
self.set_open(!self.open, window, cx);
|
||||
}
|
||||
|
||||
/// Returns the size of the Dock, the size is means the width or height of
|
||||
/// the Dock, if the placement is left or right, the size is width,
|
||||
/// otherwise the size is height.
|
||||
pub fn size(&self) -> Pixels {
|
||||
self.size
|
||||
}
|
||||
|
||||
/// Set the size of the Dock.
|
||||
pub fn set_size(&mut self, size: Pixels, _window: &mut Window, cx: &mut Context<Self>) {
|
||||
self.size = size.max(PANEL_MIN_SIZE);
|
||||
cx.notify();
|
||||
}
|
||||
|
||||
/// Set the open state of the Dock.
|
||||
pub fn set_open(&mut self, open: bool, window: &mut Window, cx: &mut Context<Self>) {
|
||||
self.open = open;
|
||||
let item = self.panel.clone();
|
||||
cx.defer_in(window, move |_, window, cx| {
|
||||
item.set_collapsed(!open, window, cx);
|
||||
});
|
||||
cx.notify();
|
||||
}
|
||||
|
||||
/// Add item to the Dock.
|
||||
pub fn add_panel(
|
||||
&mut self,
|
||||
panel: Arc<dyn PanelView>,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
self.panel.add_panel(panel, &self.dock_area, window, cx);
|
||||
cx.notify();
|
||||
}
|
||||
|
||||
fn render_resize_handle(
|
||||
&mut self,
|
||||
_window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) -> impl IntoElement {
|
||||
let axis = self.placement.axis();
|
||||
let view = cx.entity().clone();
|
||||
|
||||
resize_handle("resize-handle", axis)
|
||||
.placement(self.placement)
|
||||
.on_drag(ResizePanel {}, move |info, _, _, cx| {
|
||||
cx.stop_propagation();
|
||||
view.update(cx, |view, _cx| {
|
||||
view.resizing = true;
|
||||
});
|
||||
cx.new(|_| info.deref().clone())
|
||||
})
|
||||
}
|
||||
|
||||
fn resize(
|
||||
&mut self,
|
||||
mouse_position: Point<Pixels>,
|
||||
_window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
if !self.resizing {
|
||||
return;
|
||||
}
|
||||
|
||||
let dock_area = self
|
||||
.dock_area
|
||||
.upgrade()
|
||||
.expect("DockArea is missing")
|
||||
.read(cx);
|
||||
|
||||
let area_bounds = dock_area.bounds;
|
||||
let mut left_dock_size = px(0.0);
|
||||
let mut right_dock_size = px(0.0);
|
||||
|
||||
// Get the size of the left dock if it's open and not the current dock
|
||||
if let Some(left_dock) = &dock_area.left_dock {
|
||||
if left_dock.entity_id() != cx.entity().entity_id() {
|
||||
let left_dock_read = left_dock.read(cx);
|
||||
if left_dock_read.is_open() {
|
||||
left_dock_size = left_dock_read.size;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Get the size of the right dock if it's open and not the current dock
|
||||
if let Some(right_dock) = &dock_area.right_dock {
|
||||
if right_dock.entity_id() != cx.entity().entity_id() {
|
||||
let right_dock_read = right_dock.read(cx);
|
||||
if right_dock_read.is_open() {
|
||||
right_dock_size = right_dock_read.size;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
let size = match self.placement {
|
||||
DockPlacement::Left => mouse_position.x - area_bounds.left(),
|
||||
DockPlacement::Right => area_bounds.right() - mouse_position.x,
|
||||
DockPlacement::Bottom => area_bounds.bottom() - mouse_position.y,
|
||||
DockPlacement::Center => unreachable!(),
|
||||
};
|
||||
|
||||
match self.placement {
|
||||
DockPlacement::Left => {
|
||||
let max_size = area_bounds.size.width - PANEL_MIN_SIZE - right_dock_size;
|
||||
self.size = size.clamp(PANEL_MIN_SIZE, max_size);
|
||||
}
|
||||
DockPlacement::Right => {
|
||||
let max_size = area_bounds.size.width - PANEL_MIN_SIZE - left_dock_size;
|
||||
self.size = size.clamp(PANEL_MIN_SIZE, max_size);
|
||||
}
|
||||
DockPlacement::Bottom => {
|
||||
let max_size = area_bounds.size.height - PANEL_MIN_SIZE;
|
||||
self.size = size.clamp(PANEL_MIN_SIZE, max_size);
|
||||
}
|
||||
DockPlacement::Center => unreachable!(),
|
||||
}
|
||||
|
||||
cx.notify();
|
||||
}
|
||||
|
||||
fn done_resizing(&mut self, _window: &mut Window, _cx: &mut Context<Self>) {
|
||||
self.resizing = false;
|
||||
}
|
||||
}
|
||||
|
||||
impl Render for Dock {
|
||||
fn render(&mut self, window: &mut Window, cx: &mut Context<Self>) -> impl gpui::IntoElement {
|
||||
if !self.open && !self.placement.is_bottom() {
|
||||
return div();
|
||||
}
|
||||
|
||||
let cache_style = StyleRefinement::default().absolute().size_full();
|
||||
|
||||
div()
|
||||
.relative()
|
||||
.overflow_hidden()
|
||||
.map(|this| match self.placement {
|
||||
DockPlacement::Left | DockPlacement::Right => this.h_flex().h_full().w(self.size),
|
||||
DockPlacement::Bottom => this.w_full().h(self.size),
|
||||
DockPlacement::Center => unreachable!(),
|
||||
})
|
||||
// Bottom Dock should keep the title bar, then user can click the Toggle button
|
||||
.when(!self.open && self.placement.is_bottom(), |this| {
|
||||
this.h(px(29.))
|
||||
})
|
||||
.map(|this| match &self.panel {
|
||||
DockItem::Split { view, .. } => this.child(view.clone()),
|
||||
DockItem::Tabs { view, .. } => this.child(view.clone()),
|
||||
DockItem::Panel { view, .. } => this.child(view.clone().view().cached(cache_style)),
|
||||
})
|
||||
.child(self.render_resize_handle(window, cx))
|
||||
.child(DockElement {
|
||||
view: cx.entity().clone(),
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
struct DockElement {
|
||||
view: Entity<Dock>,
|
||||
}
|
||||
|
||||
impl IntoElement for DockElement {
|
||||
type Element = Self;
|
||||
|
||||
fn into_element(self) -> Self::Element {
|
||||
self
|
||||
}
|
||||
}
|
||||
|
||||
impl Element for DockElement {
|
||||
type PrepaintState = ();
|
||||
type RequestLayoutState = ();
|
||||
|
||||
fn id(&self) -> Option<gpui::ElementId> {
|
||||
None
|
||||
}
|
||||
|
||||
fn source_location(&self) -> Option<&'static std::panic::Location<'static>> {
|
||||
None
|
||||
}
|
||||
|
||||
fn request_layout(
|
||||
&mut self,
|
||||
_: Option<&gpui::GlobalElementId>,
|
||||
_: Option<&gpui::InspectorElementId>,
|
||||
window: &mut gpui::Window,
|
||||
cx: &mut App,
|
||||
) -> (gpui::LayoutId, Self::RequestLayoutState) {
|
||||
(window.request_layout(Style::default(), None, cx), ())
|
||||
}
|
||||
|
||||
fn prepaint(
|
||||
&mut self,
|
||||
_: Option<&gpui::GlobalElementId>,
|
||||
_: Option<&gpui::InspectorElementId>,
|
||||
_: gpui::Bounds<Pixels>,
|
||||
_: &mut Self::RequestLayoutState,
|
||||
_window: &mut Window,
|
||||
_cx: &mut App,
|
||||
) -> Self::PrepaintState {
|
||||
}
|
||||
|
||||
fn paint(
|
||||
&mut self,
|
||||
_: Option<&gpui::GlobalElementId>,
|
||||
_: Option<&gpui::InspectorElementId>,
|
||||
_: gpui::Bounds<Pixels>,
|
||||
_: &mut Self::RequestLayoutState,
|
||||
_: &mut Self::PrepaintState,
|
||||
window: &mut gpui::Window,
|
||||
cx: &mut App,
|
||||
) {
|
||||
window.on_mouse_event({
|
||||
let view = self.view.clone();
|
||||
let is_resizing = view.read(cx).resizing;
|
||||
move |e: &MouseMoveEvent, phase, window, cx| {
|
||||
if !is_resizing {
|
||||
return;
|
||||
}
|
||||
if !phase.bubble() {
|
||||
return;
|
||||
}
|
||||
|
||||
view.update(cx, |view, cx| view.resize(e.position, window, cx))
|
||||
}
|
||||
});
|
||||
|
||||
// When any mouse up, stop dragging
|
||||
window.on_mouse_event({
|
||||
let view = self.view.clone();
|
||||
move |_: &MouseUpEvent, phase, window, cx| {
|
||||
if phase.bubble() {
|
||||
view.update(cx, |view, cx| view.done_resizing(window, cx));
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
807
crates/ui/src/dock/mod.rs
Normal file
807
crates/ui/src/dock/mod.rs
Normal file
@@ -0,0 +1,807 @@
|
||||
use std::sync::Arc;
|
||||
|
||||
use gpui::prelude::FluentBuilder;
|
||||
use gpui::{
|
||||
AnyElement, AnyView, App, AppContext, Axis, Bounds, Context, Decorations, Edges, Entity,
|
||||
EntityId, EventEmitter, Focusable, InteractiveElement as _, IntoElement, ParentElement as _,
|
||||
Pixels, Render, SharedString, Styled, Subscription, WeakEntity, Window, actions, div, px,
|
||||
};
|
||||
use theme::CLIENT_SIDE_DECORATION_ROUNDING;
|
||||
|
||||
use crate::ElementExt;
|
||||
|
||||
#[allow(clippy::module_inception)]
|
||||
mod dock;
|
||||
mod panel;
|
||||
mod stack_panel;
|
||||
mod tab_panel;
|
||||
|
||||
pub use dock::*;
|
||||
pub use panel::*;
|
||||
pub use stack_panel::*;
|
||||
pub use tab_panel::*;
|
||||
|
||||
actions!(dock, [ToggleZoom, ClosePanel]);
|
||||
|
||||
pub enum DockEvent {
|
||||
/// The layout of the dock has changed, subscribers this to save the layout.
|
||||
///
|
||||
/// This event is emitted when every time the layout of the dock has changed,
|
||||
/// So it emits may be too frequently, you may want to debounce the event.
|
||||
LayoutChanged,
|
||||
}
|
||||
|
||||
/// The main area of the dock.
|
||||
pub struct DockArea {
|
||||
pub(crate) bounds: Bounds<Pixels>,
|
||||
|
||||
/// The center view of the dockarea.
|
||||
pub items: DockItem,
|
||||
|
||||
/// The left dock of the dock_area.
|
||||
left_dock: Option<Entity<Dock>>,
|
||||
|
||||
/// The bottom dock of the dock_area.
|
||||
bottom_dock: Option<Entity<Dock>>,
|
||||
|
||||
/// The right dock of the dock_area.
|
||||
right_dock: Option<Entity<Dock>>,
|
||||
|
||||
/// The entity_id of the [`TabPanel`](TabPanel) where each toggle button should be displayed,
|
||||
toggle_button_panels: Edges<Option<EntityId>>,
|
||||
|
||||
/// Whether to show the toggle button.
|
||||
toggle_button_visible: bool,
|
||||
|
||||
/// The top zoom view of the dock_area, if any.
|
||||
zoom_view: Option<AnyView>,
|
||||
|
||||
/// Lock panels layout, but allow to resize.
|
||||
is_locked: bool,
|
||||
|
||||
/// The panel style, default is [`PanelStyle::Default`](PanelStyle::Default).
|
||||
pub(crate) panel_style: PanelStyle,
|
||||
subscriptions: Vec<Subscription>,
|
||||
}
|
||||
|
||||
/// DockItem is a tree structure that represents the layout of the dock.
|
||||
#[derive(Clone)]
|
||||
pub enum DockItem {
|
||||
/// Split layout
|
||||
Split {
|
||||
axis: Axis,
|
||||
items: Vec<DockItem>,
|
||||
sizes: Vec<Option<Pixels>>,
|
||||
view: Entity<StackPanel>,
|
||||
},
|
||||
/// Tab layout
|
||||
Tabs {
|
||||
items: Vec<Arc<dyn PanelView>>,
|
||||
active_ix: usize,
|
||||
view: Entity<TabPanel>,
|
||||
},
|
||||
/// Single panel layout
|
||||
Panel { view: Arc<dyn PanelView> },
|
||||
}
|
||||
|
||||
impl DockItem {
|
||||
/// Create DockItem with split layout, each item of panel have equal size.
|
||||
pub fn split(
|
||||
axis: Axis,
|
||||
items: Vec<DockItem>,
|
||||
dock_area: &WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut App,
|
||||
) -> Self {
|
||||
let sizes = vec![None; items.len()];
|
||||
|
||||
Self::split_with_sizes(axis, items, sizes, dock_area, window, cx)
|
||||
}
|
||||
|
||||
/// Create DockItem with split layout, each item of panel have specified size.
|
||||
///
|
||||
/// Please note that the `items` and `sizes` must have the same length.
|
||||
/// Set `None` in `sizes` to make the index of panel have auto size.
|
||||
pub fn split_with_sizes(
|
||||
axis: Axis,
|
||||
items: Vec<DockItem>,
|
||||
sizes: Vec<Option<Pixels>>,
|
||||
dock_area: &WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut App,
|
||||
) -> Self {
|
||||
let mut items = items;
|
||||
|
||||
let stack_panel = cx.new(|cx| {
|
||||
let mut stack_panel = StackPanel::new(axis, window, cx);
|
||||
for (i, item) in items.iter_mut().enumerate() {
|
||||
let view = item.view();
|
||||
let size = sizes.get(i).copied().flatten();
|
||||
stack_panel.add_panel(view.clone(), size, dock_area.clone(), window, cx)
|
||||
}
|
||||
|
||||
for (i, item) in items.iter().enumerate() {
|
||||
let view = item.view();
|
||||
let size = sizes.get(i).copied().flatten();
|
||||
stack_panel.add_panel(view.clone(), size, dock_area.clone(), window, cx)
|
||||
}
|
||||
|
||||
stack_panel
|
||||
});
|
||||
|
||||
window.defer(cx, {
|
||||
let stack_panel = stack_panel.clone();
|
||||
let dock_area = dock_area.clone();
|
||||
move |window, cx| {
|
||||
_ = dock_area.update(cx, |this, cx| {
|
||||
this.subscribe_panel(&stack_panel, window, cx);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
Self::Split {
|
||||
axis,
|
||||
items,
|
||||
sizes,
|
||||
view: stack_panel,
|
||||
}
|
||||
}
|
||||
|
||||
/// Create DockItem with panel layout
|
||||
pub fn panel(panel: Arc<dyn PanelView>) -> Self {
|
||||
Self::Panel { view: panel }
|
||||
}
|
||||
|
||||
/// Create DockItem with tabs layout, items are displayed as tabs.
|
||||
///
|
||||
/// The `active_ix` is the index of the active tab, if `None` the first tab is active.
|
||||
pub fn tabs(
|
||||
items: Vec<Arc<dyn PanelView>>,
|
||||
active_ix: Option<usize>,
|
||||
dock_area: &WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut App,
|
||||
) -> Self {
|
||||
let mut new_items: Vec<Arc<dyn PanelView>> = vec![];
|
||||
for item in items.into_iter() {
|
||||
new_items.push(item)
|
||||
}
|
||||
Self::new_tabs(new_items, active_ix, dock_area, window, cx)
|
||||
}
|
||||
|
||||
pub fn tab<P: Panel>(
|
||||
item: Entity<P>,
|
||||
dock_area: &WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut App,
|
||||
) -> Self {
|
||||
Self::new_tabs(vec![Arc::new(item.clone())], None, dock_area, window, cx)
|
||||
}
|
||||
|
||||
fn new_tabs(
|
||||
items: Vec<Arc<dyn PanelView>>,
|
||||
active_ix: Option<usize>,
|
||||
dock_area: &WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut App,
|
||||
) -> Self {
|
||||
let active_ix = active_ix.unwrap_or(0);
|
||||
let tab_panel = cx.new(|cx| {
|
||||
let mut tab_panel = TabPanel::new(None, dock_area.clone(), window, cx);
|
||||
for item in items.iter() {
|
||||
tab_panel.add_panel(item.clone(), window, cx)
|
||||
}
|
||||
tab_panel.active_ix = active_ix;
|
||||
tab_panel
|
||||
});
|
||||
|
||||
Self::Tabs {
|
||||
items,
|
||||
active_ix,
|
||||
view: tab_panel,
|
||||
}
|
||||
}
|
||||
|
||||
/// Returns all panel ids
|
||||
pub fn panel_ids(&self, cx: &App) -> Vec<SharedString> {
|
||||
match self {
|
||||
Self::Panel { .. } => vec![],
|
||||
Self::Tabs { view, .. } => view.read(cx).panel_ids(cx),
|
||||
Self::Split { items, .. } => items
|
||||
.iter()
|
||||
.filter_map(|item| match item {
|
||||
DockItem::Tabs { view, .. } => Some(view.read(cx).panel_ids(cx)),
|
||||
_ => None,
|
||||
})
|
||||
.flatten()
|
||||
.collect(),
|
||||
}
|
||||
}
|
||||
|
||||
/// Returns the views of the dock item.
|
||||
pub fn view(&self) -> Arc<dyn PanelView> {
|
||||
match self {
|
||||
Self::Split { view, .. } => Arc::new(view.clone()),
|
||||
Self::Tabs { view, .. } => Arc::new(view.clone()),
|
||||
Self::Panel { view, .. } => view.clone(),
|
||||
}
|
||||
}
|
||||
|
||||
/// Find existing panel in the dock item.
|
||||
pub fn find_panel(&self, panel: Arc<dyn PanelView>) -> Option<Arc<dyn PanelView>> {
|
||||
match self {
|
||||
Self::Split { items, .. } => {
|
||||
items.iter().find_map(|item| item.find_panel(panel.clone()))
|
||||
}
|
||||
Self::Tabs { items, .. } => items.iter().find(|item| *item == &panel).cloned(),
|
||||
Self::Panel { view } => Some(view.clone()),
|
||||
}
|
||||
}
|
||||
|
||||
/// Add a panel to the dock item.
|
||||
pub fn add_panel(
|
||||
&mut self,
|
||||
panel: Arc<dyn PanelView>,
|
||||
dock_area: &WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut App,
|
||||
) {
|
||||
match self {
|
||||
Self::Tabs { view, items, .. } => {
|
||||
items.push(panel.clone());
|
||||
view.update(cx, |tab_panel, cx| {
|
||||
tab_panel.add_panel(panel, window, cx);
|
||||
});
|
||||
}
|
||||
Self::Split { view, items, .. } => {
|
||||
// Iter items to add panel to the first tabs
|
||||
for item in items.iter_mut() {
|
||||
if let DockItem::Tabs { view, .. } = item {
|
||||
view.update(cx, |tab_panel, cx| {
|
||||
tab_panel.add_panel(panel.clone(), window, cx);
|
||||
});
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
// Unable to find tabs, create new tabs
|
||||
let new_item = Self::tabs(vec![panel.clone()], None, dock_area, window, cx);
|
||||
items.push(new_item.clone());
|
||||
view.update(cx, |stack_panel, cx| {
|
||||
stack_panel.add_panel(new_item.view(), None, dock_area.clone(), window, cx);
|
||||
});
|
||||
}
|
||||
Self::Panel { .. } => {}
|
||||
}
|
||||
}
|
||||
|
||||
/// Set the collapsed state of the dock area
|
||||
pub fn set_collapsed(&self, collapsed: bool, window: &mut Window, cx: &mut App) {
|
||||
match self {
|
||||
DockItem::Tabs { view, .. } => {
|
||||
view.update(cx, |tab_panel, cx| {
|
||||
tab_panel.set_collapsed(collapsed, window, cx);
|
||||
});
|
||||
}
|
||||
DockItem::Split { items, .. } => {
|
||||
// For each child item, set collapsed state
|
||||
for item in items {
|
||||
item.set_collapsed(collapsed, window, cx);
|
||||
}
|
||||
}
|
||||
DockItem::Panel { .. } => {}
|
||||
}
|
||||
}
|
||||
|
||||
/// Recursively traverses to find the left-most and top-most TabPanel.
|
||||
pub(crate) fn left_top_tab_panel(&self, cx: &App) -> Option<Entity<TabPanel>> {
|
||||
match self {
|
||||
DockItem::Tabs { view, .. } => Some(view.clone()),
|
||||
DockItem::Split { view, .. } => view.read(cx).left_top_tab_panel(true, cx),
|
||||
DockItem::Panel { .. } => None,
|
||||
}
|
||||
}
|
||||
|
||||
/// Recursively traverses to find the right-most and top-most TabPanel.
|
||||
pub(crate) fn right_top_tab_panel(&self, cx: &App) -> Option<Entity<TabPanel>> {
|
||||
match self {
|
||||
DockItem::Tabs { view, .. } => Some(view.clone()),
|
||||
DockItem::Split { view, .. } => view.read(cx).right_top_tab_panel(true, cx),
|
||||
DockItem::Panel { .. } => None,
|
||||
}
|
||||
}
|
||||
|
||||
pub(crate) fn focus_tab_panel(&self, window: &mut Window, cx: &mut App) {
|
||||
if let DockItem::Tabs { view, .. } = self {
|
||||
window.focus(&view.read(cx).focus_handle(cx), cx);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
impl DockArea {
|
||||
pub fn new(window: &mut Window, cx: &mut Context<Self>) -> Self {
|
||||
let stack_panel = cx.new(|cx| StackPanel::new(Axis::Horizontal, window, cx));
|
||||
|
||||
let dock_item = DockItem::Split {
|
||||
axis: Axis::Horizontal,
|
||||
items: vec![],
|
||||
sizes: vec![],
|
||||
view: stack_panel.clone(),
|
||||
};
|
||||
|
||||
let mut this = Self {
|
||||
bounds: Bounds::default(),
|
||||
items: dock_item,
|
||||
zoom_view: None,
|
||||
toggle_button_panels: Edges::default(),
|
||||
toggle_button_visible: true,
|
||||
left_dock: None,
|
||||
right_dock: None,
|
||||
bottom_dock: None,
|
||||
is_locked: false,
|
||||
panel_style: PanelStyle::Default,
|
||||
subscriptions: vec![],
|
||||
};
|
||||
|
||||
this.subscribe_panel(&stack_panel, window, cx);
|
||||
|
||||
this
|
||||
}
|
||||
|
||||
/// Set the panel style of the dock area.
|
||||
pub fn style(mut self, style: PanelStyle) -> Self {
|
||||
self.panel_style = style;
|
||||
self
|
||||
}
|
||||
|
||||
/// The DockItem as the center of the dock area.
|
||||
///
|
||||
/// This is used to render at the Center of the DockArea.
|
||||
pub fn set_center(&mut self, item: DockItem, window: &mut Window, cx: &mut Context<Self>) {
|
||||
self.subscribe_item(&item, window, cx);
|
||||
self.items = item;
|
||||
self.update_toggle_button_tab_panels(window, cx);
|
||||
cx.notify();
|
||||
}
|
||||
|
||||
pub fn set_left_dock(
|
||||
&mut self,
|
||||
panel: DockItem,
|
||||
size: Option<Pixels>,
|
||||
open: bool,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
self.subscribe_item(&panel, window, cx);
|
||||
let weak_self = cx.entity().downgrade();
|
||||
self.left_dock = Some(cx.new(|cx| {
|
||||
let mut dock = Dock::left(weak_self.clone(), window, cx);
|
||||
if let Some(size) = size {
|
||||
dock.set_size(size, window, cx);
|
||||
}
|
||||
dock.set_panel(panel, window, cx);
|
||||
dock.set_open(open, window, cx);
|
||||
dock
|
||||
}));
|
||||
self.update_toggle_button_tab_panels(window, cx);
|
||||
}
|
||||
|
||||
pub fn set_bottom_dock(
|
||||
&mut self,
|
||||
panel: DockItem,
|
||||
size: Option<Pixels>,
|
||||
open: bool,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
self.subscribe_item(&panel, window, cx);
|
||||
let weak_self = cx.entity().downgrade();
|
||||
self.bottom_dock = Some(cx.new(|cx| {
|
||||
let mut dock = Dock::bottom(weak_self.clone(), window, cx);
|
||||
if let Some(size) = size {
|
||||
dock.set_size(size, window, cx);
|
||||
}
|
||||
dock.set_panel(panel, window, cx);
|
||||
dock.set_open(open, window, cx);
|
||||
dock
|
||||
}));
|
||||
self.update_toggle_button_tab_panels(window, cx);
|
||||
}
|
||||
|
||||
pub fn set_right_dock(
|
||||
&mut self,
|
||||
panel: DockItem,
|
||||
size: Option<Pixels>,
|
||||
open: bool,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
self.subscribe_item(&panel, window, cx);
|
||||
let weak_self = cx.entity().downgrade();
|
||||
self.right_dock = Some(cx.new(|cx| {
|
||||
let mut dock = Dock::right(weak_self.clone(), window, cx);
|
||||
if let Some(size) = size {
|
||||
dock.set_size(size, window, cx);
|
||||
}
|
||||
dock.set_panel(panel, window, cx);
|
||||
dock.set_open(open, window, cx);
|
||||
dock
|
||||
}));
|
||||
self.update_toggle_button_tab_panels(window, cx);
|
||||
}
|
||||
|
||||
/// Reset all docks
|
||||
pub fn reset(&mut self, _window: &mut Window, cx: &mut Context<Self>) {
|
||||
self.left_dock = None;
|
||||
self.right_dock = None;
|
||||
self.bottom_dock = None;
|
||||
cx.notify();
|
||||
}
|
||||
|
||||
/// Set locked state of the dock area, if locked, the dock area cannot be split or move, but allows to resize panels.
|
||||
pub fn set_locked(&mut self, locked: bool, _window: &mut Window, _cx: &mut App) {
|
||||
self.is_locked = locked;
|
||||
}
|
||||
|
||||
/// Determine if the dock area is locked.
|
||||
pub fn is_locked(&self) -> bool {
|
||||
self.is_locked
|
||||
}
|
||||
|
||||
/// Determine if the dock area has a dock at the given placement.
|
||||
pub fn has_dock(&self, placement: DockPlacement) -> bool {
|
||||
match placement {
|
||||
DockPlacement::Left => self.left_dock.is_some(),
|
||||
DockPlacement::Bottom => self.bottom_dock.is_some(),
|
||||
DockPlacement::Right => self.right_dock.is_some(),
|
||||
DockPlacement::Center => false,
|
||||
}
|
||||
}
|
||||
|
||||
/// Determine if the dock at the given placement is open.
|
||||
pub fn is_dock_open(&self, placement: DockPlacement, cx: &App) -> bool {
|
||||
match placement {
|
||||
DockPlacement::Left => self
|
||||
.left_dock
|
||||
.as_ref()
|
||||
.map(|dock| dock.read(cx).is_open())
|
||||
.unwrap_or(false),
|
||||
DockPlacement::Bottom => self
|
||||
.bottom_dock
|
||||
.as_ref()
|
||||
.map(|dock| dock.read(cx).is_open())
|
||||
.unwrap_or(false),
|
||||
DockPlacement::Right => self
|
||||
.right_dock
|
||||
.as_ref()
|
||||
.map(|dock| dock.read(cx).is_open())
|
||||
.unwrap_or(false),
|
||||
DockPlacement::Center => false,
|
||||
}
|
||||
}
|
||||
|
||||
/// Set the dock at the given placement to be open or closed.
|
||||
///
|
||||
/// Only the left, bottom, right dock can be toggled.
|
||||
pub fn set_dock_collapsible(
|
||||
&mut self,
|
||||
collapsible_edges: Edges<bool>,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
if let Some(left_dock) = self.left_dock.as_ref() {
|
||||
left_dock.update(cx, |dock, cx| {
|
||||
dock.set_collapsible(collapsible_edges.left, window, cx);
|
||||
});
|
||||
}
|
||||
|
||||
if let Some(bottom_dock) = self.bottom_dock.as_ref() {
|
||||
bottom_dock.update(cx, |dock, cx| {
|
||||
dock.set_collapsible(collapsible_edges.bottom, window, cx);
|
||||
});
|
||||
}
|
||||
|
||||
if let Some(right_dock) = self.right_dock.as_ref() {
|
||||
right_dock.update(cx, |dock, cx| {
|
||||
dock.set_collapsible(collapsible_edges.right, window, cx);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/// Determine if the dock at the given placement is collapsible.
|
||||
pub fn is_dock_collapsible(&self, placement: DockPlacement, cx: &App) -> bool {
|
||||
match placement {
|
||||
DockPlacement::Left => self
|
||||
.left_dock
|
||||
.as_ref()
|
||||
.map(|dock| dock.read(cx).collapsible)
|
||||
.unwrap_or(false),
|
||||
DockPlacement::Bottom => self
|
||||
.bottom_dock
|
||||
.as_ref()
|
||||
.map(|dock| dock.read(cx).collapsible)
|
||||
.unwrap_or(false),
|
||||
DockPlacement::Right => self
|
||||
.right_dock
|
||||
.as_ref()
|
||||
.map(|dock| dock.read(cx).collapsible)
|
||||
.unwrap_or(false),
|
||||
DockPlacement::Center => false,
|
||||
}
|
||||
}
|
||||
|
||||
pub fn toggle_dock(
|
||||
&self,
|
||||
placement: DockPlacement,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
let dock = match placement {
|
||||
DockPlacement::Left => &self.left_dock,
|
||||
DockPlacement::Bottom => &self.bottom_dock,
|
||||
DockPlacement::Right => &self.right_dock,
|
||||
DockPlacement::Center => return,
|
||||
};
|
||||
|
||||
if let Some(dock) = dock {
|
||||
dock.update(cx, |view, cx| {
|
||||
view.toggle_open(window, cx);
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
/// Add a panel item to the dock area at the given placement.
|
||||
///
|
||||
/// If the left, bottom, right dock is not present, it will set the dock at the placement.
|
||||
pub fn add_panel(
|
||||
&mut self,
|
||||
panel: Arc<dyn PanelView>,
|
||||
placement: DockPlacement,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
let weak_self = cx.entity().downgrade();
|
||||
|
||||
match placement {
|
||||
DockPlacement::Left => {
|
||||
if let Some(dock) = self.left_dock.as_ref() {
|
||||
dock.update(cx, |dock, cx| dock.add_panel(panel, window, cx))
|
||||
} else {
|
||||
self.set_left_dock(
|
||||
DockItem::tabs(vec![panel], None, &weak_self, window, cx),
|
||||
Some(px(320.)),
|
||||
true,
|
||||
window,
|
||||
cx,
|
||||
);
|
||||
}
|
||||
}
|
||||
DockPlacement::Bottom => {
|
||||
if let Some(dock) = self.bottom_dock.as_ref() {
|
||||
dock.update(cx, |dock, cx| dock.add_panel(panel, window, cx))
|
||||
} else {
|
||||
self.set_bottom_dock(
|
||||
DockItem::tabs(vec![panel], None, &weak_self, window, cx),
|
||||
None,
|
||||
true,
|
||||
window,
|
||||
cx,
|
||||
);
|
||||
}
|
||||
}
|
||||
DockPlacement::Right => {
|
||||
self.set_right_dock(
|
||||
DockItem::tabs(vec![panel], None, &weak_self, window, cx),
|
||||
Some(px(320.)),
|
||||
true,
|
||||
window,
|
||||
cx,
|
||||
);
|
||||
}
|
||||
DockPlacement::Center => {
|
||||
self.items
|
||||
.add_panel(panel, &cx.entity().downgrade(), window, cx);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/// Subscribe event on the panels
|
||||
fn subscribe_item(&mut self, item: &DockItem, window: &mut Window, cx: &mut Context<Self>) {
|
||||
match item {
|
||||
DockItem::Split { items, view, .. } => {
|
||||
for item in items {
|
||||
self.subscribe_item(item, window, cx);
|
||||
}
|
||||
|
||||
self.subscriptions.push(cx.subscribe_in(
|
||||
view,
|
||||
window,
|
||||
move |_, _, event, window, cx| {
|
||||
if let PanelEvent::LayoutChanged = event {
|
||||
cx.spawn_in(window, async move |view, window| {
|
||||
_ = view.update_in(window, |view, window, cx| {
|
||||
view.update_toggle_button_tab_panels(window, cx)
|
||||
});
|
||||
})
|
||||
.detach();
|
||||
|
||||
cx.emit(DockEvent::LayoutChanged);
|
||||
}
|
||||
},
|
||||
));
|
||||
}
|
||||
DockItem::Tabs { .. } => {
|
||||
// We subscribe to the tab panel event in StackPanel's insert_panel
|
||||
}
|
||||
DockItem::Panel { .. } => {
|
||||
// Not supported
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/// Subscribe zoom event on the panel
|
||||
pub(crate) fn subscribe_panel<P: Panel>(
|
||||
&mut self,
|
||||
view: &Entity<P>,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<DockArea>,
|
||||
) {
|
||||
let subscription =
|
||||
cx.subscribe_in(
|
||||
view,
|
||||
window,
|
||||
move |_this, panel, event, window, cx| match event {
|
||||
PanelEvent::ZoomIn => {
|
||||
let panel = panel.clone();
|
||||
cx.spawn_in(window, async move |view, window| {
|
||||
view.update_in(window, |view, window, cx| {
|
||||
view.set_zoomed_in(panel, window, cx);
|
||||
cx.notify();
|
||||
})
|
||||
.ok();
|
||||
})
|
||||
.detach();
|
||||
}
|
||||
PanelEvent::ZoomOut => {
|
||||
cx.spawn_in(window, async move |view, window| {
|
||||
_ = view.update_in(window, |view, window, cx| {
|
||||
view.set_zoomed_out(window, cx);
|
||||
});
|
||||
})
|
||||
.detach();
|
||||
}
|
||||
PanelEvent::LayoutChanged => {
|
||||
cx.spawn_in(window, async move |view, window| {
|
||||
view.update_in(window, |view, window, cx| {
|
||||
view.update_toggle_button_tab_panels(window, cx)
|
||||
})
|
||||
.ok();
|
||||
})
|
||||
.detach();
|
||||
// Emit layout changed event for dock
|
||||
cx.emit(DockEvent::LayoutChanged);
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
self.subscriptions.push(subscription);
|
||||
}
|
||||
|
||||
pub fn set_zoomed_in<P: Panel>(
|
||||
&mut self,
|
||||
panel: Entity<P>,
|
||||
_: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
self.zoom_view = Some(panel.into());
|
||||
cx.notify();
|
||||
}
|
||||
|
||||
pub fn set_zoomed_out(&mut self, _window: &mut Window, cx: &mut Context<Self>) {
|
||||
self.zoom_view = None;
|
||||
cx.notify();
|
||||
}
|
||||
|
||||
fn render_items(&self, _window: &mut Window, _cx: &mut Context<Self>) -> AnyElement {
|
||||
match &self.items {
|
||||
DockItem::Split { view, .. } => view.clone().into_any_element(),
|
||||
DockItem::Tabs { view, .. } => view.clone().into_any_element(),
|
||||
DockItem::Panel { view, .. } => view.clone().view().into_any_element(),
|
||||
}
|
||||
}
|
||||
|
||||
pub fn update_toggle_button_tab_panels(
|
||||
&mut self,
|
||||
_window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
// Left toggle button
|
||||
self.toggle_button_panels.left = self
|
||||
.items
|
||||
.left_top_tab_panel(cx)
|
||||
.map(|view| view.entity_id());
|
||||
|
||||
// Right toggle button
|
||||
self.toggle_button_panels.right = self
|
||||
.items
|
||||
.right_top_tab_panel(cx)
|
||||
.map(|view| view.entity_id());
|
||||
|
||||
// Bottom toggle button
|
||||
self.toggle_button_panels.bottom = self
|
||||
.bottom_dock
|
||||
.as_ref()
|
||||
.and_then(|dock| dock.read(cx).panel.left_top_tab_panel(cx))
|
||||
.map(|view| view.entity_id());
|
||||
}
|
||||
|
||||
pub fn focus_tab_panel(&mut self, window: &mut Window, cx: &mut App) {
|
||||
self.items.focus_tab_panel(window, cx);
|
||||
}
|
||||
}
|
||||
|
||||
impl EventEmitter<DockEvent> for DockArea {}
|
||||
|
||||
impl Render for DockArea {
|
||||
fn render(&mut self, window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
|
||||
let view = cx.entity().clone();
|
||||
let decorations = window.window_decorations();
|
||||
|
||||
div()
|
||||
.id("dock-area")
|
||||
.relative()
|
||||
.size_full()
|
||||
.overflow_hidden()
|
||||
.on_prepaint(move |bounds, _, cx| view.update(cx, |r, _| r.bounds = bounds))
|
||||
.map(|this| {
|
||||
if let Some(zoom_view) = self.zoom_view.clone() {
|
||||
this.map(|this| match decorations {
|
||||
Decorations::Server => this,
|
||||
Decorations::Client { tiling } => this
|
||||
.when(!(tiling.top || tiling.right), |div| {
|
||||
div.rounded_br(CLIENT_SIDE_DECORATION_ROUNDING)
|
||||
})
|
||||
.when(!(tiling.top || tiling.left), |div| {
|
||||
div.rounded_bl(CLIENT_SIDE_DECORATION_ROUNDING)
|
||||
}),
|
||||
})
|
||||
.child(zoom_view)
|
||||
} else {
|
||||
// render dock
|
||||
this.child(
|
||||
div()
|
||||
.flex()
|
||||
.flex_row()
|
||||
.h_full()
|
||||
// Left dock
|
||||
.when_some(self.left_dock.clone(), |this, dock| {
|
||||
this.child(div().flex().flex_none().child(dock))
|
||||
})
|
||||
// Center
|
||||
.child(
|
||||
div()
|
||||
.flex()
|
||||
.flex_1()
|
||||
.flex_col()
|
||||
.overflow_hidden()
|
||||
// Top center
|
||||
.child(
|
||||
div()
|
||||
.flex_1()
|
||||
.overflow_hidden()
|
||||
.child(self.render_items(window, cx)),
|
||||
)
|
||||
// Bottom Dock
|
||||
.when_some(self.bottom_dock.clone(), |this, dock| {
|
||||
this.child(dock)
|
||||
}),
|
||||
)
|
||||
// Right Dock
|
||||
.when_some(self.right_dock.clone(), |this, dock| {
|
||||
this.child(div().flex().flex_none().child(dock))
|
||||
}),
|
||||
)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
158
crates/ui/src/dock/panel.rs
Normal file
158
crates/ui/src/dock/panel.rs
Normal file
@@ -0,0 +1,158 @@
|
||||
use gpui::{
|
||||
AnyElement, AnyView, App, Element, Entity, EventEmitter, FocusHandle, Focusable, Render,
|
||||
SharedString, Window,
|
||||
};
|
||||
|
||||
use crate::button::Button;
|
||||
use crate::menu::PopupMenu;
|
||||
|
||||
#[derive(Debug, Clone, Copy, PartialEq, Eq)]
|
||||
pub enum PanelEvent {
|
||||
ZoomIn,
|
||||
ZoomOut,
|
||||
LayoutChanged,
|
||||
}
|
||||
|
||||
#[derive(Debug, Clone, Copy, PartialEq, Eq)]
|
||||
pub enum PanelStyle {
|
||||
/// Display the TabBar when there are multiple tabs, otherwise display the simple title.
|
||||
Default,
|
||||
/// Always display the tab bar.
|
||||
TabBar,
|
||||
}
|
||||
|
||||
pub trait Panel: EventEmitter<PanelEvent> + Render + Focusable {
|
||||
/// The name of the panel used to serialize, deserialize and identify the panel.
|
||||
///
|
||||
/// This is used to identify the panel when deserializing the panel.
|
||||
/// Once you have defined a panel id, this must not be changed.
|
||||
fn panel_id(&self) -> SharedString;
|
||||
|
||||
/// The title of the panel
|
||||
fn title(&self, _cx: &App) -> AnyElement {
|
||||
SharedString::from("Unnamed").into_any()
|
||||
}
|
||||
|
||||
/// Whether the panel can be closed, default is `true`.
|
||||
fn closable(&self, _cx: &App) -> bool {
|
||||
true
|
||||
}
|
||||
|
||||
/// Return true if the panel is zoomable, default is `false`.
|
||||
fn zoomable(&self, _cx: &App) -> bool {
|
||||
true
|
||||
}
|
||||
|
||||
/// Return false to hide panel, true to show panel, default is `true`.
|
||||
///
|
||||
/// This method called in Panel render, we should make sure it is fast.
|
||||
fn visible(&self, _cx: &App) -> bool {
|
||||
true
|
||||
}
|
||||
|
||||
/// Set active state of the panel.
|
||||
///
|
||||
/// This method will be called when the panel is active or inactive.
|
||||
///
|
||||
/// The last_active_panel and current_active_panel will be touched when the panel is active.
|
||||
fn set_active(&self, _active: bool, _cx: &mut App) {}
|
||||
|
||||
/// Set zoomed state of the panel.
|
||||
///
|
||||
/// This method will be called when the panel is zoomed or unzoomed.
|
||||
///
|
||||
/// Only current Panel will touch this method.
|
||||
fn set_zoomed(&self, _zoomed: bool, _cx: &mut App) {}
|
||||
|
||||
/// The addition popup menu of the panel, default is `None`.
|
||||
fn popup_menu(&self, this: PopupMenu, _cx: &App) -> PopupMenu {
|
||||
this
|
||||
}
|
||||
|
||||
/// The addition toolbar buttons of the panel used to show in the right of the title bar, default is `None`.
|
||||
fn toolbar_buttons(&self, _window: &Window, _cx: &App) -> Vec<Button> {
|
||||
vec![]
|
||||
}
|
||||
}
|
||||
|
||||
pub trait PanelView: 'static + Send + Sync {
|
||||
fn panel_id(&self, cx: &App) -> SharedString;
|
||||
fn title(&self, cx: &App) -> AnyElement;
|
||||
fn closable(&self, cx: &App) -> bool;
|
||||
fn zoomable(&self, cx: &App) -> bool;
|
||||
fn visible(&self, cx: &App) -> bool;
|
||||
fn set_active(&self, active: bool, cx: &mut App);
|
||||
fn set_zoomed(&self, zoomed: bool, cx: &mut App);
|
||||
fn popup_menu(&self, menu: PopupMenu, cx: &App) -> PopupMenu;
|
||||
fn toolbar_buttons(&self, window: &Window, cx: &App) -> Vec<Button>;
|
||||
fn view(&self) -> AnyView;
|
||||
fn focus_handle(&self, cx: &App) -> FocusHandle;
|
||||
}
|
||||
|
||||
impl<T: Panel> PanelView for Entity<T> {
|
||||
fn panel_id(&self, cx: &App) -> SharedString {
|
||||
self.read(cx).panel_id()
|
||||
}
|
||||
|
||||
fn title(&self, cx: &App) -> AnyElement {
|
||||
self.read(cx).title(cx)
|
||||
}
|
||||
|
||||
fn closable(&self, cx: &App) -> bool {
|
||||
self.read(cx).closable(cx)
|
||||
}
|
||||
|
||||
fn zoomable(&self, cx: &App) -> bool {
|
||||
self.read(cx).zoomable(cx)
|
||||
}
|
||||
|
||||
fn visible(&self, cx: &App) -> bool {
|
||||
self.read(cx).visible(cx)
|
||||
}
|
||||
|
||||
fn set_active(&self, active: bool, cx: &mut App) {
|
||||
self.update(cx, |this, cx| {
|
||||
this.set_active(active, cx);
|
||||
})
|
||||
}
|
||||
|
||||
fn set_zoomed(&self, zoomed: bool, cx: &mut App) {
|
||||
self.update(cx, |this, cx| {
|
||||
this.set_zoomed(zoomed, cx);
|
||||
})
|
||||
}
|
||||
|
||||
fn popup_menu(&self, menu: PopupMenu, cx: &App) -> PopupMenu {
|
||||
self.read(cx).popup_menu(menu, cx)
|
||||
}
|
||||
|
||||
fn toolbar_buttons(&self, window: &Window, cx: &App) -> Vec<Button> {
|
||||
self.read(cx).toolbar_buttons(window, cx)
|
||||
}
|
||||
|
||||
fn view(&self) -> AnyView {
|
||||
self.clone().into()
|
||||
}
|
||||
|
||||
fn focus_handle(&self, cx: &App) -> FocusHandle {
|
||||
self.read(cx).focus_handle(cx)
|
||||
}
|
||||
}
|
||||
|
||||
impl From<&dyn PanelView> for AnyView {
|
||||
fn from(handle: &dyn PanelView) -> Self {
|
||||
handle.view()
|
||||
}
|
||||
}
|
||||
|
||||
impl<T: Panel> From<&dyn PanelView> for Entity<T> {
|
||||
fn from(value: &dyn PanelView) -> Self {
|
||||
value.view().downcast::<T>().unwrap()
|
||||
}
|
||||
}
|
||||
|
||||
impl PartialEq for dyn PanelView {
|
||||
fn eq(&self, other: &Self) -> bool {
|
||||
self.view() == other.view()
|
||||
}
|
||||
}
|
||||
396
crates/ui/src/dock/stack_panel.rs
Normal file
396
crates/ui/src/dock/stack_panel.rs
Normal file
@@ -0,0 +1,396 @@
|
||||
use std::sync::Arc;
|
||||
|
||||
use gpui::prelude::FluentBuilder;
|
||||
use gpui::{
|
||||
App, AppContext, Axis, Context, DismissEvent, Entity, EventEmitter, FocusHandle, Focusable,
|
||||
IntoElement, ParentElement, Pixels, Render, SharedString, Styled, Subscription, WeakEntity,
|
||||
Window,
|
||||
};
|
||||
use smallvec::SmallVec;
|
||||
use theme::{ActiveTheme, AxisExt as _, CLIENT_SIDE_DECORATION_ROUNDING, Placement};
|
||||
|
||||
use super::{DockArea, PanelEvent};
|
||||
use crate::dock::panel::{Panel, PanelView};
|
||||
use crate::dock::tab_panel::TabPanel;
|
||||
use crate::h_flex;
|
||||
use crate::resizable::{
|
||||
PANEL_MIN_SIZE, ResizablePanelEvent, ResizablePanelGroup, ResizablePanelState, ResizableState,
|
||||
resizable_panel,
|
||||
};
|
||||
|
||||
pub struct StackPanel {
|
||||
pub(super) parent: Option<WeakEntity<StackPanel>>,
|
||||
pub(super) axis: Axis,
|
||||
focus_handle: FocusHandle,
|
||||
pub(crate) panels: SmallVec<[Arc<dyn PanelView>; 2]>,
|
||||
state: Entity<ResizableState>,
|
||||
_subscriptions: Vec<Subscription>,
|
||||
}
|
||||
|
||||
impl Panel for StackPanel {
|
||||
fn panel_id(&self) -> SharedString {
|
||||
"StackPanel".into()
|
||||
}
|
||||
|
||||
fn title(&self, _cx: &App) -> gpui::AnyElement {
|
||||
"StackPanel".into_any_element()
|
||||
}
|
||||
}
|
||||
|
||||
impl StackPanel {
|
||||
pub fn new(axis: Axis, window: &mut Window, cx: &mut Context<Self>) -> Self {
|
||||
let state = cx.new(|_| ResizableState::default());
|
||||
|
||||
// Bubble up the resize event.
|
||||
let subscriptions =
|
||||
vec![
|
||||
cx.subscribe_in(&state, window, |_, _, _: &ResizablePanelEvent, _, cx| {
|
||||
cx.emit(PanelEvent::LayoutChanged)
|
||||
}),
|
||||
];
|
||||
|
||||
Self {
|
||||
axis,
|
||||
parent: None,
|
||||
focus_handle: cx.focus_handle(),
|
||||
panels: SmallVec::new(),
|
||||
state,
|
||||
_subscriptions: subscriptions,
|
||||
}
|
||||
}
|
||||
|
||||
/// The first level of the stack panel is root, will not have a parent.
|
||||
fn is_root(&self) -> bool {
|
||||
self.parent.is_none()
|
||||
}
|
||||
|
||||
/// Return true if self or parent only have last panel.
|
||||
pub fn is_last_panel(&self, cx: &App) -> bool {
|
||||
if self.panels.len() > 1 {
|
||||
return false;
|
||||
}
|
||||
|
||||
if let Some(parent) = &self.parent {
|
||||
if let Some(parent) = parent.upgrade() {
|
||||
return parent.read(cx).is_last_panel(cx);
|
||||
}
|
||||
}
|
||||
|
||||
true
|
||||
}
|
||||
|
||||
pub fn panels_len(&self) -> usize {
|
||||
self.panels.len()
|
||||
}
|
||||
|
||||
/// Return the index of the panel.
|
||||
pub fn index_of_panel(&self, panel: Arc<dyn PanelView>) -> Option<usize> {
|
||||
self.panels.iter().position(|p| p == &panel)
|
||||
}
|
||||
|
||||
/// Add a panel at the end of the stack.
|
||||
pub fn add_panel(
|
||||
&mut self,
|
||||
panel: Arc<dyn PanelView>,
|
||||
size: Option<Pixels>,
|
||||
dock_area: WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
self.insert_panel(panel, self.panels.len(), size, dock_area, window, cx);
|
||||
}
|
||||
|
||||
pub fn add_panel_at(
|
||||
&mut self,
|
||||
panel: Arc<dyn PanelView>,
|
||||
placement: Placement,
|
||||
size: Option<Pixels>,
|
||||
dock_area: WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
self.insert_panel_at(
|
||||
panel,
|
||||
self.panels_len(),
|
||||
placement,
|
||||
size,
|
||||
dock_area,
|
||||
window,
|
||||
cx,
|
||||
);
|
||||
}
|
||||
|
||||
#[allow(clippy::too_many_arguments)]
|
||||
pub fn insert_panel_at(
|
||||
&mut self,
|
||||
panel: Arc<dyn PanelView>,
|
||||
ix: usize,
|
||||
placement: Placement,
|
||||
size: Option<Pixels>,
|
||||
dock_area: WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
match placement {
|
||||
Placement::Top | Placement::Left => {
|
||||
self.insert_panel_before(panel, ix, size, dock_area, window, cx)
|
||||
}
|
||||
Placement::Right | Placement::Bottom => {
|
||||
self.insert_panel_after(panel, ix, size, dock_area, window, cx)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/// Insert a panel at the index.
|
||||
pub fn insert_panel_before(
|
||||
&mut self,
|
||||
panel: Arc<dyn PanelView>,
|
||||
ix: usize,
|
||||
size: Option<Pixels>,
|
||||
dock_area: WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
self.insert_panel(panel, ix, size, dock_area, window, cx);
|
||||
}
|
||||
|
||||
/// Insert a panel after the index.
|
||||
pub fn insert_panel_after(
|
||||
&mut self,
|
||||
panel: Arc<dyn PanelView>,
|
||||
ix: usize,
|
||||
size: Option<Pixels>,
|
||||
dock_area: WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
self.insert_panel(panel, ix + 1, size, dock_area, window, cx);
|
||||
}
|
||||
|
||||
fn insert_panel(
|
||||
&mut self,
|
||||
panel: Arc<dyn PanelView>,
|
||||
ix: usize,
|
||||
size: Option<Pixels>,
|
||||
dock_area: WeakEntity<DockArea>,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
// If the panel is already in the stack, return.
|
||||
if self.index_of_panel(panel.clone()).is_some() {
|
||||
return;
|
||||
}
|
||||
|
||||
let view = cx.entity().clone();
|
||||
|
||||
window.defer(cx, {
|
||||
let panel = panel.clone();
|
||||
|
||||
move |window, cx| {
|
||||
// If the panel is a TabPanel, set its parent to this.
|
||||
if let Ok(tab_panel) = panel.view().downcast::<TabPanel>() {
|
||||
tab_panel.update(cx, |tab_panel, _| tab_panel.set_parent(view.downgrade()));
|
||||
} else if let Ok(stack_panel) = panel.view().downcast::<Self>() {
|
||||
stack_panel.update(cx, |stack_panel, _| {
|
||||
stack_panel.parent = Some(view.downgrade())
|
||||
});
|
||||
}
|
||||
|
||||
// Subscribe to the panel's layout change event.
|
||||
_ = dock_area.update(cx, |this, cx| {
|
||||
if let Ok(tab_panel) = panel.view().downcast::<TabPanel>() {
|
||||
this.subscribe_panel(&tab_panel, window, cx);
|
||||
} else if let Ok(stack_panel) = panel.view().downcast::<Self>() {
|
||||
this.subscribe_panel(&stack_panel, window, cx);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
let ix = if ix > self.panels.len() {
|
||||
self.panels.len()
|
||||
} else {
|
||||
ix
|
||||
};
|
||||
|
||||
// Get avg size of all panels to insert new panel, if size is None.
|
||||
let size = match size {
|
||||
Some(size) => size,
|
||||
None => {
|
||||
let state = self.state.read(cx);
|
||||
(state.container_size() / (state.sizes().len() + 1) as f32).max(PANEL_MIN_SIZE)
|
||||
}
|
||||
};
|
||||
|
||||
// Insert panel
|
||||
self.panels.insert(ix, panel.clone());
|
||||
|
||||
// Update resizable state
|
||||
self.state.update(cx, |state, cx| {
|
||||
state.insert_panel(Some(size), Some(ix), cx);
|
||||
});
|
||||
|
||||
cx.emit(PanelEvent::LayoutChanged);
|
||||
cx.notify();
|
||||
}
|
||||
|
||||
/// Remove panel from the stack.
|
||||
///
|
||||
/// If `ix` is not found, do nothing.
|
||||
pub fn remove_panel(
|
||||
&mut self,
|
||||
panel: Arc<dyn PanelView>,
|
||||
window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
let Some(ix) = self.index_of_panel(panel.clone()) else {
|
||||
return;
|
||||
};
|
||||
|
||||
self.panels.remove(ix);
|
||||
self.state.update(cx, |state, cx| {
|
||||
state.remove_panel(ix, cx);
|
||||
});
|
||||
|
||||
cx.emit(PanelEvent::LayoutChanged);
|
||||
|
||||
self.remove_self_if_empty(window, cx);
|
||||
}
|
||||
|
||||
/// Replace the old panel with the new panel at same index.
|
||||
pub fn replace_panel(
|
||||
&mut self,
|
||||
old_panel: Arc<dyn PanelView>,
|
||||
new_panel: Entity<StackPanel>,
|
||||
_window: &mut Window,
|
||||
cx: &mut Context<Self>,
|
||||
) {
|
||||
if let Some(ix) = self.index_of_panel(old_panel.clone()) {
|
||||
self.panels[ix] = Arc::new(new_panel.clone());
|
||||
self.state.update(cx, |state, cx| {
|
||||
state.replace_panel(ix, ResizablePanelState::default(), cx);
|
||||
});
|
||||
cx.emit(PanelEvent::LayoutChanged);
|
||||
}
|
||||
}
|
||||
|
||||
/// If children is empty, remove self from parent view.
|
||||
pub fn remove_self_if_empty(&mut self, window: &mut Window, cx: &mut Context<Self>) {
|
||||
if self.is_root() {
|
||||
return;
|
||||
}
|
||||
|
||||
if !self.panels.is_empty() {
|
||||
return;
|
||||
}
|
||||
|
||||
let view = cx.entity().clone();
|
||||
if let Some(parent) = self.parent.as_ref() {
|
||||
_ = parent.update(cx, |parent, cx| {
|
||||
parent.remove_panel(Arc::new(view.clone()), window, cx);
|
||||
});
|
||||
}
|
||||
|
||||
cx.emit(PanelEvent::LayoutChanged);
|
||||
cx.notify();
|
||||
}
|
||||
|
||||
/// Find the first top left in the stack.
|
||||
pub fn left_top_tab_panel(&self, check_parent: bool, cx: &App) -> Option<Entity<TabPanel>> {
|
||||
if check_parent {
|
||||
if let Some(parent) = self.parent.as_ref().and_then(|parent| parent.upgrade()) {
|
||||
if let Some(panel) = parent.read(cx).left_top_tab_panel(true, cx) {
|
||||
return Some(panel);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
let first_panel = self.panels.first();
|
||||
if let Some(view) = first_panel {
|
||||
if let Ok(tab_panel) = view.view().downcast::<TabPanel>() {
|
||||
Some(tab_panel)
|
||||
} else if let Ok(stack_panel) = view.view().downcast::<StackPanel>() {
|
||||
stack_panel.read(cx).left_top_tab_panel(false, cx)
|
||||
} else {
|
||||
None
|
||||
}
|
||||
} else {
|
||||
None
|
||||
}
|
||||
}
|
||||
|
||||
/// Find the first top right in the stack.
|
||||
pub fn right_top_tab_panel(&self, check_parent: bool, cx: &App) -> Option<Entity<TabPanel>> {
|
||||
if check_parent {
|
||||
if let Some(parent) = self.parent.as_ref().and_then(|parent| parent.upgrade()) {
|
||||
if let Some(panel) = parent.read(cx).right_top_tab_panel(true, cx) {
|
||||
return Some(panel);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
let panel = if self.axis.is_vertical() {
|
||||
self.panels.first()
|
||||
} else {
|
||||
self.panels.last()
|
||||
};
|
||||
|
||||
if let Some(view) = panel {
|
||||
if let Ok(tab_panel) = view.view().downcast::<TabPanel>() {
|
||||
Some(tab_panel)
|
||||
} else if let Ok(stack_panel) = view.view().downcast::<StackPanel>() {
|
||||
stack_panel.read(cx).right_top_tab_panel(false, cx)
|
||||
} else {
|
||||
None
|
||||
}
|
||||
} else {
|
||||
None
|
||||
}
|
||||
}
|
||||
|
||||
/// Remove all panels from the stack.
|
||||
pub fn remove_all_panels(&mut self, _: &mut Window, cx: &mut Context<Self>) {
|
||||
self.panels.clear();
|
||||
self.state.update(cx, |state, cx| {
|
||||
state.clear();
|
||||
cx.notify();
|
||||
});
|
||||
}
|
||||
|
||||
/// Change the axis of the stack panel.
|
||||
pub fn set_axis(&mut self, axis: Axis, _: &mut Window, cx: &mut Context<Self>) {
|
||||
self.axis = axis;
|
||||
cx.notify();
|
||||
}
|
||||
}
|
||||
|
||||
impl Focusable for StackPanel {
|
||||
fn focus_handle(&self, _cx: &App) -> FocusHandle {
|
||||
self.focus_handle.clone()
|
||||
}
|
||||
}
|
||||
|
||||
impl EventEmitter<PanelEvent> for StackPanel {}
|
||||
impl EventEmitter<DismissEvent> for StackPanel {}
|
||||
|
||||
impl Render for StackPanel {
|
||||
fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
|
||||
h_flex()
|
||||
.size_full()
|
||||
.overflow_hidden()
|
||||
.bg(cx.theme().panel_background)
|
||||
.when(cx.theme().platform.is_linux(), |this| {
|
||||
this.rounded_br(CLIENT_SIDE_DECORATION_ROUNDING)
|
||||
})
|
||||
.child(
|
||||
ResizablePanelGroup::new("stack-panel-group")
|
||||
.with_state(&self.state)
|
||||
.axis(self.axis)
|
||||
.children(self.panels.clone().into_iter().map(|panel| {
|
||||
resizable_panel()
|
||||
.child(panel.view())
|
||||
.visible(panel.visible(cx))
|
||||
})),
|
||||
)
|
||||
}
|
||||
}
|
||||
1158
crates/ui/src/dock/tab_panel.rs
Normal file
1158
crates/ui/src/dock/tab_panel.rs
Normal file
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user