ui: Add Scrollbar component (#18927)

Closes #ISSUE

Release Notes:

- N/A
This commit is contained in:
Piotr Osiewicz 2024-10-16 13:57:28 +02:00 committed by GitHub
parent eddf70b5c4
commit 109ebc5f27
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 513 additions and 409 deletions

View file

@ -1,8 +1,8 @@
mod project_panel_settings;
mod scrollbar;
use client::{ErrorCode, ErrorExt};
use scrollbar::ProjectPanelScrollbar;
use settings::{Settings, SettingsStore};
use ui::{Scrollbar, ScrollbarState};
use db::kvp::KEY_VALUE_STORE;
use editor::{
@ -14,16 +14,14 @@ use file_icons::FileIcons;
use anyhow::{anyhow, Context as _, Result};
use collections::{hash_map, BTreeSet, HashMap};
use core::f32;
use git::repository::GitFileStatus;
use gpui::{
actions, anchored, deferred, div, impl_actions, px, uniform_list, Action, AnyElement,
AppContext, AssetSource, AsyncWindowContext, ClipboardItem, DismissEvent, Div, DragMoveEvent,
Entity, EventEmitter, ExternalPaths, FocusHandle, FocusableView, InteractiveElement,
KeyContext, ListHorizontalSizingBehavior, ListSizingBehavior, Model, MouseButton,
MouseDownEvent, ParentElement, Pixels, Point, PromptLevel, Render, Stateful, Styled,
Subscription, Task, UniformListScrollHandle, View, ViewContext, VisualContext as _, WeakView,
WindowContext,
EventEmitter, ExternalPaths, FocusHandle, FocusableView, InteractiveElement, KeyContext,
ListHorizontalSizingBehavior, ListSizingBehavior, Model, MouseButton, MouseDownEvent,
ParentElement, Pixels, Point, PromptLevel, Render, Stateful, Styled, Subscription, Task,
UniformListScrollHandle, View, ViewContext, VisualContext as _, WeakView, WindowContext,
};
use indexmap::IndexMap;
use menu::{Confirm, SelectFirst, SelectLast, SelectNext, SelectPrev};
@ -34,12 +32,11 @@ use project::{
use project_panel_settings::{ProjectPanelDockPosition, ProjectPanelSettings};
use serde::{Deserialize, Serialize};
use std::{
cell::{Cell, OnceCell},
cell::OnceCell,
collections::HashSet,
ffi::OsStr,
ops::Range,
path::{Path, PathBuf},
rc::Rc,
sync::Arc,
time::Duration,
};
@ -59,8 +56,8 @@ const NEW_ENTRY_ID: ProjectEntryId = ProjectEntryId::MAX;
pub struct ProjectPanel {
project: Model<Project>,
fs: Arc<dyn Fs>,
scroll_handle: UniformListScrollHandle,
focus_handle: FocusHandle,
scroll_handle: UniformListScrollHandle,
visible_entries: Vec<(WorktreeId, Vec<Entry>, OnceCell<HashSet<Arc<Path>>>)>,
/// Maps from leaf project entry ID to the currently selected ancestor.
/// Relevant only for auto-fold dirs, where a single project panel entry may actually consist of several
@ -82,8 +79,8 @@ pub struct ProjectPanel {
width: Option<Pixels>,
pending_serialization: Task<Option<()>>,
show_scrollbar: bool,
vertical_scrollbar_drag_thumb_offset: Rc<Cell<Option<f32>>>,
horizontal_scrollbar_drag_thumb_offset: Rc<Cell<Option<f32>>>,
vertical_scrollbar_state: ScrollbarState,
horizontal_scrollbar_state: ScrollbarState,
hide_scrollbar_task: Option<Task<()>>,
max_width_item_index: Option<usize>,
}
@ -297,10 +294,10 @@ impl ProjectPanel {
})
.detach();
let scroll_handle = UniformListScrollHandle::new();
let mut this = Self {
project: project.clone(),
fs: workspace.app_state().fs.clone(),
scroll_handle: UniformListScrollHandle::new(),
focus_handle,
visible_entries: Default::default(),
ancestors: Default::default(),
@ -320,9 +317,12 @@ impl ProjectPanel {
pending_serialization: Task::ready(None),
show_scrollbar: !Self::should_autohide_scrollbar(cx),
hide_scrollbar_task: None,
vertical_scrollbar_drag_thumb_offset: Default::default(),
horizontal_scrollbar_drag_thumb_offset: Default::default(),
vertical_scrollbar_state: ScrollbarState::new(scroll_handle.clone())
.parent_view(cx.view()),
horizontal_scrollbar_state: ScrollbarState::new(scroll_handle.clone())
.parent_view(cx.view()),
max_width_item_index: None,
scroll_handle,
};
this.update_visible_entries(None, cx);
@ -2606,37 +2606,11 @@ impl ProjectPanel {
}
fn render_vertical_scrollbar(&self, cx: &mut ViewContext<Self>) -> Option<Stateful<Div>> {
if !Self::should_show_scrollbar(cx) {
return None;
}
let scroll_handle = self.scroll_handle.0.borrow();
let total_list_length = scroll_handle
.last_item_size
.filter(|_| {
self.show_scrollbar || self.vertical_scrollbar_drag_thumb_offset.get().is_some()
})?
.contents
.height
.0 as f64;
let current_offset = scroll_handle.base_handle.offset().y.0.min(0.).abs() as f64;
let mut percentage = current_offset / total_list_length;
let end_offset = (current_offset + scroll_handle.base_handle.bounds().size.height.0 as f64)
/ total_list_length;
// Uniform scroll handle might briefly report an offset greater than the length of a list;
// in such case we'll adjust the starting offset as well to keep the scrollbar thumb length stable.
let overshoot = (end_offset - 1.).clamp(0., 1.);
if overshoot > 0. {
percentage -= overshoot;
}
const MINIMUM_SCROLLBAR_PERCENTAGE_HEIGHT: f64 = 0.005;
if percentage + MINIMUM_SCROLLBAR_PERCENTAGE_HEIGHT > 1.0 || end_offset > total_list_length
if !Self::should_show_scrollbar(cx)
|| !(self.show_scrollbar || self.vertical_scrollbar_state.is_dragging())
{
return None;
}
if total_list_length < scroll_handle.base_handle.bounds().size.height.0 as f64 {
return None;
}
let end_offset = end_offset.clamp(percentage + MINIMUM_SCROLLBAR_PERCENTAGE_HEIGHT, 1.);
Some(
div()
.occlude()
@ -2654,7 +2628,7 @@ impl ProjectPanel {
.on_mouse_up(
MouseButton::Left,
cx.listener(|this, _, cx| {
if this.vertical_scrollbar_drag_thumb_offset.get().is_none()
if !this.vertical_scrollbar_state.is_dragging()
&& !this.focus_handle.contains_focused(cx)
{
this.hide_scrollbar(cx);
@ -2674,48 +2648,20 @@ impl ProjectPanel {
.bottom_1()
.w(px(12.))
.cursor_default()
.child(ProjectPanelScrollbar::vertical(
percentage as f32..end_offset as f32,
self.scroll_handle.clone(),
self.vertical_scrollbar_drag_thumb_offset.clone(),
cx.view().entity_id(),
.children(Scrollbar::vertical(
// percentage as f32..end_offset as f32,
self.vertical_scrollbar_state.clone(),
)),
)
}
fn render_horizontal_scrollbar(&self, cx: &mut ViewContext<Self>) -> Option<Stateful<Div>> {
if !Self::should_show_scrollbar(cx) {
return None;
}
let scroll_handle = self.scroll_handle.0.borrow();
let longest_item_width = scroll_handle
.last_item_size
.filter(|_| {
self.show_scrollbar || self.horizontal_scrollbar_drag_thumb_offset.get().is_some()
})
.filter(|size| size.contents.width > size.item.width)?
.contents
.width
.0 as f64;
let current_offset = scroll_handle.base_handle.offset().x.0.min(0.).abs() as f64;
let mut percentage = current_offset / longest_item_width;
let end_offset = (current_offset + scroll_handle.base_handle.bounds().size.width.0 as f64)
/ longest_item_width;
// Uniform scroll handle might briefly report an offset greater than the length of a list;
// in such case we'll adjust the starting offset as well to keep the scrollbar thumb length stable.
let overshoot = (end_offset - 1.).clamp(0., 1.);
if overshoot > 0. {
percentage -= overshoot;
}
const MINIMUM_SCROLLBAR_PERCENTAGE_WIDTH: f64 = 0.005;
if percentage + MINIMUM_SCROLLBAR_PERCENTAGE_WIDTH > 1.0 || end_offset > longest_item_width
if !Self::should_show_scrollbar(cx)
|| !(self.show_scrollbar || self.horizontal_scrollbar_state.is_dragging())
{
return None;
}
if longest_item_width < scroll_handle.base_handle.bounds().size.width.0 as f64 {
return None;
}
let end_offset = end_offset.clamp(percentage + MINIMUM_SCROLLBAR_PERCENTAGE_WIDTH, 1.);
Some(
div()
.occlude()
@ -2733,7 +2679,7 @@ impl ProjectPanel {
.on_mouse_up(
MouseButton::Left,
cx.listener(|this, _, cx| {
if this.horizontal_scrollbar_drag_thumb_offset.get().is_none()
if !this.horizontal_scrollbar_state.is_dragging()
&& !this.focus_handle.contains_focused(cx)
{
this.hide_scrollbar(cx);
@ -2754,11 +2700,9 @@ impl ProjectPanel {
.h(px(12.))
.cursor_default()
.when(self.width.is_some(), |this| {
this.child(ProjectPanelScrollbar::horizontal(
percentage as f32..end_offset as f32,
self.scroll_handle.clone(),
self.horizontal_scrollbar_drag_thumb_offset.clone(),
cx.view().entity_id(),
this.children(Scrollbar::horizontal(
//percentage as f32..end_offset as f32,
self.horizontal_scrollbar_state.clone(),
))
}),
)