[gnome-music/wip/jfelder/albumwidget-full-scrollarea: 1/4] albumwidget: Widen scroll area
- From: Jean Felder <jfelder src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gnome-music/wip/jfelder/albumwidget-full-scrollarea: 1/4] albumwidget: Widen scroll area
- Date: Wed, 9 Jan 2019 08:05:44 +0000 (UTC)
commit b7e51911a10fbc74a843cef1c34b0afe119ae28d
Author: Jean Felder <jfelder src gnome org>
Date: Tue Jan 8 18:08:05 2019 +0100
albumwidget: Widen scroll area
The AlbumWidget is made of two boxes: album details on the left and
the playlist on the right. The scrolled window is only associated with
the playlist. This allows to have a fixed album details box when a
scroll operations happens. However, the mouse pointer needs to be
located inside the list to make a scroll operation.
Move the ScrolledWindow directly below the AlbumWidget to make the
whole area scrollable. Update album details box's margin each time a
scroll operation happens to give the impression that this box does not
move. Finally, compute album details box's minimal height to prevent
an infinite scrolling.
Closes: #13
data/ui/AlbumWidget.ui | 372 +++++++++++++++++++-------------------
gnomemusic/widgets/albumwidget.py | 24 +++
2 files changed, 207 insertions(+), 189 deletions(-)
---
diff --git a/data/ui/AlbumWidget.ui b/data/ui/AlbumWidget.ui
index 9dd7253d..9909ac74 100644
--- a/data/ui/AlbumWidget.ui
+++ b/data/ui/AlbumWidget.ui
@@ -9,60 +9,44 @@
<class name="content-view"/>
</style>
<child>
- <object class="GtkBox">
+ <object class="GtkScrolledWindow" id="_scrolled_window">
<property name="visible">True</property>
<property name="can_focus">False</property>
+ <property name="hexpand">True</property>
+ <property name="vexpand">True</property>
+ <property name="hscrollbar_policy">never</property>
<child>
- <object class="GtkBox" id="albumInfo">
+ <object class="GtkBox">
<property name="visible">True</property>
<property name="can_focus">False</property>
- <property name="halign">end</property>
- <property name="margin_start">32</property>
- <property name="margin_end">32</property>
- <property name="margin_top">64</property>
- <property name="margin_bottom">32</property>
- <property name="vexpand">True</property>
<child>
- <object class="GtkBox" id="albumDetails">
+ <object class="GtkBox" id="_album_info">
<property name="visible">True</property>
<property name="can_focus">False</property>
- <property name="halign">center</property>
+ <property name="halign">end</property>
+ <property name="margin_start">32</property>
+ <property name="margin_end">32</property>
+ <property name="margin_top">64</property>
+ <property name="margin_bottom">32</property>
<property name="valign">start</property>
- <property name="orientation">vertical</property>
- <property name="spacing">18</property>
- <child>
- <object class="CoverStack" id="_cover_stack">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="halign">center</property>
- <property name="valign">start</property>
- <property name="margin_start">1</property>
- <property name="margin_end">1</property>
- </object>
- <packing>
- <property name="expand">False</property>
- <property name="fill">False</property>
- <property name="position">0</property>
- </packing>
- </child>
+ <property name="vexpand">True</property>
+ <signal name="size-allocate" handler="_on_album_info_size_changed" swapped="no"/>
<child>
- <object class="GtkBox" id="artistBox">
+ <object class="GtkBox" id="albumDetails">
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="halign">center</property>
<property name="valign">start</property>
<property name="orientation">vertical</property>
- <property name="spacing">3</property>
+ <property name="spacing">18</property>
<child>
- <object class="GtkLabel" id="_title_label">
+ <object class="CoverStack" id="_cover_stack">
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="halign">center</property>
- <property name="justify">center</property>
- <property name="ellipsize">middle</property>
- <style>
- <class name="title-artist"/>
- </style>
+ <property name="valign">start</property>
+ <property name="margin_start">1</property>
+ <property name="margin_end">1</property>
</object>
<packing>
<property name="expand">False</property>
@@ -71,16 +55,48 @@
</packing>
</child>
<child>
- <object class="GtkLabel" id="_artist_label">
+ <object class="GtkBox" id="artistBox">
<property name="visible">True</property>
<property name="can_focus">False</property>
<property name="halign">center</property>
- <property name="justify">center</property>
- <property name="ellipsize">middle</property>
- <style>
- <class name="title-artist"/>
- <class name="dim-label"/>
- </style>
+ <property name="valign">start</property>
+ <property name="orientation">vertical</property>
+ <property name="spacing">3</property>
+ <child>
+ <object class="GtkLabel" id="_title_label">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="halign">center</property>
+ <property name="justify">center</property>
+ <property name="ellipsize">middle</property>
+ <style>
+ <class name="title-artist"/>
+ </style>
+ </object>
+ <packing>
+ <property name="expand">False</property>
+ <property name="fill">False</property>
+ <property name="position">0</property>
+ </packing>
+ </child>
+ <child>
+ <object class="GtkLabel" id="_artist_label">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="halign">center</property>
+ <property name="justify">center</property>
+ <property name="ellipsize">middle</property>
+ <style>
+ <class name="title-artist"/>
+ <class name="dim-label"/>
+ </style>
+ </object>
+ <packing>
+ <property name="expand">False</property>
+ <property name="fill">False</property>
+ <property name="position">1</property>
+ </packing>
+ </child>
</object>
<packing>
<property name="expand">False</property>
@@ -88,174 +104,152 @@
<property name="position">1</property>
</packing>
</child>
- </object>
- <packing>
- <property name="expand">False</property>
- <property name="fill">False</property>
- <property name="position">1</property>
- </packing>
- </child>
- <child>
- <object class="GtkGrid" id="grid">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="margin_top">21</property>
- <property name="column_spacing">32</property>
- <property name="column_homogeneous">True</property>
- <child>
- <object class="GtkLabel" id="released_label">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="halign">end</property>
- <property name="margin_top">2</property>
- <property name="margin_bottom">2</property>
- <property name="label" translatable="yes">Released</property>
- <property name="use_markup">True</property>
- <style>
- <class name="dim-label"/>
- </style>
- </object>
- <packing>
- <property name="left_attach">0</property>
- <property name="top_attach">0</property>
- </packing>
- </child>
- <child>
- <object class="GtkLabel" id="running_label">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="halign">end</property>
- <property name="label" translatable="yes">Running Length</property>
- <property name="use_markup">True</property>
- <style>
- <class name="dim-label"/>
- </style>
- </object>
- <packing>
- <property name="left_attach">0</property>
- <property name="top_attach">1</property>
- </packing>
- </child>
- <child>
- <object class="GtkLabel" id="_released_info_label">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="halign">start</property>
- <property name="margin_top">2</property>
- <property name="margin_bottom">2</property>
- <property name="label">----</property>
- </object>
- <packing>
- <property name="left_attach">1</property>
- <property name="top_attach">0</property>
- </packing>
- </child>
- <child>
- <object class="GtkLabel" id="_running_info_label">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="halign">start</property>
- <property name="label">--:--</property>
- </object>
- <packing>
- <property name="left_attach">1</property>
- <property name="top_attach">1</property>
- </packing>
- </child>
- <child>
- <object class="GtkLabel" id="_composer_label">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="no_show_all">True</property>
- <property name="halign">end</property>
- <property name="margin_top">2</property>
- <property name="margin_bottom">2</property>
- <property name="label" translatable="yes">Composer</property>
- <property name="use_markup">True</property>
- <style>
- <class name="dim-label"/>
- </style>
- </object>
- <packing>
- <property name="left_attach">0</property>
- <property name="top_attach">2</property>
- </packing>
- </child>
<child>
- <object class="GtkLabel" id="_composer_info_label">
+ <object class="GtkGrid" id="grid">
<property name="visible">True</property>
<property name="can_focus">False</property>
- <property name="no_show_all">True</property>
- <property name="halign">start</property>
- <property name="margin_top">2</property>
- <property name="margin_bottom">2</property>
- <property name="ellipsize">end</property>
+ <property name="margin_top">21</property>
+ <property name="column_spacing">32</property>
+ <property name="column_homogeneous">True</property>
+ <child>
+ <object class="GtkLabel" id="released_label">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="halign">end</property>
+ <property name="margin_top">2</property>
+ <property name="margin_bottom">2</property>
+ <property name="label" translatable="yes">Released</property>
+ <property name="use_markup">True</property>
+ <style>
+ <class name="dim-label"/>
+ </style>
+ </object>
+ <packing>
+ <property name="left_attach">0</property>
+ <property name="top_attach">0</property>
+ </packing>
+ </child>
+ <child>
+ <object class="GtkLabel" id="running_label">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="halign">end</property>
+ <property name="label" translatable="yes">Running Length</property>
+ <property name="use_markup">True</property>
+ <style>
+ <class name="dim-label"/>
+ </style>
+ </object>
+ <packing>
+ <property name="left_attach">0</property>
+ <property name="top_attach">1</property>
+ </packing>
+ </child>
+ <child>
+ <object class="GtkLabel" id="_released_info_label">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="halign">start</property>
+ <property name="margin_top">2</property>
+ <property name="margin_bottom">2</property>
+ <property name="label">----</property>
+ </object>
+ <packing>
+ <property name="left_attach">1</property>
+ <property name="top_attach">0</property>
+ </packing>
+ </child>
+ <child>
+ <object class="GtkLabel" id="_running_info_label">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="halign">start</property>
+ <property name="label">--:--</property>
+ </object>
+ <packing>
+ <property name="left_attach">1</property>
+ <property name="top_attach">1</property>
+ </packing>
+ </child>
+ <child>
+ <object class="GtkLabel" id="_composer_label">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="no_show_all">True</property>
+ <property name="halign">end</property>
+ <property name="margin_top">2</property>
+ <property name="margin_bottom">2</property>
+ <property name="label" translatable="yes">Composer</property>
+ <property name="use_markup">True</property>
+ <style>
+ <class name="dim-label"/>
+ </style>
+ </object>
+ <packing>
+ <property name="left_attach">0</property>
+ <property name="top_attach">2</property>
+ </packing>
+ </child>
+ <child>
+ <object class="GtkLabel" id="_composer_info_label">
+ <property name="visible">True</property>
+ <property name="can_focus">False</property>
+ <property name="no_show_all">True</property>
+ <property name="halign">start</property>
+ <property name="margin_top">2</property>
+ <property name="margin_bottom">2</property>
+ <property name="ellipsize">end</property>
+ </object>
+ <packing>
+ <property name="left_attach">1</property>
+ <property name="top_attach">2</property>
+ </packing>
+ </child>
</object>
<packing>
- <property name="left_attach">1</property>
- <property name="top_attach">2</property>
+ <property name="expand">True</property>
+ <property name="fill">True</property>
+ <property name="position">3</property>
</packing>
</child>
</object>
<packing>
- <property name="expand">True</property>
- <property name="fill">True</property>
- <property name="position">3</property>
+ <property name="expand">False</property>
+ <property name="fill">False</property>
+ <property name="position">0</property>
</packing>
</child>
</object>
<packing>
- <property name="expand">False</property>
- <property name="fill">False</property>
- <property name="position">0</property>
+ <property name="expand">True</property>
+ <property name="fill">True</property>
+ <property name="position">1</property>
</packing>
</child>
- </object>
- <packing>
- <property name="expand">True</property>
- <property name="fill">True</property>
- <property name="position">1</property>
- </packing>
- </child>
- <child>
- <object class="GtkScrolledWindow" id="scrolledWindow">
- <property name="visible">True</property>
- <property name="can_focus">False</property>
- <property name="hexpand">True</property>
- <property name="vexpand">True</property>
- <property name="hscrollbar_policy">never</property>
<child>
- <object class="GtkViewport" id="_viewport">
- <property name="width_request">600</property>
- <property name="visible">True</property>
+ <!-- TODO: The top of the coverart is the same vertical -->
+ <!-- position as the top of the album songs, however -->
+ <!-- since we set a top margins for the discbox -->
+ <!-- subtract that margin here. A cleaner solution is appreciated. -->
+ <object class="DiscListBox" id="_disc_listbox">
<property name="can_focus">False</property>
+ <property name="margin_top">48</property>
+ <property name="margin_bottom">64</property>
+ <property name="margin_end">32</property>
<property name="halign">start</property>
- <property name="hexpand">True</property>
- <property name="shadow_type">none</property>
- <child>
- <!-- TODO: The top of the coverart is the same vertical -->
- <!-- position as the top of the album songs, however -->
- <!-- since we set a top margins for the discbox -->
- <!-- subtract that margin here. A cleaner solution is appreciated. -->
- <object class="DiscListBox" id="_disc_listbox">
- <property name="can_focus">False</property>
- <property name="margin_top">48</property>
- <property name="margin_bottom">64</property>
- <property name="margin_end">32</property>
- <property name="orientation">vertical</property>
- <property name="selection_mode_allowed">True</property>
- <property name="visible">True</property>
- <signal name="selection-changed" handler="_on_selection_changed" swapped="no"/>
- </object>
- </child>
+ <property name="orientation">vertical</property>
+ <property name="selection_mode_allowed">True</property>
+ <property name="visible">True</property>
+ <property name="width_request">600</property>
+ <signal name="selection-changed" handler="_on_selection_changed" swapped="no"/>
</object>
+ <packing>
+ <property name="expand">True</property>
+ <property name="fill">True</property>
+ <property name="position">2</property>
+ </packing>
</child>
</object>
- <packing>
- <property name="expand">True</property>
- <property name="fill">True</property>
- <property name="position">2</property>
- </packing>
</child>
</object>
</child>
diff --git a/gnomemusic/widgets/albumwidget.py b/gnomemusic/widgets/albumwidget.py
index ecdc2c93..1a0f66ab 100644
--- a/gnomemusic/widgets/albumwidget.py
+++ b/gnomemusic/widgets/albumwidget.py
@@ -45,6 +45,7 @@ class AlbumWidget(Gtk.EventBox):
__gtype_name__ = 'AlbumWidget'
+ _album_info = Gtk.Template.Child()
_artist_label = Gtk.Template.Child()
_composer_label = Gtk.Template.Child()
_composer_info_label = Gtk.Template.Child()
@@ -52,6 +53,7 @@ class AlbumWidget(Gtk.EventBox):
_disc_listbox = Gtk.Template.Child()
_released_info_label = Gtk.Template.Child()
_running_info_label = Gtk.Template.Child()
+ _scrolled_window = Gtk.Template.Child()
_title_label = Gtk.Template.Child()
selected_items_count = GObject.Property(type=int, default=0, minimum=0)
@@ -72,6 +74,8 @@ class AlbumWidget(Gtk.EventBox):
super().__init__()
self._songs = []
+ self._initial_margin_top = self._album_info.props.margin_top
+ self._album_info_height = 0
self._cover_stack.props.size = Art.Size.LARGE
self._parent_view = parent_view
@@ -93,6 +97,9 @@ class AlbumWidget(Gtk.EventBox):
self.bind_property(
'selected-items-count', self._parent_view, 'selected-items-count')
+ self._scrolled_window.props.vadjustment.connect(
+ "value-changed", self._on_scroll_value_changed)
+
@log
def _create_model(self):
"""Create the ListStore model for this widget."""
@@ -143,6 +150,8 @@ class AlbumWidget(Gtk.EventBox):
self._set_composer_label(album)
+ self._album_info.props.margin_top = self._initial_margin_top
+
self._player.connect('song-changed', self._update_model)
grilo.populate_album_songs(album, self.add_item)
@@ -280,3 +289,18 @@ class AlbumWidget(Gtk.EventBox):
:rtype: list
"""
return self._disc_listbox.get_selected_items()
+
+ @log
+ def _on_scroll_value_changed(self, adjustment):
+ self._album_info.props.margin_top = (adjustment.props.value
+ + self._initial_margin_top)
+
+ @Gtk.Template.Callback()
+ @log
+ def _on_album_info_size_changed(self, widget, allocation):
+ if allocation.height != self._album_info_height:
+ self._album_info_height = allocation.height
+ min_height = (allocation.height
+ + self._initial_margin_top
+ + self._album_info.props.margin_bottom)
+ self._scrolled_window.props.min_content_height = min_height
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]
