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

Fix vertical Divider

Browse source
This commit is contained in:
Jason Lee 2024-07-17 13:59:20 +08:00
parent 3467522714
commit ac3d6760ed
2 changed files with 25 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
crates/story/src/scrollable_story.rs
View file

@ -65,7 +65,7 @@ impl Render for ScrollableStory {
.gap_4() .gap_4()
.child( .child(
h_flex() h_flex()
.gap_1() .gap_2()
.child( .child(
Button::new("test-0", cx) Button::new("test-0", cx)
.label("Size 0") .label("Size 0")
@ -87,7 +87,7 @@ impl Render for ScrollableStory {
view.change_test_cases(2, cx); view.change_test_cases(2, cx);
})), })),
) )
.child(Divider::vertical()) .child(Divider::vertical().px_2())
.child( .child(
Button::new("test-axis-both", cx) Button::new("test-axis-both", cx)
.label("Both Scrollbar") .label("Both Scrollbar")
@ -105,7 +105,7 @@ impl Render for ScrollableStory {
})), })),
) )
.child( .child(
Button::new("test-axis-both", cx) Button::new("test-axis-horizontal", cx)
.label("Horizontal") .label("Horizontal")
.on_click(cx.listener(|view, _, cx| { .on_click(cx.listener(|view, _, cx| {
view.change_axis(ScrollbarAxis::Horizontal, cx) view.change_axis(ScrollbarAxis::Horizontal, cx)

29
crates/ui/src/divider.rs
View file

@ -1,5 +1,5 @@
use gpui::IntoElement; use gpui::{div, prelude::FluentBuilder as _, RenderOnce};
use gpui::{div, prelude::FluentBuilder as _, RenderOnce, Styled as _}; use gpui::{Div, IntoElement, ParentElement, Styled};
use crate::theme::ActiveTheme; use crate::theme::ActiveTheme;
use crate::StyledExt as _; use crate::StyledExt as _;
@ -11,33 +11,48 @@ enum Orientation {
#[derive(IntoElement)] #[derive(IntoElement)]
pub struct Divider { pub struct Divider {
base: Div,
orientation: Orientation, orientation: Orientation,
} }
impl Divider { impl Divider {
pub fn vertical() -> Self { pub fn vertical() -> Self {
Self { Self {
base: div(),
orientation: Orientation::Vertical, orientation: Orientation::Vertical,
} }
} }
pub fn horizontal() -> Self { pub fn horizontal() -> Self {
Self { Self {
base: div(),
orientation: Orientation::Horizontal, orientation: Orientation::Horizontal,
} }
} }
} }
impl Styled for Divider {
fn style(&mut self) -> &mut gpui::StyleRefinement {
self.base.style()
}
}
impl RenderOnce for Divider { impl RenderOnce for Divider {
fn render(self, cx: &mut gpui::WindowContext) -> impl gpui::IntoElement { fn render(self, cx: &mut gpui::WindowContext) -> impl gpui::IntoElement {
let theme = cx.theme(); let theme = cx.theme();
div() self.base
.map(|this| match self.orientation { .map(|this| match self.orientation {
Orientation::Vertical => this.v_flex().w_0().h_full(), Orientation::Vertical => this.v_flex().h_full(),
Orientation::Horizontal => this.h_flex().h_0().w_full(), Orientation::Horizontal => this.h_flex().w_full(),
}) })
.border_b_1() .child(
.border_color(theme.border) div()
.map(|this| match self.orientation {
Orientation::Vertical => this.v_flex().w_0().h_full().border_l_1(),
Orientation::Horizontal => this.h_flex().h_0().w_full().border_b_1(),
})
.border_color(theme.border),
)
} }
} }