[geary: 3/4] folder-list: mordernize sidebar
- From: Michael Gratton <mjog src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [geary: 3/4] folder-list: mordernize sidebar
- Date: Thu, 7 Jan 2021 22:29:07 +0000 (UTC)
commit 8aa5f291e8941c81cb9bfabf3bbad009b96527f9
Author: Julian Sparber <julian sparber net>
Date: Mon Nov 23 17:48:19 2020 +0100
folder-list: mordernize sidebar
This makes each row a better click target and improves spacing in
general. This move the expander arrow to the left and removes the
indentation for folders which makes it possible to define a much
smaller width for the sidebar.
Fixes: https://gitlab.gnome.org/GNOME/geary/-/issues/880,
https://gitlab.gnome.org/GNOME/geary/-/issues/1029
src/client/meson.build | 1 +
src/client/sidebar/sidebar-expander-renderer.vala | 38 +++++++++++++++++++
src/client/sidebar/sidebar-tree.vala | 45 ++++++++++++++---------
ui/application-main-window.ui | 1 -
ui/geary.css | 10 ++++-
5 files changed, 76 insertions(+), 19 deletions(-)
---
diff --git a/src/client/meson.build b/src/client/meson.build
index 4efadc6de..f536a86ca 100644
--- a/src/client/meson.build
+++ b/src/client/meson.build
@@ -137,6 +137,7 @@ client_vala_sources = files(
'sidebar/sidebar-common.vala',
'sidebar/sidebar-count-cell-renderer.vala',
'sidebar/sidebar-entry.vala',
+ 'sidebar/sidebar-expander-renderer.vala',
'sidebar/sidebar-tree.vala',
'util/util-avatar.vala',
diff --git a/src/client/sidebar/sidebar-expander-renderer.vala
b/src/client/sidebar/sidebar-expander-renderer.vala
new file mode 100644
index 000000000..a13beb485
--- /dev/null
+++ b/src/client/sidebar/sidebar-expander-renderer.vala
@@ -0,0 +1,38 @@
+/* Copyright © 2020 Purism SPC
+ *
+ * This software is licensed under the GNU Lesser General Public License
+ * (version 2.1 or later). See the COPYING file in this distribution.
+ */
+
+/**
+ * Cell renderer for the expander in the sidebar.
+ */
+public class SidebarExpanderRenderer : Gtk.CellRendererPixbuf {
+ public signal void toggle(Gtk.TreePath path);
+ public weak Gtk.Widget widget { get; set; }
+ public SidebarExpanderRenderer(Gtk.Widget widget) {
+ this.widget = widget;
+ xalign = 1;
+ mode = Gtk.CellRendererMode.ACTIVATABLE;
+ notify["is-expanded"].connect (update_arrow);
+ update_arrow();
+ }
+
+ private void update_arrow() {
+ if (is_expanded)
+ this.icon_name = "go-down-symbolic";
+ else
+ this.icon_name = "go-next-symbolic";
+ }
+
+ public override bool activate (Gdk.Event event,
+ Gtk.Widget widget,
+ string path,
+ Gdk.Rectangle background_area,
+ Gdk.Rectangle cell_area,
+ Gtk.CellRendererState flags) {
+ toggle(new Gtk.TreePath.from_string (path));
+ return true;
+ }
+}
+
diff --git a/src/client/sidebar/sidebar-tree.vala b/src/client/sidebar/sidebar-tree.vala
index 5434aa34c..90db9bbd4 100644
--- a/src/client/sidebar/sidebar-tree.vala
+++ b/src/client/sidebar/sidebar-tree.vala
@@ -62,6 +62,7 @@ public class Sidebar.Tree : Gtk.TreeView {
);
private Gtk.IconTheme? icon_theme;
+ private Gtk.TreeViewColumn text_column;
private Gtk.CellRendererText text_renderer;
private unowned ExternalDropHandler drop_handler;
private Gtk.Entry? text_entry = null;
@@ -94,7 +95,7 @@ public class Sidebar.Tree : Gtk.TreeView {
icon_theme = theme;
get_style_context().add_class("sidebar");
- Gtk.TreeViewColumn text_column = new Gtk.TreeViewColumn();
+ text_column = new Gtk.TreeViewColumn();
text_column.set_expand(true);
Gtk.CellRendererPixbuf icon_renderer = new Gtk.CellRendererPixbuf();
text_column.pack_start(icon_renderer, false);
@@ -109,16 +110,23 @@ public class Sidebar.Tree : Gtk.TreeView {
append_column(text_column);
// Count column.
- Gtk.TreeViewColumn count_column = new Gtk.TreeViewColumn();
+ Gtk.TreeViewColumn end_column = new Gtk.TreeViewColumn();
SidebarCountCellRenderer unread_renderer = new SidebarCountCellRenderer();
- count_column.pack_start(unread_renderer, false);
- count_column.add_attribute(unread_renderer, "counter", Columns.COUNTER);
- append_column(count_column);
+ end_column.set_cell_data_func(unread_renderer, counter_renderer_function);
+ end_column.pack_start(unread_renderer, false);
+ end_column.add_attribute(unread_renderer, "counter", Columns.COUNTER);
+
+ // Expander arrows.
+ SidebarExpanderRenderer expander_renderer = new SidebarExpanderRenderer(this);
+ expander_renderer.toggle.connect(toggle_branch_expansion);
+ end_column.set_cell_data_func(expander_renderer, expander_renderer_function);
+ end_column.pack_start(expander_renderer, false);
+ append_column(end_column);
set_headers_visible(false);
set_enable_search(false);
set_search_column(-1);
- set_show_expanders(true);
+ set_show_expanders(false);
set_reorderable(false);
set_enable_tree_lines(false);
set_grid_lines(Gtk.TreeViewGridLines.NONE);
@@ -163,12 +171,17 @@ public class Sidebar.Tree : Gtk.TreeView {
renderer.visible = !(wrapper.entry is Sidebar.Header);
}
+ public void expander_renderer_function(Gtk.CellLayout layout, Gtk.CellRenderer renderer, Gtk.TreeModel
model, Gtk.TreeIter iter) {
+ renderer.visible = renderer.is_expander;
+ }
+
public void counter_renderer_function(Gtk.CellLayout layout, Gtk.CellRenderer renderer, Gtk.TreeModel
model, Gtk.TreeIter iter) {
EntryWrapper? wrapper = get_wrapper_at_iter(iter);
if (wrapper == null) {
return;
}
- renderer.visible = !(wrapper.entry is Sidebar.Header);
+ var counter_renderer = renderer as SidebarCountCellRenderer;
+ renderer.visible = counter_renderer != null && counter_renderer.counter > 0;
}
private void on_drag_begin(Gdk.DragContext ctx) {
@@ -296,11 +309,16 @@ public class Sidebar.Tree : Gtk.TreeView {
}
public override void row_activated(Gtk.TreePath path, Gtk.TreeViewColumn column) {
+ if (column != text_column)
+ return;
+
EntryWrapper? wrapper = get_wrapper_at_path(path);
if (wrapper != null) {
Sidebar.SelectableEntry? selectable = wrapper.entry as Sidebar.SelectableEntry;
if (selectable != null)
entry_activated(selectable);
+ else
+ toggle_branch_expansion (path);
}
}
@@ -352,11 +370,11 @@ public class Sidebar.Tree : Gtk.TreeView {
}
}
- public void toggle_branch_expansion(Gtk.TreePath path, bool expand_all) {
+ private void toggle_branch_expansion(Gtk.TreePath path) {
if (is_row_expanded(path))
collapse_row(path);
else
- expand_row(path, expand_all);
+ expand_row(path, false);
}
public bool expand_to_entry(Sidebar.Entry entry) {
@@ -823,13 +841,6 @@ public class Sidebar.Tree : Gtk.TreeView {
return base.button_press_event(event);
}
- // Enable single click to toggle tree entries (bug 4985)
- if (wrapper.entry is Sidebar.ExpandableEntry
- || wrapper.entry is Sidebar.InternalDropTargetEntry) {
- // all labels are InternalDropTargetEntries
- toggle_branch_expansion(path, false);
- }
-
// Is this a click on an already-highlighted tree item?
if ((old_path_ref != null) && (old_path_ref.get_path() != null)
&& (old_path_ref.get_path().compare(path) == 0)) {
@@ -872,7 +883,7 @@ public class Sidebar.Tree : Gtk.TreeView {
case "KP_Enter":
Gtk.TreePath? path = get_current_path();
if (path != null)
- toggle_branch_expansion(path, false);
+ toggle_branch_expansion(path);
return true;
diff --git a/ui/application-main-window.ui b/ui/application-main-window.ui
index 547b063ff..a62ad616c 100644
--- a/ui/application-main-window.ui
+++ b/ui/application-main-window.ui
@@ -52,7 +52,6 @@
<property name="shadow_type">in</property>
<child>
<object class="GtkScrolledWindow" id="folder_list_scrolled">
- <property name="width_request">100</property>
<property name="visible">True</property>
<property name="can_focus">True</property>
<property name="hscrollbar_policy">never</property>
diff --git a/ui/geary.css b/ui/geary.css
index 2d1d48c31..66925c477 100644
--- a/ui/geary.css
+++ b/ui/geary.css
@@ -12,8 +12,16 @@
border-left-width: 0;
border-top-width: 0;
border-right-width: 0;
- min-width: 300px;
}
+
+.geary-folder-frame {
+ min-width: 250px;
+}
+
+.geary-folder-frame .sidebar .cell {
+ padding: 9px 6px;
+}
+
.geary-conversation-frame > border {
border-left-width: 0;
border-top-width: 0;
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]