Add treeview to edit properties

Author: albfan

com.github.akiraux.libgtkcanvas.json

@@ -79,7 +79,7 @@
          "sources": [
             {
                "type": "git",
-               "url": "https://github.com/albfan/libgtkcanvas",
+               "url": "https://github.com/akiraux/libgtkcanvas",
                "branch": "wip/albfan/action-buttons"
             }
          ]

demo/Window.vala

@@ -19,6 +19,46 @@
 * Authored by: Felipe Escoto <felescoto95@hotmail.com>
 */
 
+Gtk.TreeStore tree_store;
+Gtk.TreeView tree_view;
+GSvg.GsDocument svg;
+GSvgtk.ActorClutter actorSVG;
+
+void show_attribute(GXml.DomElement element, string attr_name, Gtk.TreeIter? parentIter) {
+  Gtk.TreeIter childIter;
+  var value = element.get_attribute(attr_name);
+  if (value != null) {
+  //if (element.has_attribute(attr_name)) {
+    tree_store.append (out childIter, parentIter);
+    tree_store.set (childIter, 0, attr_name, 1, value, 2, element, -1);
+  }
+}
+
+void list_childs(GXml.DomNode node, Gtk.TreeIter? parentIter) {
+
+  foreach (GXml.DomNode child in node.child_nodes) {
+    Gtk.TreeIter? childIter = parentIter;
+    if (child is GXml.DomElement) {
+      tree_store.append (out childIter, parentIter);
+      tree_store.set (childIter, 0, child.node_name, -1);
+
+      var element = child as GXml.DomElement;
+      Gtk.TreeIter attrIter;
+      tree_store.append (out attrIter, childIter);
+      tree_store.set (attrIter, 0, "attributes", -1);
+      //foreach (var entry in element.attributes.entries()) {
+      foreach (var param in element.get_class().list_properties()) {
+        //var key = entry.key;
+        var key = param.get_nick();
+        show_attribute(element, key, attrIter);
+      }
+      show_attribute(element, "style", attrIter);
+      show_attribute(element, "id", attrIter);
+    }
+    list_childs(child, childIter);
+  }
+}
+
 int main (string argv[]) {
     GtkClutter.init (ref argv);
 
@@ -29,6 +69,8 @@ int main (string argv[]) {
 
     var canvas = new Gcav.Canvas (600, 400);
 
+    canvas.set_size_request(600, 400);
+
     canvas.clicked.connect ((modifier) => {
         canvas.resizer.visible = false;
     });
@@ -102,44 +144,71 @@ int main (string argv[]) {
         chooser.close ();
 
         if (chooser.get_file () != null) {
-          string contents;
           var file_choosed = chooser.get_file();
-          GLib.FileUtils.get_contents(file_choosed.get_path(), out contents, null);
-          var actor = canvas.add_shape ("svg", "red", 0.0);
-          (actor as GSvgtk.ActorClutter).set_svg_string(contents);
-          // Example on how you can add an animation
-          actor.set_pivot_point (0.5f, 0.5f);
-          actor.set_scale (0.01f, 0.01f);
-          actor.opacity = 0;
-
-          actor.save_easing_state ();
-          actor.set_easing_mode (Clutter.AnimationMode.EASE_OUT_EXPO);
-          actor.set_easing_duration (200);
-          actor.set_scale (1.0f, 1.0f);
-          actor.opacity = 255U;
-          actor.restore_easing_state ();
+          try {
+            svg = new GSvg.GsDocument ();
+            svg.read_from_file (file_choosed);
+            list_childs(svg, null);
+            tree_view.expand_all();
+            actorSVG = canvas.add_shape ("svg", "red", 0.0) as GSvgtk.ActorClutter;
+            actorSVG.svg = svg;
+            // Example on how you can add an animation
+            actorSVG.set_pivot_point (0.5f, 0.5f);
+            actorSVG.set_scale (0.01f, 0.01f);
+            actorSVG.opacity = 0;
+
+            actorSVG.save_easing_state ();
+            actorSVG.set_easing_mode (Clutter.AnimationMode.EASE_OUT_EXPO);
+            actorSVG.set_easing_duration (200);
+            actorSVG.set_scale (1.0f, 1.0f);
+            actorSVG.opacity = 255U;
+            actorSVG.restore_easing_state ();
+          } catch( Error e) {
+          }
         }
-
     });
     testing_grid.add (canvas_label);
     testing_grid.add (width);
     testing_grid.add (height);
     testing_grid.add (new_shape);
     testing_grid.add (new_circle);
     testing_grid.add (new_svg);
+    tree_view = new Gtk.TreeView();
+    tree_view.expand = true;
+    tree_store = new Gtk.TreeStore(3, typeof(string), typeof(string), typeof(GXml.DomElement));
+    tree_view.set_model(tree_store);
+    tree_view.insert_column_with_attributes(-1, "Type", new Gtk.CellRendererText(), "text", 0, null);
+    var renderer = new Gtk.CellRendererText();
+    renderer.editable = true;
+    renderer.edited.connect ((path, new_text) => {
+      Gtk.TreeIter iter;
+      if (tree_store.get_iter_from_string (out iter, path)) {
+         Value value;
+         tree_store.get_value(iter, 2, out value);
+         GXml.DomElement element = value.get_object() as GXml.DomElement;
+         tree_store.get_value(iter, 0, out value);
+         var attr_name = value.get_string();
+         try {
+           element.set_attribute(attr_name, new_text);
+         } catch (Error e) {
+         }
+         tree_store.set_value(iter, 1, new_text);
+
+         actorSVG.svg = svg;
+      }
+    });
+    tree_view.insert_column_with_attributes(-1, "Name", renderer, "text", 1, null);
+    var scroll = new Gtk.ScrolledWindow (null, null);
+    scroll.set_policy (Gtk.PolicyType.AUTOMATIC, Gtk.PolicyType.AUTOMATIC);
+    scroll.add (tree_view);
+    testing_grid.add (scroll);
 
-    var main_grid = new Gtk.Grid ();
-    main_grid.margin = 6;
-    main_grid.column_spacing = 6;
-    main_grid.orientation = Gtk.Orientation.HORIZONTAL;
-
-    var separator = new Gtk.Separator (Gtk.Orientation.VERTICAL);
+    var paned = new Gtk.Paned (Gtk.Orientation.HORIZONTAL);
 
-    main_grid.add (canvas);
-    main_grid.add (separator);
-    main_grid.add (testing_grid);
+    paned.add1(canvas);
+    paned.add2(testing_grid);
 
-    window.add (main_grid);
+    window.add (paned);
 
     window.destroy.connect (Gtk.main_quit);
     window.show_all ();