dan/gpui-component
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

table: Add horizontal scrollbar to Table. (#278)

Browse source
This commit is contained in:
Jason Lee 2024-09-27 13:48:46 +08:00 committed by GitHub
parent 708e373ab6
commit 76be7a8ed8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 55 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

52
crates/ui/src/table.rs
View file

@ -4,7 +4,7 @@ use crate::{
h_flex, h_flex,
scroll::{ScrollableAxis, ScrollableMask, Scrollbar, ScrollbarState}, scroll::{ScrollableAxis, ScrollableMask, Scrollbar, ScrollbarState},
theme::ActiveTheme, theme::ActiveTheme,
v_flex, Icon, IconName, v_flex, Icon, IconName, StyledExt,
}; };
use gpui::{ use gpui::{
actions, canvas, div, prelude::FluentBuilder, px, uniform_list, AppContext, Bounds, Div, actions, canvas, div, prelude::FluentBuilder, px, uniform_list, AppContext, Bounds, Div,
@ -96,13 +96,17 @@ pub enum TableEvent {
pub struct Table<D: TableDelegate> { pub struct Table<D: TableDelegate> {
focus_handle: FocusHandle, focus_handle: FocusHandle,
delegate: D, delegate: D,
/// The bounds of the table. /// The bounds of the table container.
bounds: Bounds<Pixels>, bounds: Bounds<Pixels>,
horizontal_scroll_handle: ScrollHandle, /// The bounds of the table content.
vertical_scroll_handle: UniformListScrollHandle, head_content_bounds: Bounds<Pixels>,
col_groups: Vec<ColGroup>, col_groups: Vec<ColGroup>,
vertical_scroll_handle: UniformListScrollHandle,
scrollbar_state: Rc<Cell<ScrollbarState>>, scrollbar_state: Rc<Cell<ScrollbarState>>,
horizontal_scroll_handle: ScrollHandle,
horizontal_scrollbar_state: Rc<Cell<ScrollbarState>>,
selection_state: SelectionState, selection_state: SelectionState,
selected_row: Option<usize>, selected_row: Option<usize>,
@ -235,11 +239,13 @@ where
horizontal_scroll_handle: ScrollHandle::new(), horizontal_scroll_handle: ScrollHandle::new(),
vertical_scroll_handle: UniformListScrollHandle::new(), vertical_scroll_handle: UniformListScrollHandle::new(),
scrollbar_state: Rc::new(Cell::new(ScrollbarState::new())), scrollbar_state: Rc::new(Cell::new(ScrollbarState::new())),
horizontal_scrollbar_state: Rc::new(Cell::new(ScrollbarState::new())),
selection_state: SelectionState::Row, selection_state: SelectionState::Row,
selected_row: None, selected_row: None,
selected_col: None, selected_col: None,
resizing_col: None, resizing_col: None,
bounds: Bounds::default(), bounds: Bounds::default(),
head_content_bounds: Bounds::default(),
stripe: false, stripe: false,
border: true, border: true,
}; };
@ -423,6 +429,24 @@ where
) )
} }
fn render_horizontal_scrollbar(&self, cx: &mut ViewContext<Self>) -> impl IntoElement {
let state = self.horizontal_scrollbar_state.clone();
div()
.absolute()
.top_0()
.left_0()
.right_0()
.bottom_0()
.size_full()
.child(Scrollbar::horizontal(
cx.view().entity_id(),
state,
self.horizontal_scroll_handle.clone(),
self.head_content_bounds.size,
))
}
fn render_resize_handle(&self, ix: usize, cx: &mut ViewContext<Self>) -> impl IntoElement { fn render_resize_handle(&self, ix: usize, cx: &mut ViewContext<Self>) -> impl IntoElement {
const HANDLE_SIZE: Pixels = px(2.); const HANDLE_SIZE: Pixels = px(2.);
@ -794,7 +818,9 @@ where
.child( .child(
uniform_list(view.clone(), "table-uniform-list-head", 1, { uniform_list(view.clone(), "table-uniform-list-head", 1, {
let horizontal_scroll_handle = horizontal_scroll_handle.clone(); let horizontal_scroll_handle = horizontal_scroll_handle.clone();
let view = view.clone();
move |table, _, cx| { move |table, _, cx| {
let view = view.clone();
// Columns // Columns
tr(cx) tr(cx)
.id("table-head") .id("table-head")
@ -803,6 +829,10 @@ where
.overflow_scroll() .overflow_scroll()
.track_scroll(&horizontal_scroll_handle) .track_scroll(&horizontal_scroll_handle)
.bg(cx.theme().table_head) .bg(cx.theme().table_head)
.child(
div()
.h_flex()
.relative()
.children( .children(
table table
.col_groups .col_groups
@ -811,6 +841,19 @@ where
.map(|(col_ix, _)| table.render_th(col_ix, cx)), .map(|(col_ix, _)| table.render_th(col_ix, cx)),
) )
.child(last_empty_col(cx)) .child(last_empty_col(cx))
.child(
canvas(
move |bounds, cx| {
view.update(cx, |r, _| {
r.head_content_bounds = bounds
})
},
|_, _, _| {},
)
.absolute()
.size_full(),
),
)
.map(|this| vec![this]) .map(|this| vec![this])
} }
}) })
@ -972,6 +1015,7 @@ where
move |bounds, cx| view.update(cx, |r, _| r.bounds = bounds), move |bounds, cx| view.update(cx, |r, _| r.bounds = bounds),
|_, _, _| {}, |_, _, _| {},
)) ))
.child(self.render_horizontal_scrollbar(cx))
.when(rows_count > 0, |this| { .when(rows_count > 0, |this| {
this.children(self.render_scrollbar(cx)) this.children(self.render_scrollbar(cx))
}) })