table: Add render_header method to support custom table header. (#1746)

Closes #1733

## Example

```rs
impl TableDelegate for MyTable {
    fn render_header(&mut self, _: &mut Window, _: &mut Context<TableState<Self>>) -> Stateful<Div> {
        div().id("header").h_10()
    }
}
```
This commit is contained in:
Jason Lee 2025-12-05 15:17:13 +08:00 committed by GitHub
parent 8fcf5f337d
commit 56fb93bca8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 20 additions and 4 deletions

View file

@ -35,6 +35,15 @@ pub trait TableDelegate: Sized + 'static {
) { ) {
} }
/// Render the table head row.
fn render_header(
&mut self,
window: &mut Window,
cx: &mut Context<TableState<Self>>,
) -> Stateful<Div> {
div().id("header")
}
/// Render the header cell at the given column index, default to the column name. /// Render the header cell at the given column index, default to the column name.
fn render_th( fn render_th(
&mut self, &mut self,
@ -48,13 +57,15 @@ pub trait TableDelegate: Sized + 'static {
} }
/// Render the row at the given row and column. /// Render the row at the given row and column.
///
/// Not include the table head row.
fn render_tr( fn render_tr(
&mut self, &mut self,
row_ix: usize, row_ix: usize,
window: &mut Window, window: &mut Window,
cx: &mut Context<TableState<Self>>, cx: &mut Context<TableState<Self>>,
) -> Stateful<Div> { ) -> Stateful<Div> {
h_flex().id(("row", row_ix)) div().id(("row", row_ix))
} }
/// Render the context menu for the row at the given row index. /// Render the context menu for the row at the given row index.

View file

@ -865,7 +865,7 @@ where
}) })
} }
fn render_table_head( fn render_table_header(
&mut self, &mut self,
left_columns_count: usize, left_columns_count: usize,
window: &mut Window, window: &mut Window,
@ -879,13 +879,18 @@ where
self.fixed_head_cols_bounds = Bounds::default(); self.fixed_head_cols_bounds = Bounds::default();
} }
h_flex() let mut header = self.delegate_mut().render_header(window, cx);
let style = header.style().clone();
header
.h_flex()
.w_full() .w_full()
.h(self.options.size.table_row_height()) .h(self.options.size.table_row_height())
.flex_shrink_0() .flex_shrink_0()
.border_b_1() .border_b_1()
.border_color(cx.theme().border) .border_color(cx.theme().border)
.text_color(cx.theme().table_head_foreground) .text_color(cx.theme().table_head_foreground)
.refine_style(&style)
.when(left_columns_count > 0, |this| { .when(left_columns_count > 0, |this| {
let view = view.clone(); let view = view.clone();
// Render left fixed columns // Render left fixed columns
@ -1298,7 +1303,7 @@ where
.id("table-inner") .id("table-inner")
.size_full() .size_full()
.overflow_hidden() .overflow_hidden()
.child(self.render_table_head(left_columns_count, window, cx)) .child(self.render_table_header(left_columns_count, window, cx))
.context_menu({ .context_menu({
let view = cx.entity().clone(); let view = cx.entity().clone();
move |this, window: &mut Window, cx: &mut Context<PopupMenu>| { move |this, window: &mut Window, cx: &mut Context<PopupMenu>| {