wip carousel
This commit is contained in:
parent
932471218a
commit
c15bcbd1c3
8 changed files with 215 additions and 91 deletions
110
resources/album_carousel.blp
Normal file
110
resources/album_carousel.blp
Normal file
|
@ -0,0 +1,110 @@
|
||||||
|
using Gtk 4.0;
|
||||||
|
using Adw 1;
|
||||||
|
|
||||||
|
template $AudreyUiAlbumCarousel: Adw.Bin {
|
||||||
|
styles [ "album-carousel" ]
|
||||||
|
|
||||||
|
child: Box {
|
||||||
|
orientation: vertical;
|
||||||
|
|
||||||
|
Box {
|
||||||
|
margin-start: 12;
|
||||||
|
spacing: 6;
|
||||||
|
height-request: 42;
|
||||||
|
|
||||||
|
Label {
|
||||||
|
label: bind template.title;
|
||||||
|
styles [ "title-2" ]
|
||||||
|
}
|
||||||
|
|
||||||
|
Button {
|
||||||
|
valign: center;
|
||||||
|
icon-name: "view-refresh-symbolic";
|
||||||
|
styles [ "circular", "flat" ]
|
||||||
|
}
|
||||||
|
|
||||||
|
Box {
|
||||||
|
halign: end;
|
||||||
|
hexpand: true;
|
||||||
|
valign: center;
|
||||||
|
|
||||||
|
Button {
|
||||||
|
icon-name: "go-previous-symbolic";
|
||||||
|
styles [ "flat" ]
|
||||||
|
}
|
||||||
|
|
||||||
|
Button {
|
||||||
|
icon-name: "go-next-symbolic";
|
||||||
|
styles [ "flat" ]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Separator { styles [ "spacer" ] }
|
||||||
|
|
||||||
|
ScrolledWindow {
|
||||||
|
hexpand: true;
|
||||||
|
vscrollbar-policy: never;
|
||||||
|
hscrollbar-policy: external;
|
||||||
|
|
||||||
|
child: ListView {
|
||||||
|
orientation: horizontal;
|
||||||
|
|
||||||
|
styles [
|
||||||
|
"albums"
|
||||||
|
]
|
||||||
|
|
||||||
|
single-click-activate: true;
|
||||||
|
|
||||||
|
model: NoSelection {
|
||||||
|
model: bind template.model;
|
||||||
|
};
|
||||||
|
|
||||||
|
factory: BuilderListItemFactory {
|
||||||
|
template ListItem {
|
||||||
|
child: Box {
|
||||||
|
orientation: vertical;
|
||||||
|
margin-bottom: 6;
|
||||||
|
spacing: 6;
|
||||||
|
|
||||||
|
Image {
|
||||||
|
icon-name: "media-optical-cd";
|
||||||
|
pixel-size: 160;
|
||||||
|
halign: center;
|
||||||
|
hexpand: false;
|
||||||
|
}
|
||||||
|
|
||||||
|
Box {
|
||||||
|
styles [ "labels" ]
|
||||||
|
orientation: vertical;
|
||||||
|
homogeneous: true;
|
||||||
|
|
||||||
|
Label {
|
||||||
|
label: bind template.item as <StringObject>.string;
|
||||||
|
ellipsize: end;
|
||||||
|
xalign: 0;
|
||||||
|
margin-start: 6;
|
||||||
|
|
||||||
|
styles [
|
||||||
|
"heading"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
||||||
|
Label {
|
||||||
|
label: bind template.item as <StringObject>.string;
|
||||||
|
ellipsize: end;
|
||||||
|
xalign: 0;
|
||||||
|
margin-start: 6;
|
||||||
|
|
||||||
|
styles [
|
||||||
|
"caption"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
};
|
||||||
|
};
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
|
@ -7,6 +7,7 @@
|
||||||
<gresource prefix="/eu/callcc/audrey">
|
<gresource prefix="/eu/callcc/audrey">
|
||||||
<file>style.css</file>
|
<file>style.css</file>
|
||||||
<file preprocess="xml-stripblanks">gtk/help-overlay.ui</file>
|
<file preprocess="xml-stripblanks">gtk/help-overlay.ui</file>
|
||||||
|
<file preprocess="xml-stripblanks">album_carousel.ui</file>
|
||||||
<file preprocess="xml-stripblanks">play_queue.ui</file>
|
<file preprocess="xml-stripblanks">play_queue.ui</file>
|
||||||
<file preprocess="xml-stripblanks">play_queue_song.ui</file>
|
<file preprocess="xml-stripblanks">play_queue_song.ui</file>
|
||||||
<file preprocess="xml-stripblanks">playbar.ui</file>
|
<file preprocess="xml-stripblanks">playbar.ui</file>
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
blueprints = custom_target(
|
blueprints = custom_target(
|
||||||
'blueprints',
|
'blueprints',
|
||||||
input: files(
|
input: files(
|
||||||
|
'album_carousel.blp',
|
||||||
'play_queue.blp',
|
'play_queue.blp',
|
||||||
'play_queue_song.blp',
|
'play_queue_song.blp',
|
||||||
'playbar.blp',
|
'playbar.blp',
|
||||||
|
@ -8,6 +9,7 @@ blueprints = custom_target(
|
||||||
'window.blp',
|
'window.blp',
|
||||||
),
|
),
|
||||||
output: [
|
output: [
|
||||||
|
'album_carousel.ui',
|
||||||
'play_queue.ui',
|
'play_queue.ui',
|
||||||
'play_queue_song.ui',
|
'play_queue_song.ui',
|
||||||
'playbar.ui',
|
'playbar.ui',
|
||||||
|
|
|
@ -77,3 +77,28 @@ gridview.albums child image {
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
box-shadow: rgba(0, 0, 0, 0.6) 0px 0px 7px;
|
box-shadow: rgba(0, 0, 0, 0.6) 0px 0px 7px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* album carousel */
|
||||||
|
.album-carousel listview {
|
||||||
|
background-color: rgba(0,0,0,0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.album-carousel listview row {
|
||||||
|
padding-left: 10px;
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.album-carousel listview row image {
|
||||||
|
border-radius: 3px;
|
||||||
|
background-color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.album-carousel .labels {
|
||||||
|
border-radius: 3px;
|
||||||
|
background:
|
||||||
|
linear-gradient(
|
||||||
|
150deg,
|
||||||
|
color-mix(in srgb, var(--background-color-1) 16%, transparent),
|
||||||
|
color-mix(in srgb, var(--background-color-2) 16%, transparent) 50%);
|
||||||
|
box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 3px;
|
||||||
|
}
|
||||||
|
|
|
@ -37,101 +37,30 @@ template $AudreyUiWindow: Adw.ApplicationWindow {
|
||||||
icon-name: "folder-music-symbolic";
|
icon-name: "folder-music-symbolic";
|
||||||
title: _("Browse");
|
title: _("Browse");
|
||||||
|
|
||||||
child: Adw.NavigationView {
|
child: ScrolledWindow {
|
||||||
Adw.NavigationPage {
|
child: Box {
|
||||||
title: _("Browse");
|
orientation: vertical;
|
||||||
vexpand: true;
|
|
||||||
|
|
||||||
child: Adw.ToolbarView {
|
$AudreyUiAlbumCarousel {
|
||||||
[top]
|
title: _("Most played");
|
||||||
CenterBox {
|
model: StringList { strings [ "a", "b", "c", "d", "e", "f" ] };
|
||||||
styles [
|
}
|
||||||
"toolbar"
|
|
||||||
]
|
|
||||||
|
|
||||||
[start]
|
$AudreyUiAlbumCarousel {
|
||||||
DropDown {
|
title: _("Explore from your library");
|
||||||
selected: 0;
|
model: StringList { strings [ "a", "b", "c", "d", "e", "f" ] };
|
||||||
|
}
|
||||||
|
|
||||||
model: StringList {
|
$AudreyUiAlbumCarousel {
|
||||||
strings [
|
title: _("Newly added releases");
|
||||||
_("Random"),
|
model: StringList { strings [ "a", "b", "c", "d", "e", "f" ] };
|
||||||
_("Recently added"),
|
}
|
||||||
_("Most played"),
|
|
||||||
_("Recently played"),
|
|
||||||
_("Starred"),
|
|
||||||
_("Name"),
|
|
||||||
_("Artist"),
|
|
||||||
]
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
[center]
|
$AudreyUiAlbumCarousel {
|
||||||
SearchEntry {
|
title: _("Recently played");
|
||||||
placeholder-text: _("Search...");
|
model: StringList { strings [ "a", "b", "c", "d", "e", "f" ] };
|
||||||
}
|
}
|
||||||
|
};
|
||||||
[end]
|
|
||||||
Box {
|
|
||||||
Button {
|
|
||||||
sensitive: bind template.refreshing-albums inverted;
|
|
||||||
icon-name: "view-refresh";
|
|
||||||
clicked => $on_refresh_albums_clicked() swapped;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
ScrolledWindow {
|
|
||||||
vexpand: true;
|
|
||||||
|
|
||||||
GridView {
|
|
||||||
styles [
|
|
||||||
"albums"
|
|
||||||
]
|
|
||||||
|
|
||||||
single-click-activate: true;
|
|
||||||
|
|
||||||
model: NoSelection {
|
|
||||||
model: bind template.albums-model;
|
|
||||||
};
|
|
||||||
|
|
||||||
factory: BuilderListItemFactory {
|
|
||||||
template ListItem {
|
|
||||||
child: Box {
|
|
||||||
orientation: vertical;
|
|
||||||
margin-bottom: 6;
|
|
||||||
|
|
||||||
Image {
|
|
||||||
icon-name: "media-optical-cd";
|
|
||||||
pixel-size: 160;
|
|
||||||
halign: center;
|
|
||||||
hexpand: false;
|
|
||||||
}
|
|
||||||
|
|
||||||
Label {
|
|
||||||
label: bind template.item as <$AudreyModelAlbum>.name;
|
|
||||||
ellipsize: end;
|
|
||||||
|
|
||||||
styles [
|
|
||||||
"heading"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
|
|
||||||
Label {
|
|
||||||
label: bind template.item as <$AudreyModelAlbum>.artist;
|
|
||||||
ellipsize: end;
|
|
||||||
|
|
||||||
styles [
|
|
||||||
"caption"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
};
|
|
||||||
}
|
|
||||||
};
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -9,3 +9,6 @@ pub use setup::Setup;
|
||||||
|
|
||||||
pub mod play_queue;
|
pub mod play_queue;
|
||||||
pub use play_queue::PlayQueue;
|
pub use play_queue::PlayQueue;
|
||||||
|
|
||||||
|
pub mod album_carousel;
|
||||||
|
pub use album_carousel::AlbumCarousel;
|
||||||
|
|
52
src/ui/album_carousel.rs
Normal file
52
src/ui/album_carousel.rs
Normal file
|
@ -0,0 +1,52 @@
|
||||||
|
use adw::prelude::*;
|
||||||
|
use adw::subclass::prelude::*;
|
||||||
|
use adw::{gio, glib};
|
||||||
|
use glib::subclass::InitializingObject;
|
||||||
|
use std::cell::RefCell;
|
||||||
|
|
||||||
|
mod imp {
|
||||||
|
use super::*;
|
||||||
|
|
||||||
|
#[derive(glib::Properties, gtk::CompositeTemplate, Default)]
|
||||||
|
#[properties(wrapper_type = super::AlbumCarousel)]
|
||||||
|
#[template(resource = "/eu/callcc/audrey/album_carousel.ui")]
|
||||||
|
pub struct AlbumCarousel {
|
||||||
|
#[property(get, set)]
|
||||||
|
title: RefCell<String>,
|
||||||
|
|
||||||
|
#[property(get, set)]
|
||||||
|
model: RefCell<Option<gio::ListModel>>,
|
||||||
|
}
|
||||||
|
|
||||||
|
#[glib::object_subclass]
|
||||||
|
impl ObjectSubclass for AlbumCarousel {
|
||||||
|
const NAME: &'static str = "AudreyUiAlbumCarousel";
|
||||||
|
type Type = super::AlbumCarousel;
|
||||||
|
type ParentType = adw::Bin;
|
||||||
|
|
||||||
|
fn class_init(klass: &mut Self::Class) {
|
||||||
|
klass.bind_template();
|
||||||
|
klass.bind_template_callbacks();
|
||||||
|
}
|
||||||
|
|
||||||
|
fn instance_init(obj: &InitializingObject<Self>) {
|
||||||
|
obj.init_template();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#[glib::derived_properties]
|
||||||
|
impl ObjectImpl for AlbumCarousel {}
|
||||||
|
|
||||||
|
impl WidgetImpl for AlbumCarousel {}
|
||||||
|
|
||||||
|
impl BinImpl for AlbumCarousel {}
|
||||||
|
|
||||||
|
#[gtk::template_callbacks]
|
||||||
|
impl AlbumCarousel {}
|
||||||
|
}
|
||||||
|
|
||||||
|
glib::wrapper! {
|
||||||
|
pub struct AlbumCarousel(ObjectSubclass<imp::AlbumCarousel>)
|
||||||
|
@extends adw::Bin, gtk::Widget,
|
||||||
|
@implements gtk::Accessible, gtk::Buildable, gtk::ConstraintTarget;
|
||||||
|
}
|
|
@ -163,6 +163,8 @@ mod imp {
|
||||||
type ParentType = adw::ApplicationWindow;
|
type ParentType = adw::ApplicationWindow;
|
||||||
|
|
||||||
fn class_init(klass: &mut Self::Class) {
|
fn class_init(klass: &mut Self::Class) {
|
||||||
|
crate::ui::AlbumCarousel::ensure_type();
|
||||||
|
|
||||||
klass.bind_template();
|
klass.bind_template();
|
||||||
klass.bind_template_callbacks();
|
klass.bind_template_callbacks();
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue