skullbite/cartridges
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adaptive layout for mobile - closes #66

Browse Source
This commit is contained in:
kramo
2023-07-05 11:03:08 +02:00
parent df461421c3
commit 6893551f1c
3 changed files with 164 additions and 141 deletions
Download Patch File Download Diff File Expand all files Collapse all files

297
data/gtk/window.blp
View File

@@ -179,174 +179,197 @@ Adw.NavigationPage details_page {
name: "details_view"; name: "details_view";
[overlay] [overlay]
Box details_view_box { Adw.ToolbarView details_view_toolbar_view {
orientation: vertical;
[top]
Adw.HeaderBar { Adw.HeaderBar {
styles [
"flat",
]
} }
Adw.Bin { Adw.BreakpointBin {
hexpand: true; hexpand: true;
vexpand: true; vexpand: true;
width-request: 229;
height-request: 54;
Box { Adw.Breakpoint {
halign: center; condition ("max-width: 564px")
valign: center; setters {
margin-start: 24; details_view_box.orientation: vertical;
margin-end: 24; details_view_box.margin-top: 12;
margin-top: 24; details_view_box.margin-start: 12;
margin-bottom: 24; details_view_box.margin-end: 12;
details_view_details_box.margin-start: 0;
Adw.Clamp { details_view_details_box.margin-end: 0;
maximum-size: 200; details_view_title.margin-top: 30;
details_view_title.halign: center;
Overlay { details_view_developer.halign: center;
[overlay] details_view_date_box.halign: center;
Spinner details_view_spinner { details_view_toolbar.halign: center;
margin-start: 72; details_view_toolbar.orientation: vertical;
margin-end: 72; details_view_play_button.halign: center;
} details_view_toolbar_buttons.margin-start: 0;
Picture details_view_cover {
halign: end;
valign: start;
width-request: 200;
height-request: 300;
styles [
"card",
]
}
}
} }
}
Box { ScrolledWindow {
orientation: vertical; Box details_view_box {
margin-start: 48; halign: center;
vexpand: true;
valign: center; valign: center;
margin-start: 24;
margin-end: 24;
margin-top: 24;
margin-bottom: 24;
Label details_view_title { Adw.Clamp {
label: _("Game Title"); maximum-size: 200;
hexpand: true;
halign: start;
max-width-chars: 24;
wrap: true;
wrap-mode: word_char;
natural-wrap-mode: word;
styles [ Overlay {
"title-1", [overlay]
] Spinner details_view_spinner {
} margin-start: 72;
margin-end: 72;
}
Label details_view_developer { Picture details_view_cover {
margin-top: 6; halign: end;
hexpand: true; valign: start;
halign: start; width-request: 200;
max-width-chars: 36; height-request: 300;
wrap: true;
wrap-mode: word_char;
natural-wrap-mode: word;
styles [ styles [
"heading", "card",
] ]
} }
Box {
orientation: horizontal;
margin-top: 15;
hexpand: true;
halign: start;
Label details_view_added {
wrap: true;
wrap-mode: word_char;
natural-wrap-mode: word;
}
Label details_view_last_played {
margin-start: 12;
wrap: true;
wrap-mode: word_char;
natural-wrap-mode: word;
} }
} }
Box { Box details_view_details_box {
hexpand: true; orientation: vertical;
margin-start: 48;
vexpand: true; vexpand: true;
valign: center; valign: center;
Button details_view_play_button { Label details_view_title {
name: "details_view_play_button"; label: _("Game Title");
action-name: "app.launch_game"; hexpand: true;
label: _("Play");
halign: start; halign: start;
margin-top: 24; max-width-chars: 24;
wrap: true;
wrap-mode: word_char;
natural-wrap-mode: word;
styles [ styles [
"opaque", "title-1",
"pill",
] ]
} }
Box { Label details_view_developer {
margin-top: 6;
hexpand: true;
halign: start; halign: start;
valign: center; max-width-chars: 36;
margin-top: 24; wrap: true;
margin-start: 9; wrap-mode: word_char;
natural-wrap-mode: word;
Button {
icon-name: "document-edit-symbolic";
action-name: "app.edit_game";
tooltip-text: _("Edit");
styles [
"raised",
"circular",
]
}
Button details_view_hide_button {
action-name: "app.hide_game";
styles [
"raised",
"circular",
]
}
Button {
icon-name: "user-trash-symbolic";
action-name: "app.remove_game";
tooltip-text: _("Remove");
styles [
"raised",
"circular",
]
}
MenuButton {
icon-name: "system-search-symbolic";
menu-model: search;
tooltip-text: _("Search");
styles [
"raised",
"circular",
]
}
styles [ styles [
"toolbar", "heading",
] ]
} }
Box details_view_date_box {
orientation: horizontal;
margin-top: 15;
hexpand: true;
halign: start;
Label details_view_added {
wrap: true;
wrap-mode: word_char;
natural-wrap-mode: word;
justify: center;
}
Label details_view_last_played {
margin-start: 12;
wrap: true;
wrap-mode: word_char;
natural-wrap-mode: word;
justify: center;
}
}
Box details_view_toolbar {
hexpand: true;
vexpand: true;
valign: center;
Button details_view_play_button {
name: "details_view_play_button";
action-name: "app.launch_game";
label: _("Play");
halign: start;
margin-top: 24;
styles [
"opaque",
"pill",
]
}
Box details_view_toolbar_buttons {
halign: start;
valign: center;
margin-top: 24;
margin-start: 9;
Button {
icon-name: "document-edit-symbolic";
action-name: "app.edit_game";
tooltip-text: _("Edit");
styles [
"raised",
"circular",
]
}
Button details_view_hide_button {
action-name: "app.hide_game";
styles [
"raised",
"circular",
]
}
Button {
icon-name: "user-trash-symbolic";
action-name: "app.remove_game";
tooltip-text: _("Remove");
styles [
"raised",
"circular",
]
}
MenuButton {
icon-name: "system-search-symbolic";
menu-model: search;
tooltip-text: _("Search");
styles [
"raised",
"circular",
]
}
styles [
"toolbar",
]
}
}
} }
} }
} }

2
data/hu.kramo.Cartridges.metainfo.xml.in
View File

@@ -22,7 +22,7 @@
<control>touch</control> <control>touch</control>
</supports> </supports>
<recommends> <recommends>
<display_length compare="gt">545</display_length> <display_length compare="gt">229</display_length>
</recommends> </recommends>
<screenshots> <screenshots>
<screenshot type="default"> <screenshot type="default">

6
src/window.py
View File

@@ -43,7 +43,7 @@ class CartridgesWindow(Adw.ApplicationWindow):
search_button = Gtk.Template.Child() search_button = Gtk.Template.Child()
details_page = Gtk.Template.Child() details_page = Gtk.Template.Child()
details_view_box = Gtk.Template.Child() details_view_toolbar_view = Gtk.Template.Child()
details_view_cover = Gtk.Template.Child() details_view_cover = Gtk.Template.Child()
details_view_spinner = Gtk.Template.Child() details_view_spinner = Gtk.Template.Child()
details_view_title = Gtk.Template.Child() details_view_title = Gtk.Template.Child()
@@ -75,8 +75,8 @@ class CartridgesWindow(Adw.ApplicationWindow):
def __init__(self, **kwargs): def __init__(self, **kwargs):
super().__init__(**kwargs) super().__init__(**kwargs)
self.details_view.set_measure_overlay(self.details_view_box, True) self.details_view.set_measure_overlay(self.details_view_toolbar_view, True)
self.details_view.set_clip_overlay(self.details_view_box, False) self.details_view.set_clip_overlay(self.details_view_toolbar_view, False)
self.library.set_filter_func(self.filter_func) self.library.set_filter_func(self.filter_func)
self.hidden_library.set_filter_func(self.filter_func) self.hidden_library.set_filter_func(self.filter_func)