ui redesign, still wip

This commit is contained in:
liyaowhen
2024-07-29 20:13:04 -07:00
parent 151fc5fb34
commit 626906b482
6 changed files with 95 additions and 16 deletions
+2
View File
@@ -12,6 +12,8 @@ namespace Song {
public static MainViewContent main_view_content; // main view content should avoid using this controller during instanciation
public static SideBarContent sidebar_content;
public static SideBar side_bar;
public static Adw.OverlaySplitView split_view;
public static SongControls song_controls;
+2 -1
View File
@@ -11,7 +11,8 @@ song_sources = [
'widgets/music_list_row.vala',
'widgets/song_controls.vala',
'playlist_object.vala',
'widgets/new_playlist_popover.vala'
'widgets/new_playlist_popover.vala',
'widgets/yt_search.vala',
]
song_deps = [
+37 -10
View File
@@ -21,7 +21,37 @@ namespace Song {
scrollable.hexpand = true;
scrollable.hexpand_set = true;
var action_bar = new MainViewActionBar (main_content);
var collapse_button_revealer = new Gtk.Revealer();
var collapse_button = new Gtk.Button.from_icon_name ("folder-symbolic");
collapse_button.valign = Gtk.Align.CENTER;
collapse_button_revealer.set_child(collapse_button);
collapse_button_revealer.transition_type = Gtk.RevealerTransitionType.SLIDE_RIGHT;
var action_bar = new Adw.HeaderBar();
action_bar.show_back_button = false;
action_bar.title_widget = new YtSearchBar();
action_bar.pack_start(collapse_button_revealer);
collapse_button.clicked.connect(() => {
if(SongController.split_view.get_collapsed ()){
SongController.split_view.set_collapsed (false);
collapse_button_revealer.set_reveal_child(false);
} else {
SongController.split_view.set_collapsed(true);
action_bar.margin_start = -5;
}
});
Timeout.add(1, () => {
if (SongController.side_bar != null) {
SongController.side_bar.collapsing.connect(() => {
collapse_button_revealer.set_reveal_child(true);
action_bar.margin_start = 5;
});
return false;
}
return true;
});
var controls = new SongControls();
@@ -38,23 +68,20 @@ namespace Song {
}
public class MainViewActionBar : Gtk.Box {
private Gtk.ActionBar action_bar;
private MainViewContent main_view;
private YtSearchBar yt_search_bar;
public MainViewActionBar (MainViewContent _main_view) {
this.main_view = _main_view;
}
construct {
orientation = Gtk.Orientation.HORIZONTAL;
action_bar = new Gtk.ActionBar();
action_bar.vexpand = true;
action_bar.hexpand = true;
append(action_bar);
hexpand = true;
halign = Gtk.Align.FILL;
yt_search_bar.hexpand = true;
}
+22
View File
@@ -8,6 +8,8 @@ namespace Song {
public SideBarContent side_bar_content;
public SideBarControls side_bar_controls;
public signal void collapsing();
// unify the signals for sidebar and maincontent collapsing in a singleton song controller
public SideBar(Window _window) {
@@ -15,9 +17,28 @@ namespace Song {
}
construct {
SongController.side_bar = this;
var toolbar_view = new Adw.ToolbarView();
var collapse_button = new Gtk.Button.from_icon_name ("folder-open-symbolic");
collapse_button.clicked.connect(() => {
if(SongController.split_view.get_collapsed ()){
SongController.split_view.set_collapsed (false);
collapse_button.set_icon_name("folder-open-symbolic");
} else {
SongController.split_view.set_collapsed(true);
collapse_button.set_icon_name("folder-symbolic");
}
collapsing();
});
var header_bar = new Adw.HeaderBar();
header_bar.margin_top = 5;
header_bar.show_title = false;
header_bar.show_start_title_buttons = false;
header_bar.show_end_title_buttons = false;
header_bar.pack_start(collapse_button);
var scroll_box = new Gtk.ScrolledWindow();
scroll_box.hscrollbar_policy = Gtk.PolicyType.NEVER;
side_bar_content = new SideBarContent ();
@@ -28,6 +49,7 @@ namespace Song {
side_bar_controls = new SideBarControls (side_bar_content);
side_bar_controls.set_hexpand (true);
toolbar_view.add_top_bar(header_bar);
toolbar_view.set_content(scroll_box);
toolbar_view.add_bottom_bar(side_bar_controls);
+23
View File
@@ -0,0 +1,23 @@
namespace Song {
public class YtSearchBar : Gtk.Box {
private Gtk.SearchEntry search_entry = new Gtk.SearchEntry ();
private MainViewActionBar container_parent;
private Adw.Clamp search_clamp = new Adw.Clamp();
construct {
var gesture = new Gtk.GestureClick();
add_controller(gesture);
add_css_class ("toolbar");
hexpand = true;
search_entry.hexpand = true;
search_clamp.set_child(search_entry);
append(search_clamp);
}
}
}
+9 -5
View File
@@ -28,7 +28,6 @@ namespace Song {
// UI
var title_bar = new Adw.HeaderBar ();
//title_bar.set_decoration_layout("icon:close");
title_bar.show_title = false;
var add_playlist = new Gtk.Button();
var add_playlist_content = new Adw.ButtonContent();
@@ -51,24 +50,29 @@ namespace Song {
new_music_popover_show();
});
var yt_search_bar = new YtSearchBar();
var collapse_button = new Gtk.Button.from_icon_name ("folder-open-symbolic");
title_bar.pack_start (collapse_button);
title_bar.pack_start(add_playlist);
title_bar.pack_start(add_button);
title_bar.title_widget = yt_search_bar;
main_view = new MainView(this);
sidebar = new SideBar(this);
var split_view = new Adw.NavigationSplitView ();
var split_view = new Adw.OverlaySplitView ();
split_view.set_sidebar (sidebar);
split_view.set_content(main_view);
split_view.show_content = true;
split_view.collapsed = false;
SongController.split_view = split_view;
var _content = new Adw.ToolbarView ();
_content.add_top_bar (title_bar);
//_content.add_top_bar (title_bar);
//TODO: reimplement top bar
_content.set_content (split_view);
var controller = new Gtk.ShortcutController();
@@ -87,7 +91,7 @@ namespace Song {
}
});
set_content(_content);