Merge lp:~teemperor/granite/table-view into lp:~elementary-pantheon/granite/granite

[Raphael Isemann]

We have quite a lot of implementations of widgets that do nothing more than displaying a list of items. A good example is the keyboard-plug which has at least 5 of those widgets and all those widgets are reimplemented from scratch.

This is especially annoying since on each review you have to recheck if the lists work correctly to figure out minor problems as seen here: https://code.launchpad.net/~julien-spautz/switchboard-plug-keyboard/custom-shortcuts/+merge/212343

This branch introduces a widget that displays a Gee.List and in a MVC-compatible way.

The advantages are:

* Better performance as we can fine-tune this widget to not fire item_changed events if they are not necessary.

* Less code and less time spent with testing list-implementations!

* Design-changes regarding lists can be implemented easier by just changing the code here in granite. This also allows that all third-party developers are automatically updated to the new design if they use this widget.

See the granite-demo under Static notebook -> "Table"-tab and look at stdout to see it in action.

[lp:~teemperor/granite/table-view]

806. By Raphael Isemann on 2014-11-02

We can now select items from the code

[xapantu (xapantu)]

Hum, in what way is that better than the classic MVC approach of a GtkListViem/GtkTreeView with a custom renderer?

review: Needs Information

Unmerged revisions

806. By Raphael Isemann on 2014-11-02

We can now select items from the code

805. By Raphael Isemann on 2014-11-02

Everything works as expected, but we are still firing too many item-changes

804. By Raphael Isemann on 2014-11-02

Implemented up-down (only for the underlying list)

803. By Raphael Isemann on 2014-11-01

We only accept lists now

802. By Raphael Isemann on 2014-11-01

First version of the new Table-class

=== modified file 'demo/GraniteDemo.vala'
--- demo/GraniteDemo.vala	2014-05-12 02:42:17 +0000
+++ demo/GraniteDemo.vala	2014-11-02 22:04:23 +0000
@@ -152,6 +152,22 @@
         }
     }
 
+    private class Person: GLib.Object, Granite.Widgets.Views.TableItem {
+
+        public string name { get; private set; }
+        public string address { get; private set; }
+
+        public Person(string name, string address) {
+            this.name = name;
+            this.address = address;
+        }
+
+        public string[] get_values () {
+            string[] result = {name, address};
+            return result;
+        }
+    }
+
     private Gtk.Grid main_layout; // outer-most container
     private Granite.Widgets.ModeButton mode_button;
     private int dark_mode_index;
@@ -283,6 +299,31 @@
         staticnotebook.append_page (get_overlay_bar_widget (), new Gtk.Label ("Overlay Bar"));
         staticnotebook.append_page (new Gtk.Label ("Page 3"), new Gtk.Label ("Page 3"));
 
+        var test_table = new Granite.Widgets.Views.Table (new string[] {"Person", "Address"});
+
+        var persons = new Gee.ArrayList<Person>();
+        persons.add (new Person("Dan", "elementary Headquarter"));
+        persons.add (new Person("Cody", "Launchpad"));
+        persons.add (new Person("Sergey", "In the forest"));
+
+        test_table.show_list (persons);
+        test_table.selected_item_changed.connect ((person) => {
+            print ((person as Person).name + " got selected!\n");
+        });
+
+        test_table.add_item_clicked.connect (() => {
+            test_table.append_item (
+                new Person(
+                    "New User" + Random.next_int ().to_string (),
+                    "Limbo"));
+        });
+
+        // Select cody
+        test_table.selected_item = persons.get (1);
+
+        staticnotebook.append_page (test_table, new Gtk.Label ("Table"));
+
+
         staticnotebook.page_changed.connect (() => {
             pageone.set_text ("Page changed");
         });
@@ -551,4 +592,4 @@
 
         return application.run (args);
     }
-}
+}
 \ No newline at end of file
 
=== modified file 'lib/CMakeLists.txt'
--- lib/CMakeLists.txt	2014-01-18 21:47:46 +0000
+++ lib/CMakeLists.txt	2014-11-02 22:04:23 +0000
@@ -19,6 +19,8 @@
     Services/ContractorProxy.vala
     Services/IconFactory.vala
     Services/SimpleCommand.vala
+    Views/Table.vala
+    Views/TableItem.vala
     Widgets/Utils.vala
     Widgets/WrapLabel.vala
     Widgets/AboutDialog.vala
 
