[view] fixes

demo/src/demo/Demo.hx

@@ -6,30 +6,37 @@ import demo.popup.FontPopup;
 import haxework.App;
 import haxework.log.TraceLogger;
 import haxework.net.JsonLoader;
-import haxework.view.form.ToggleButtonView;
+import haxework.view.data.ButtonGroup;
 import haxework.view.frame.FrameSwitcher;
-import haxework.view.group.IGroupView;
+import haxework.view.frame.FrameView;
 import haxework.view.group.VGroupView;
-import haxework.view.IView;
 
 @:template class DemoView extends VGroupView {
     @:view var switcher:FrameSwitcher;
-    @:view var tabs:IGroupView;
+    @:view var tabs:ButtonGroup<String>;
 
     private function init():Void {
-        switcher.change("test_layout");
+        switcher.change("tail");
     }
 
-    private function onFrameSwitch(frame:IView<Dynamic>):Void {
-        for (view in tabs.views) cast(view, ToggleButtonView).on = view.id == frame.id;
+    private function onFrameSwitch(frame:FrameView<Dynamic>):Void {
+        tabs.selected = frame.frameId;
     }
 
     private function choiceColor():Void {
-        new ColorPopup().show().then(function(color) theme.colors = {light: color});
+        new ColorPopup().show().then(function(color) {
+            if (color != null) {
+                theme.colors = {light: color};
+            }
+        });
     }
 
     private function choiceFont():Void {
-        new FontPopup().show().then(function(font) theme.font = font);
+        new FontPopup().show().then(function(font) {
+            if (font != null) {
+                theme.font = font;
+            }
+        });
     }
 }
 

demo/src/demo/DemoView.yaml

@@ -10,7 +10,7 @@ views:
       layout.hAlign: left
       geometry.width: 100%
       geometry.padding.left: 5
-      geometry.margin.bottom: -3
+      geometry.margin.bottom: -6
       buttonStyle: tab
       +onDataSelect: ~function(id) switcher.change(id)
       data:
@@ -19,7 +19,6 @@ views:
         - "data"
         - "test_layout"
         - "select"
-      selected: "list"
     - id: switcher
       $type: haxework.view.frame.FrameSwitcher
       animateFactory: { $class: haxework.animate.SlideAnimate }

demo/src/demo/form/TailForm.hx

@@ -17,7 +17,7 @@ import haxework.view.utils.DrawUtil;
         if (value.image != null) {
             var imageView = new ImageView();
             imageView.stretch = false;
-            imageView.style = "border";
+            //imageView.style = "border";
             imageView.fillType = FillType.CONTAIN;
             imageView.imageUrl = value.image.url;
             view = imageView;

demo/src/demo/form/TailForm.yaml

@@ -7,7 +7,7 @@ views:
             $type: haxework.view.data.DataView
             layout:
                 $type: haxework.view.layout.TailLayout
-                margin: 2
+                margin: 4
             factory: ~factory
             geometry.width: 100%
             data: $r:any:data

demo/src/demo/popup/ColorPopup.hx

@@ -4,7 +4,7 @@ import haxework.view.form.ButtonView;
 import haxework.view.popup.PopupView;
 import haxework.view.skin.Skin;
 
-@:template class ColorPopup extends PopupView<Int> {
+@:template class ColorPopup extends PopupView<Null<Int>> {
 
     private function colorViewFactory(index:Int, color:Int) {
         var view = new ButtonView();