Simplified the navbar events

- Made padding smaller to mach mockups
This commit is contained in:
Eduardo Flores 2022-10-14 11:20:54 -07:00
parent ff2f3e574c
commit 1eee5513bd
4 changed files with 60 additions and 67 deletions

View file

@ -7,17 +7,39 @@ pub mod nav_bar {
#[macro_export]
macro_rules! nav_button {
($icon: expr, $title:expr, $condensed:expr) => {{
($title:expr, $icon: expr, $condensed:expr, $active: expr) => {
if $condensed {
$crate::iced::widget::Button::new($crate::widget::icon($icon, 22)).padding(8)
} else {
$crate::widget::button!(
$crate::widget::icon($icon, 22),
$crate::iced::widget::Text::new($title),
$crate::iced::widget::horizontal_space($crate::iced::Length::Fill),
$crate::iced::widget::Button::new(
$crate::iced::widget::Column::with_children(vec![
$crate::widget::icon($icon, 26).into(),
$crate::iced::widget::text($title).size(14).into(),
])
.spacing(5)
.width($crate::iced::Length::Units(110))
.height($crate::iced::Length::Units(60))
.align_items($crate::iced::alignment::Alignment::Center),
)
.style(if $active {
$crate::iced::theme::Button::Primary.into()
} else {
$crate::iced::theme::Button::Text.into()
})
} else {
$crate::iced::widget::Button::new(
$crate::iced::widget::row![
$crate::widget::icon($icon, 20),
$crate::iced::widget::Text::new($title).size(16).width($crate::iced::Length::Fill)
]
.spacing(10),
)
.padding(10)
.style(if $active {
$crate::iced::theme::Button::Primary.into()
} else {
$crate::iced::theme::Button::Text.into()
})
}
}};
};
}
pub fn nav_bar_sections_style(theme: &Theme) -> widget::container::Appearance {

View file

@ -91,70 +91,31 @@ impl<'a, Message> Component<Message, Renderer> for NavBar<'a, Message> {
}
}
fn view(&self, state: &Self::State) -> Element<'a, Self::Event, Renderer> {
fn view(&self, state: &Self::State) -> Element<Self::Event, Renderer> {
if self.active {
let mut sections: Vec<Element<'a, Self::Event, Renderer>> = vec![];
let mut pages: Vec<Element<'a, Self::Event, Renderer>> = vec![];
for (section_index, (section, section_pages)) in self.source.iter().enumerate() {
sections.push(
button(
column(vec![
icon(section.icon.clone(), 20).into(),
text(section.title.clone()).size(14).into(),
])
.width(Length::Units(100))
.height(Length::Units(50))
.align_items(Alignment::Center),
crate::nav_button!(
&section.title,
&section.icon,
true,
section_index == state.selected_section
)
.style(if section_index == state.selected_section {
theme::Button::Primary.into()
} else {
theme::Button::Text.into()
})
.on_press(NavBarEvent::SectionSelected(section_index))
.into(),
);
if section_index == state.selected_section {
for (page_index, page) in section_pages.iter().enumerate() {
pages.push(if self.condensed {
button(
column(vec![
icon(&page.icon, 20).into(),
text(&page.title).size(14).into(),
])
.width(Length::Units(100))
.height(Length::Units(50))
.align_items(Alignment::Center),
)
.style(if let Some(selected_page) = state.selected_page {
if page_index == selected_page {
theme::Button::Primary.into()
} else {
theme::Button::Text.into()
}
} else {
theme::Button::Text.into()
}).on_press(NavBarEvent::PageSelected(section_index, page_index))
.into()
} else {
button(row![
icon(&page.icon, 20),
text(&page.title).size(16).width(Length::Fill)
].spacing(10))
.padding(10)
.style(if let Some(selected_page) = state.selected_page {
if page_index == selected_page {
theme::Button::Primary.into()
} else {
theme::Button::Text.into()
}
} else {
theme::Button::Text.into()
})
.on_press(NavBarEvent::PageSelected(section_index, page_index))
.into()
});
let active = state.selected_page.is_some()
&& page_index == state.selected_page.unwrap();
pages.push(
crate::nav_button!(&page.title, &page.icon, self.condensed, active)
.on_press(NavBarEvent::PageSelected(section_index, page_index))
.into(),
);
}
}
}