=== added directory 'lib/Views'
=== added file 'lib/Views/Table.vala'
--- lib/Views/Table.vala	1970-01-01 00:00:00 +0000
+++ lib/Views/Table.vala	2014-11-02 22:04:23 +0000
@@ -0,0 +1,333 @@
+/***
+    Copyright (C) 2014 Raphael Isemann <[e-mail]>
+
+    This program or library is free software; you can redistribute it
+    and/or modify it under the terms of the GNU Lesser General Public
+    License as published by the Free Software Foundation; either
+    version 3 of the License, or (at your option) any later version.
+
+    This library is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+    Lesser General Public License for more details.
+
+    You should have received a copy of the GNU Lesser General
+    Public License along with this library; if not, write to the
+    Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor,
+    Boston, MA 02110-1301 USA.
+***/
+
+using Gtk;
+using Gdk;
+
+namespace Granite.Widgets.Views {
+
+    public class Table : Gtk.Grid {
+
+        public signal void selected_item_changed (TableItem selected);
+        public signal void add_item_clicked ();
+
+        bool _allows_remove = true;
+        public bool allows_remove {
+            get {
+                return _allows_remove;
+            }
+            set {
+                _allows_remove = value;
+                if (value) {
+                    remove_button.show_all ();
+                } else {
+                    remove_button.hide ();
+                }
+                update_toolbar_visibility ();
+            }
+        }
+
+
+        bool _allows_add = true;
+        public bool allows_add {
+            get {
+                return _allows_add;
+            }
+            set {
+                _allows_add = value;
+                if (value) {
+                    add_button.show_all ();
+                } else {
+                    add_button.hide ();
+                }
+                update_toolbar_visibility ();
+            }
+        }
+
+        bool _allows_reordering = true;
+        public bool allows_reordering {
+            get {
+                return _allows_reordering;
+            }
+            set {
+                _allows_reordering = value;
+                if (value) {
+                    up_button.show_all ();
+                    down_button.show_all ();
+                } else {
+                    up_button.hide ();
+                    down_button.hide ();
+                }
+                update_toolbar_visibility ();
+            }
+        }
+
+        TableItem? _selected_item = null;
+        public TableItem? selected_item {
+            get {
+                return selected_item;
+            }
+            set {
+                _selected_item = null;
+                for (int i = 0; i < item_list.size; i++) {
+                    if (item_list.get (i) == value) {
+                        select (i);
+                        break;
+                    }
+                }
+            }
+        }
+
+        Gtk.TreeView tree_view;
+        ListStore list_model;
+        Type[] column_types;
+        int columns;
+
+        Gee.List<TableItem> item_list;
+
+        // true if we are currently in progress of changing the internal list
+        // This is necessary to prevent multiple
+        bool list_is_changing = false;
+
+        Gtk.Toolbar toolbar;
+        Gtk.ToolButton up_button;
+        Gtk.ToolButton down_button;
+        Gtk.ToolButton add_button;
+        Gtk.ToolButton remove_button;
+
+        public Table(string[] headers) {
+            tree_view = new Gtk.TreeView ();
+            columns = headers.length;
+            column_types = {};
+
+            foreach (var header in headers) {
+                column_types += typeof (string);
+            }
+
+            list_model = new ListStore.newv(column_types);
+            tree_view.set_model (list_model);
+
+            tree_view.cursor_changed.connect (cursor_changed_handler);
+
+            int attr_index = 0;
+            foreach (string header in headers) {
+                Gtk.CellRendererText cell = new Gtk.CellRendererText ();
+                tree_view.insert_column_with_attributes (-1, headers[attr_index], cell,
+                        "text", attr_index);
+                attr_index++;
+            }
+
+            var scroll = new Gtk.ScrolledWindow(null, null);
+            scroll.hscrollbar_policy = Gtk.PolicyType.AUTOMATIC;
+            scroll.vscrollbar_policy = Gtk.PolicyType.AUTOMATIC;
+            scroll.shadow_type = Gtk.ShadowType.IN;
+            scroll.add (tree_view);
+            scroll.expand = true;
+
+            var toolbar = new Gtk.Toolbar();
+            toolbar.set_style(Gtk.ToolbarStyle.ICONS);
+            toolbar.set_icon_size(Gtk.IconSize.SMALL_TOOLBAR);
+            toolbar.set_show_arrow(false);
+            toolbar.hexpand = true;
+
+            scroll.get_style_context().set_junction_sides(Gtk.JunctionSides.BOTTOM);
+            toolbar.get_style_context().add_class(Gtk.STYLE_CLASS_INLINE_TOOLBAR);
+            toolbar.get_style_context().set_junction_sides(Gtk.JunctionSides.TOP);
+
+            add_button    = new Gtk.ToolButton (null, _("Add…"));
+            remove_button = new Gtk.ToolButton (null, _("Remove"));
+            up_button     = new Gtk.ToolButton (null, _("Move up"));
+            down_button   = new Gtk.ToolButton (null, _("Move down"));
+
+            add_button.set_tooltip_text    (_("Add…"));
+            remove_button.set_tooltip_text (_("Remove"));
+            up_button.set_tooltip_text     (_("Move up"));
+            down_button.set_tooltip_text   (_("Move down"));
+
+            add_button.set_icon_name    ("list-add-symbolic");
+            remove_button.set_icon_name ("list-remove-symbolic");
+            up_button.set_icon_name     ("go-up-symbolic");
+            down_button.set_icon_name   ("go-down-symbolic");
+
+            up_button.sensitive = false;
+            down_button.sensitive = false;
+            remove_button.sensitive = false;
+
+            add_button.clicked.connect (() => {
+                add_item_clicked ();
+            });
+            remove_button.clicked.connect (remove_selected);
+            up_button.clicked.connect (up_pressed);
+            down_button.clicked.connect (down_pressed);
+
+            toolbar.insert (add_button,    -1);
+            toolbar.insert (remove_button, -1);
+            toolbar.insert (up_button,     -1);
+            toolbar.insert (down_button,   -1);
+
+            this.attach (scroll, 0, 0, 1, 1);
+            this.attach (toolbar, 0, 1, 1, 1);
+        }
+
+        void fire_item_selected (TableItem item) {
+            if (!list_is_changing) {
+                _selected_item = item;
+                selected_item_changed (item);
+            }
+        }
+
+        void select (int index) {
+            var path = new TreePath.from_indices (index);
+            tree_view.set_cursor (path, null, false);
+        }
+
+        void remove_item (int index) {
+            item_list.remove_at (index);
+            list_model.remove (get_nth_iter (index));
+            select (index - 1);
+
+            if (item_list.size == 0) {
+                _selected_item = null;
+            }
+        }
+
+        void insert_item (int index, TableItem item) {
+            item_list.insert (index, item);
+            TreeIter iter;
+            list_model.insert_before (out iter, get_nth_iter (index));
+            fill_out_iter (iter, item);
+            select (index);
+        }
+
+        void fill_out_iter (TreeIter iter, TableItem item) {
+            var values = item.get_values ();
+            for (int column = 0; column < columns; column++) {
+                list_model.set (iter, column, values[column]);
+            }
+        }
+
+        TreeIter? get_nth_iter (int index) {
+            var path = new TreePath.from_indices (index);
+            TreeIter iter;
+            if (list_model.get_iter (out iter, path)) {
+                return iter;
+            }
+            return null;
+        }
+
+        void remove_selected () {
+            int index = get_current_index ();
+            if (index != -1) {
+                item_list.remove_at (get_current_index ());
+                list_model.remove (get_current_iter ());
+            }
+        }
+
+        void internal_append_item (TableItem item) {
+            Gtk.TreeIter iter;
+            list_model.append (out iter);
+            fill_out_iter (iter, item);
+        }
+
+        void cursor_changed_handler () {
+            int index = get_current_index ();
+
+            remove_button.sensitive = (index != -1);
+
+            if (index != -1) {
+                up_button.sensitive = true;
+                down_button.sensitive = true;
+                if (index == 0) {
+                    up_button.sensitive = false;
+                }
+                if (index == item_list.size - 1) {
+                    down_button.sensitive = false;
+                }
+                fire_item_selected (item_list.get (index));
+            }
+        }
+
+        void up_pressed () {
+            list_is_changing = true;
+            int index = get_current_index ();
+            var item = item_list[index];
+            remove_item (index);
+            insert_item (index - 1, item);
+            list_is_changing = false;
+        }
+
+        void down_pressed () {
+            list_is_changing = true;
+            int index = get_current_index ();
+            var item = item_list[index];
+            remove_item (index);
+            insert_item (index + 1, item);
+            list_is_changing = false;
+        }
+
+
+        TreeIter? get_current_iter () {
+            Gtk.TreePath current_path;
+            tree_view.get_cursor (out current_path, null);
+
+            TreeIter iter;
+            if (list_model.get_iter (out iter, current_path)) {
+                return iter;
+            }
+            return null;
+        }
+
+        int get_current_index () {
+            Gtk.TreePath path;
+
+            tree_view.get_cursor (out path, null);
+
+            if (path != null)
+            {
+                return (path.get_indices ())[0];
+            }
+            return -1;
+        }
+
+        void update_toolbar_visibility () {
+            if (!allows_add && !allows_remove && !allows_reordering) {
+                toolbar.hide ();
+            } else {
+                toolbar.show ();
+            }
+        }
+
+        public void append_item (TableItem item) {
+            internal_append_item (item);
+            item_list.add (item);
+        }
+
+        public void show_list (Gee.List<TableItem> items) {
+            item_list = items;
+
+            list_model = new ListStore.newv(column_types);
+            tree_view.set_model (list_model);
+
+            foreach (var item in items) {
+                internal_append_item (item);
+            }
+        }
+
+    }
+}
 \ No newline at end of file
 
=== added file 'lib/Views/TableItem.vala'
--- lib/Views/TableItem.vala	1970-01-01 00:00:00 +0000
+++ lib/Views/TableItem.vala	2014-11-02 22:04:23 +0000
@@ -0,0 +1,30 @@
+/***
+    Copyright (C) 2014 Raphael Isemann <[e-mail]>
+
+    This program or library is free software; you can redistribute it
+    and/or modify it under the terms of the GNU Lesser General Public
+    License as published by the Free Software Foundation; either
+    version 3 of the License, or (at your option) any later version.
+
+    This library is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+    Lesser General Public License for more details.
+
+    You should have received a copy of the GNU Lesser General
+    Public License along with this library; if not, write to the
+    Free Software Foundation, Inc., 51 Franklin Street, Fifth Floor,
+    Boston, MA 02110-1301 USA.
+***/
+
+using Gtk;
+using Gdk;
+
+namespace Granite.Widgets.Views {
+
+    public interface TableItem : GLib.Object {
+
+        public abstract string[] get_values ();
+
+    }
+}
 \ No newline at end of file