From e96694d5845479f98c05d5bfde765bb143fdb43f Mon Sep 17 00:00:00 2001 From: Elias Projahn Date: Thu, 21 Sep 2023 17:19:31 +0200 Subject: [PATCH] Add play button and player bar --- data/res/home_page.blp | 165 ++++++++++-------- .../scalable/actions/playlist-symbolic.svg | 2 + data/res/musicus.gresource.xml | 1 + data/res/window.blp | 60 ++++++- src/home_page.rs | 16 +- src/window.rs | 2 + 6 files changed, 166 insertions(+), 80 deletions(-) create mode 100644 data/res/icons/scalable/actions/playlist-symbolic.svg diff --git a/data/res/home_page.blp b/data/res/home_page.blp index ae202c9..038786b 100644 --- a/data/res/home_page.blp +++ b/data/res/home_page.blp @@ -5,92 +5,107 @@ template $MusicusHomePage : Adw.NavigationPage { title: _("Musicus"); tag: "home"; - Adw.ToolbarView { - [top] - Adw.HeaderBar header_bar { - [end] - MenuButton { - icon-name: "open-menu-symbolic"; - menu-model: primary_menu; - } - } - - [top] - Adw.Clamp { - maximum-size: 1000; - tightening-threshold: 600; - - Adw.Bin { - styles ["searchbar"] - - Gtk.SearchEntry search_entry { - placeholder-text: _("Enter composers, performers, works…"); + Gtk.Overlay { + Adw.ToolbarView { + [top] + Adw.HeaderBar header_bar { + [end] + MenuButton { + icon-name: "open-menu-symbolic"; + menu-model: primary_menu; } } - } - - Gtk.ScrolledWindow { - hscrollbar-policy: never; + [top] Adw.Clamp { maximum-size: 1000; tightening-threshold: 600; - Gtk.Box { - orientation: vertical; - margin-start: 12; - margin-end: 12; - margin-top: 24; + Adw.Bin { + styles ["searchbar"] - Gtk.Label { - styles ["heading"] - visible: bind persons_flow_box.visible; - halign: start; - label: _("Composers and performers"); - } - - Gtk.FlowBox persons_flow_box { - margin-top: 12; - margin-bottom: 24; - column-spacing: 14; - row-spacing: 14; - homogeneous: true; - selection-mode: none; - } - - Gtk.Label { - styles ["heading"] - visible: bind works_flow_box.visible; - halign: start; - label: _("Works"); - } - - Gtk.FlowBox works_flow_box { - margin-top: 12; - margin-bottom: 24; - column-spacing: 14; - row-spacing: 14; - homogeneous: true; - selection-mode: none; - } - - Gtk.Label { - styles ["heading"] - visible: bind recordings_flow_box.visible; - halign: start; - label: _("Recordings"); - } - - Gtk.FlowBox recordings_flow_box { - margin-top: 12; - margin-bottom: 24; - column-spacing: 14; - row-spacing: 14; - homogeneous: true; - selection-mode: none; + Gtk.SearchEntry search_entry { + placeholder-text: _("Enter composers, performers, works…"); + search-changed => $search() swapped; } } } + + Gtk.ScrolledWindow { + hscrollbar-policy: never; + + Adw.Clamp { + maximum-size: 1000; + tightening-threshold: 600; + + Gtk.Box { + orientation: vertical; + margin-start: 12; + margin-end: 12; + margin-top: 24; + margin-bottom: 68; + + Gtk.Label { + styles ["heading"] + visible: bind persons_flow_box.visible; + halign: start; + label: _("Composers and performers"); + } + + Gtk.FlowBox persons_flow_box { + margin-top: 12; + margin-bottom: 24; + column-spacing: 12; + row-spacing: 12; + homogeneous: true; + selection-mode: none; + } + + Gtk.Label { + styles ["heading"] + visible: bind works_flow_box.visible; + halign: start; + label: _("Works"); + } + + Gtk.FlowBox works_flow_box { + margin-top: 12; + margin-bottom: 24; + column-spacing: 12; + row-spacing: 12; + homogeneous: true; + selection-mode: none; + } + + Gtk.Label { + styles ["heading"] + visible: bind recordings_flow_box.visible; + halign: start; + label: _("Recordings"); + } + + Gtk.FlowBox recordings_flow_box { + margin-top: 12; + margin-bottom: 24; + column-spacing: 12; + row-spacing: 12; + homogeneous: true; + selection-mode: none; + } + } + } + } + } + + [overlay] + Gtk.Button play_button { + styles ["pill", "suggested-action"] + halign: end; + valign: end; + margin-end: 24; + margin-bottom: 24; + label: _("Play music"); + clicked => $play() swapped; } } } diff --git a/data/res/icons/scalable/actions/playlist-symbolic.svg b/data/res/icons/scalable/actions/playlist-symbolic.svg new file mode 100644 index 0000000..68bb05f --- /dev/null +++ b/data/res/icons/scalable/actions/playlist-symbolic.svg @@ -0,0 +1,2 @@ + + diff --git a/data/res/musicus.gresource.xml b/data/res/musicus.gresource.xml index 2417a98..89899cd 100644 --- a/data/res/musicus.gresource.xml +++ b/data/res/musicus.gresource.xml @@ -1,6 +1,7 @@ + icons/scalable/actions/playlist-symbolic.svg home_page.ui tile.ui welcome_page.ui diff --git a/data/res/window.blp b/data/res/window.blp index 47e97e2..1a13088 100644 --- a/data/res/window.blp +++ b/data/res/window.blp @@ -6,11 +6,63 @@ template $MusicusWindow : Adw.ApplicationWindow { default-width: 800; default-height: 600; - Adw.NavigationView navigation_view { - $MusicusWelcomePage { - folder-selected => $set_library_folder() swapped; + Adw.ToolbarView { + Adw.NavigationView navigation_view { + $MusicusWelcomePage { + folder-selected => $set_library_folder() swapped; + } + + $MusicusHomePage {} } - $MusicusHomePage {} + [bottom] + Gtk.Revealer player_bar_revealer { + reveal-child: false; + transition-type: slide_up; + + Gtk.Box { + margin-start: 6; + margin-end: 6; + margin-top: 6; + margin-bottom: 6; + spacing: 6; + + Gtk.Button play_button { + styles ["circular"] + valign: center; + icon-name: "media-playback-start-symbolic"; + } + + Gtk.Box { + hexpand: true; + valign: center; + orientation: vertical; + + Gtk.Label title_label { + styles ["caption-heading"] + halign: start; + label: _("Title"); + } + + Gtk.Label subtitle_label { + styles ["caption"] + halign: start; + label: _("Subtitle"); + } + } + + Gtk.Label { + styles ["caption", "numeric"] + valign: center; + label: "00:00 / 01:00"; + } + + Gtk.Button { + styles ["flat"] + valign: center; + icon-name: "playlist-symbolic"; + } + } + } } } \ No newline at end of file diff --git a/src/home_page.rs b/src/home_page.rs index 66ceece..fa11d6d 100644 --- a/src/home_page.rs +++ b/src/home_page.rs @@ -1,5 +1,5 @@ use adw::subclass::{navigation_page::NavigationPageImpl, prelude::*}; -use gtk::glib; +use gtk::{glib, prelude::*}; mod imp { use crate::tile::MusicusTile; @@ -17,6 +17,8 @@ mod imp { pub works_flow_box: TemplateChild, #[template_child] pub recordings_flow_box: TemplateChild, + #[template_child] + pub play_button: TemplateChild, } #[glib::object_subclass] @@ -27,6 +29,7 @@ mod imp { fn class_init(klass: &mut Self::Class) { klass.bind_template(); + klass.bind_template_instance_callbacks(); } fn instance_init(obj: &glib::subclass::InitializingObject) { @@ -57,8 +60,19 @@ glib::wrapper! { @extends gtk::Widget, adw::NavigationPage; } +#[gtk::template_callbacks] impl MusicusHomePage { pub fn new() -> Self { glib::Object::new() } + + #[template_callback] + fn play(&self, _: >k::Button) { + log::info!("Play button clicked"); + } + + #[template_callback] + fn search(&self, entry: >k::SearchEntry) { + log::info!("Search changed: \"{}\"", entry.text()); + } } diff --git a/src/window.rs b/src/window.rs index 31bca63..6b31af9 100644 --- a/src/window.rs +++ b/src/window.rs @@ -11,6 +11,8 @@ mod imp { pub struct MusicusWindow { #[template_child] pub navigation_view: TemplateChild, + #[template_child] + pub player_bar_revealer: TemplateChild, } #[glib::object_subclass]