Yehowshua/ZIm
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add TabBar component

Browse source
This commit is contained in:
Marshall Bowers 2023-10-07 11:13:54 -04:00
parent 7c8d662315
commit 00e8531898
5 changed files with 146 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

85
crates/ui2/src/components/tab_bar.rs Normal file
View file

@ -0,0 +1,85 @@
use std::marker::PhantomData;
use crate::prelude::*;
use crate::{theme, Icon, IconButton, Tab};
#[derive(Element)]
pub struct TabBar<S: 'static + Send + Sync + Clone> {
state_type: PhantomData<S>,
scroll_state: ScrollState,
tabs: Vec<Tab<S>>,
}
impl<S: 'static + Send + Sync + Clone> TabBar<S> {
pub fn new(tabs: Vec<Tab<S>>) -> Self {
Self {
state_type: PhantomData,
scroll_state: ScrollState::default(),
tabs,
}
}
pub fn bind_scroll_state(&mut self, scroll_state: ScrollState) {
self.scroll_state = scroll_state;
}
fn render(&mut self, cx: &mut ViewContext<S>) -> impl Element<State = S> {
let theme = theme(cx);
let can_navigate_back = true;
let can_navigate_forward = false;
div()
.w_full()
.flex()
.fill(theme.middle.base.default.background)
// Left Side
.child(
div()
.px_1()
.flex()
.flex_none()
.gap_2()
// Nav Buttons
.child(
div()
.flex()
.items_center()
.gap_px()
.child(
IconButton::new(Icon::ArrowLeft)
.state(InteractionState::Enabled.if_enabled(can_navigate_back)),
)
.child(
IconButton::new(Icon::ArrowRight).state(
InteractionState::Enabled.if_enabled(can_navigate_forward),
),
),
),
)
.child(
div().w_0().flex_1().h_full().child(
div()
.flex()
.overflow_x_scroll(self.scroll_state.clone())
.children(self.tabs.clone()),
),
)
// Right Side
.child(
div()
.px_1()
.flex()
.flex_none()
.gap_2()
// Nav Buttons
.child(
div()
.flex()
.items_center()
.gap_px()
.child(IconButton::new(Icon::Plus))
.child(IconButton::new(Icon::Split)),
),
)
}
}