Fix ListItem check icon.

This commit is contained in:
Jason Lee 2024-06-27 23:12:52 +08:00
parent cb8067d89b
commit daf4e713d1
4 changed files with 33 additions and 22 deletions

View file

@ -10,6 +10,7 @@ use crate::{
selectable::{Selectable, Selection},
stock::{h_flex, v_flex},
theme::{ActiveTheme, Colorize as _},
IconName,
};
type OnClick = Box<dyn Fn(&Selection, &mut WindowContext) + 'static>;
@ -114,8 +115,8 @@ impl RenderOnce for Checkbox {
.size_3()
.text_color(icon_color)
.map(|this| match self.checked {
Selection::Selected => this.path("icons/check.svg"),
Selection::Indeterminate => this.path("icons/minus.svg"),
Selection::Selected => this.path(IconName::Check.path()),
Selection::Indeterminate => this.path(IconName::Minus.path()),
_ => this,
}),
),

View file

@ -184,10 +184,11 @@ where
}))
.child(
h_flex()
.w_full()
.items_center()
.justify_between()
.child(title)
.child(IconName::ChevronDown),
.child(div().flex_1().child(title))
.child(div().w_4().h_4().child(IconName::ChevronDown)),
),
)
.when(self.open, |this| {

View file

@ -1,4 +1,6 @@
use gpui::{svg, IntoElement, RenderOnce, SharedString, Styled as _, Svg, WindowContext};
use gpui::{svg, IntoElement, RenderOnce, SharedString, Styled, Svg, WindowContext};
use crate::theme::ActiveTheme;
#[derive(IntoElement)]
pub enum IconName {
@ -38,10 +40,16 @@ pub struct Icon {
path: SharedString,
}
impl Styled for Icon {
fn style(&mut self) -> &mut gpui::StyleRefinement {
self.base.style()
}
}
impl Icon {
pub fn new(name: IconName) -> Self {
Self {
base: svg().flex_none().size_full(),
base: svg().flex_none().size_4(),
path: name.path(),
}
}
@ -56,7 +64,7 @@ impl Icon {
}
impl RenderOnce for Icon {
fn render(self, _cx: &mut WindowContext) -> impl IntoElement {
self.base.path(self.path)
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
self.base.text_color(cx.theme().foreground).path(self.path)
}
}

View file

@ -1,6 +1,6 @@
use gpui::{
div, prelude::FluentBuilder as _, ClickEvent, Div, ElementId, InteractiveElement, IntoElement,
MouseButton, MouseDownEvent, ParentElement, RenderOnce, SharedString, Stateful,
div, prelude::FluentBuilder as _, AnyElement, ClickEvent, Div, ElementId, InteractiveElement,
IntoElement, MouseButton, MouseDownEvent, ParentElement, RenderOnce, SharedString, Stateful,
StatefulInteractiveElement as _, Style, Styled, WindowContext,
};
@ -11,7 +11,7 @@ pub struct ListItem {
base: Stateful<Div>,
disabled: bool,
selected: bool,
check_icon: Option<IconName>,
check_icon: Option<Icon>,
on_click: Option<Box<dyn Fn(&ClickEvent, &mut WindowContext) + 'static>>,
on_secondary_mouse_down: Option<Box<dyn Fn(&MouseDownEvent, &mut WindowContext) + 'static>>,
}
@ -29,7 +29,7 @@ impl ListItem {
}
pub fn check_icon(mut self, icon: IconName) -> Self {
self.check_icon = Some(icon);
self.check_icon = Some(Icon::new(icon));
self
}
@ -87,9 +87,7 @@ impl RenderOnce for ListItem {
fn render(self, cx: &mut WindowContext) -> impl IntoElement {
h_flex()
.id("item-group")
.items_center()
.gap_2()
.w_full()
.flex_none()
.relative()
.gap_x_2()
.text_base()
@ -105,12 +103,15 @@ impl RenderOnce for ListItem {
this.hover(|this| this.bg(cx.theme().accent))
})
.when(self.selected, |this| this.bg(cx.theme().accent))
.child(self.base.when(self.selected, |this| {
if let Some(icon) = self.check_icon {
this.child(icon)
} else {
this
}
}))
.child(self.base.w_full().items_center().justify_between().when(
self.selected,
|this| {
if let Some(icon) = self.check_icon {
this.child(icon.text_color(cx.theme().muted))
} else {
this
}
},
))
}
}