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

table, list: Avoid use deferred to show selected row style. (#363)

Browse source 
<img width="956" alt="image"
src="https://github.com/user-attachments/assets/0f72b556-76bc-4808-bca8-c261411656d1">
This commit is contained in:
Jason Lee 2024-10-18 13:27:59 +08:00 committed by GitHub
parent 4bef681c9a
commit a4260c109f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 27 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
crates/ui/src/list/list.rs
View file

@ -8,13 +8,13 @@ use crate::{
theme::ActiveTheme,
v_flex, IconName, Size,
};
use gpui::px;
use gpui::{
actions, div, prelude::FluentBuilder, uniform_list, AnyElement, AppContext, Entity,
FocusHandle, FocusableView, InteractiveElement, IntoElement, KeyBinding, Length,
ListSizingBehavior, MouseButton, ParentElement, Render, SharedString, Styled, Task,
UniformListScrollHandle, View, ViewContext, VisualContext, WindowContext,
};
use gpui::{deferred, px};
use smol::Timer;
actions!(list, [Cancel, Confirm, SelectPrev, SelectNext]);
@ -315,30 +315,30 @@ where
.children(self.delegate.render_item(ix, cx))
.when_some(self.selected_index, |this, selected_index| {
this.when(ix == selected_index, |this| {
this.child(deferred(
this.child(
div()
.absolute()
.top(px(-1.))
.left(px(-1.))
.right(px(-1.))
.bottom(px(-1.))
.top(px(0.))
.left(px(0.))
.right(px(0.))
.bottom(px(0.))
.bg(cx.theme().list_active)
.border_1()
.border_color(cx.theme().list_active_border),
))
)
})
})
.when(self.right_clicked_index == Some(ix), |this| {
this.child(deferred(
this.child(
div()
.absolute()
.top(px(-1.))
.left(px(-1.))
.right(px(-1.))
.bottom(px(-1.))
.top(px(0.))
.left(px(0.))
.right(px(0.))
.bottom(px(0.))
.border_1()
.border_color(cx.theme().list_active_border),
))
)
})
.on_mouse_down(
MouseButton::Left,

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

@ -9,8 +9,8 @@ use crate::{
v_flex, Icon, IconName, Sizable, Size, StyleSized as _,
};
use gpui::{
actions, canvas, deferred, div, prelude::FluentBuilder, px, uniform_list, AppContext, Bounds,
Div, DragMoveEvent, Edges, Entity, EntityId, EventEmitter, FocusHandle, FocusableView,
actions, canvas, div, prelude::FluentBuilder, px, uniform_list, AppContext, Bounds, Div,
DragMoveEvent, Edges, Entity, EntityId, EventEmitter, FocusHandle, FocusableView,
InteractiveElement, IntoElement, KeyBinding, MouseButton, ParentElement, Pixels, Point, Render,
ScrollHandle, SharedString, Stateful, StatefulInteractiveElement as _, Styled,
UniformListScrollHandle, ViewContext, VisualContext as _, WindowContext,
@ -967,9 +967,11 @@ where
})
.w_full()
.h(self.size.table_row_height())
.when(row_ix > 0, |this| {
this.border_t_1().border_color(cx.theme().table_row_border)
.border_b_1()
.when(row_ix == rows_count, |this| {
this.border_color(gpui::transparent_white())
})
.border_color(cx.theme().table_row_border)
.when(is_stripe_row, |this| this.bg(cx.theme().table_even))
.hover(|this| {
if is_selected || self.right_clicked_row == Some(row_ix) {
@ -1018,32 +1020,32 @@ where
this.when(
is_selected && self.selection_state == SelectionState::Row,
|this| {
this.child(deferred(
this.child(
div()
.top(px(-1.))
.left(px(-1.))
.right(px(-1.))
.left(px(0.))
.right(px(0.))
.bottom_0()
.absolute()
.bg(cx.theme().table_active)
.border_1()
.border_color(cx.theme().table_active_border),
))
)
},
)
})
// Row right click row style
.when(self.right_clicked_row == Some(row_ix), |this| {
this.child(deferred(
this.child(
div()
.top(px(-1.))
.left(px(-1.))
.right(px(-1.))
.left(px(0.))
.right(px(0.))
.bottom_0()
.absolute()
.border_1()
.border_color(cx.theme().selection),
))
)
})
.on_mouse_down(
MouseButton::Left,