diff --git a/neothesia/src/iced_utils/bootstrap-icons.ttf b/neothesia/src/iced_utils/bootstrap-icons.ttf new file mode 100644 index 00000000..dfd00c5f Binary files /dev/null and b/neothesia/src/iced_utils/bootstrap-icons.ttf differ diff --git a/neothesia/src/iced_utils/iced_manager.rs b/neothesia/src/iced_utils/iced_manager.rs index 0bd9cea8..54ff4bc5 100644 --- a/neothesia/src/iced_utils/iced_manager.rs +++ b/neothesia/src/iced_utils/iced_manager.rs @@ -1,3 +1,5 @@ +use iced_core::text::Renderer; + pub struct IcedManager { pub renderer: iced_wgpu::Renderer, pub viewport: iced_wgpu::graphics::Viewport, @@ -16,11 +18,14 @@ impl IcedManager { let settings = iced_wgpu::Settings::default(); - let renderer = iced_wgpu::Renderer::new( + let mut renderer = iced_wgpu::Renderer::new( iced_wgpu::Backend::new(device, queue, settings, texture_format), iced_core::Font::default(), iced_core::Pixels(16.0), ); + renderer.load_font(std::borrow::Cow::Borrowed(include_bytes!( + "./bootstrap-icons.ttf" + ))); let viewport = iced_wgpu::graphics::Viewport::with_physical_size( iced_core::Size::new(physical_size.0, physical_size.1), diff --git a/neothesia/src/scene/menu_scene/iced_menu/mod.rs b/neothesia/src/scene/menu_scene/iced_menu/mod.rs index e7912b1b..904f1f8e 100644 --- a/neothesia/src/scene/menu_scene/iced_menu/mod.rs +++ b/neothesia/src/scene/menu_scene/iced_menu/mod.rs @@ -1,11 +1,11 @@ -use super::Renderer; +use super::{icons, neo_btn::NeoBtn, Renderer}; use iced_core::{ alignment::{Horizontal, Vertical}, image::Handle as ImageHandle, Alignment, Length, Padding, }; use iced_runtime::Command; -use iced_widget::{button, column as col, container, image, row, text, vertical_space}; +use iced_widget::{column as col, container, image, row, text, vertical_space}; use crate::{ iced_utils::iced_state::{Element, Program}, @@ -242,7 +242,7 @@ impl<'a> Step { neo_button("Exit") .on_press(Message::GoToPage(Step::Exit)) .width(Length::Fill) - .height(Length::Fixed(80.0)) + .height(Length::Fixed(80.0)), ] .width(Length::Fixed(450.0)) .spacing(10); @@ -254,17 +254,28 @@ impl<'a> Step { let mut content = top_padded(column); if target.song.is_some() { - let tracks = button(centered_text("Tracks")) - .on_press(Message::GoToPage(Step::TrackSelection)) - .style(theme::button()); - - let play = neo_button("Play") - .height(Length::Fixed(60.0)) - .min_width(80.0) - .on_press(Message::Play); + let tracks = NeoBtn::new( + icons::note_list_icon() + .size(30.0) + .vertical_alignment(Vertical::Center) + .horizontal_alignment(Horizontal::Center), + ) + .height(Length::Fixed(60.0)) + .min_width(80.0) + .on_press(Message::GoToPage(Step::TrackSelection)); + + let play = NeoBtn::new( + icons::play_icon() + .size(30.0) + .vertical_alignment(Vertical::Center) + .horizontal_alignment(Horizontal::Center), + ) + .height(Length::Fixed(60.0)) + .min_width(80.0) + .on_press(Message::Play); let row = row![tracks, play] - .spacing(20) + .spacing(10) .align_items(Alignment::Center); let container = container(row) diff --git a/neothesia/src/scene/menu_scene/iced_menu/tracks.rs b/neothesia/src/scene/menu_scene/iced_menu/tracks.rs index 0d43fd8e..e9510e9a 100644 --- a/neothesia/src/scene/menu_scene/iced_menu/tracks.rs +++ b/neothesia/src/scene/menu_scene/iced_menu/tracks.rs @@ -1,10 +1,13 @@ -use iced_core::{Alignment, Length}; +use iced_core::{ + alignment::{Horizontal, Vertical}, + Alignment, Length, Padding, +}; use iced_runtime::Command; -use iced_widget::{button, column as col, row, vertical_space}; +use iced_widget::{button, column as col, container, row, vertical_space}; use crate::{ iced_utils::iced_state::Element, - scene::menu_scene::{segment_button, track_card}, + scene::menu_scene::{icons, neo_btn::NeoBtn, segment_button, track_card}, song::PlayerConfig, target::Target, }; @@ -118,7 +121,70 @@ pub(super) fn view<'a>(_data: &'a Data, target: &Target) -> Element<'a, Message> } } - let controls = { + let column = super::super::wrap::Wrap::with_elements(tracks) + .spacing(14.0) + .line_spacing(14.0) + .padding(30.0) + .align_items(Alignment::Center); + + let column = col![vertical_space(Length::Fixed(30.0)), column] + .align_items(Alignment::Center) + .width(Length::Fill); + + let column = iced_widget::scrollable(column); + + let mut content = { + let content = column.height(Length::Fill); + + col![content] + .width(Length::Fill) + .height(Length::Fill) + .align_items(Alignment::Center) + }; + + let right = { + let back = NeoBtn::new( + icons::left_arrow_icon() + .size(30.0) + .vertical_alignment(Vertical::Center) + .horizontal_alignment(Horizontal::Center), + ) + .height(Length::Fixed(60.0)) + .min_width(80.0) + .on_press(Message::GoToPage(super::Step::Main)); + + let play = NeoBtn::new( + icons::play_icon() + .size(30.0) + .vertical_alignment(Vertical::Center) + .horizontal_alignment(Horizontal::Center), + ) + .height(Length::Fixed(60.0)) + .min_width(80.0) + .on_press(Message::Play); + + if target.song.is_some() { + row![back, play] + } else { + row![back] + } + .spacing(10) + .width(Length::Shrink) + .align_items(Alignment::Center) + }; + + let right = container(right) + .width(Length::Fill) + .align_x(Horizontal::Right) + .align_y(Vertical::Center) + .padding(Padding { + top: 0.0, + right: 10.0, + bottom: 10.0, + left: 0.0, + }); + + let center = { let listen = button(centered_text("Listen Only")) .on_press(TracksMessage::AllTracksPlayer(PlayerConfig::Auto).into()) .style(theme::button()); @@ -127,18 +193,30 @@ pub(super) fn view<'a>(_data: &'a Data, target: &Target) -> Element<'a, Message> .on_press(TracksMessage::AllTracksPlayer(PlayerConfig::Human).into()) .style(theme::button()); - row![listen, play_along].spacing(14) + row![listen, play_along] + .width(Length::Shrink) + .align_items(Alignment::Center) + .spacing(14) }; - let column = super::super::wrap::Wrap::with_elements(tracks) - .spacing(14.0) - .line_spacing(14.0) - .padding(50.0) - .align_items(Alignment::Center); + let center = container(center) + .width(Length::Fill) + .align_x(Horizontal::Center) + .align_y(Vertical::Center) + .padding(Padding { + top: 0.0, + right: 10.0, + bottom: 10.0, + left: 0.0, + }); - let column = col![vertical_space(Length::Fixed(30.0)), controls, column] - .align_items(Alignment::Center) - .width(Length::Fill); + let left = row![].width(Length::Fill); + let center = row![center].width(Length::Fill); + let right = row![right].width(Length::Fill); + + let main = row![left, center, right].align_items(Alignment::Center); + + content = content.push(main); - iced_widget::scrollable(column).into() + content.into() } diff --git a/neothesia/src/scene/menu_scene/icons.rs b/neothesia/src/scene/menu_scene/icons.rs new file mode 100644 index 00000000..240ad8c7 --- /dev/null +++ b/neothesia/src/scene/menu_scene/icons.rs @@ -0,0 +1,15 @@ +use super::Renderer; + +static ICONS: iced_core::Font = iced_core::Font::with_name("bootstrap-icons"); + +pub fn play_icon<'a>() -> iced_widget::Text<'a, Renderer> { + iced_widget::text('\u{f49d}').font(ICONS) +} + +pub fn note_list_icon<'a>() -> iced_widget::Text<'a, Renderer> { + iced_widget::text('\u{f451}').font(ICONS) +} + +pub fn left_arrow_icon<'a>() -> iced_widget::Text<'a, Renderer> { + iced_widget::text('\u{f12f}').font(ICONS) +} diff --git a/neothesia/src/scene/menu_scene/mod.rs b/neothesia/src/scene/menu_scene/mod.rs index 3a8ce854..37bfeee9 100644 --- a/neothesia/src/scene/menu_scene/mod.rs +++ b/neothesia/src/scene/menu_scene/mod.rs @@ -1,5 +1,6 @@ mod iced_menu; +mod icons; mod neo_btn; mod segment_button; mod track_card;