[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();

src/main/haxework/view/list/LabelListItem.hx

@@ -18,6 +18,7 @@ class LabelListItem<T> extends LabelView implements IListItemView<T> {
 
     public function new(formatter:Formatter<T> = null) {
         super();
+        textField.wordWrap = true;
         this.formatter = formatter == null ? defaultFormatter : formatter;
         geometry.width.percent = 100;
         geometry.height.fixed = 20;

src/main/haxework/view/skin/TabColorSkin.hx

@@ -18,5 +18,7 @@ class TabColorSkin extends ButtonColorSkin {
         graphics.beginFill(color, 1.0);
         graphics.lineStyle(2, ColorUtil.multiply(color, 1.5));
         graphics.drawRoundRectComplex(1, 1, view.width - 2, view.height - 2, 5, 5, 0, 0);
+        graphics.lineStyle();
+        graphics.endFill();
     }
 }

src/main/haxework/view/text/FontPreset.hx

@@ -18,6 +18,6 @@ class FontPreset {
         this.color = color != null ? color : 0xffffff;
         this.size = size;
         this.bold = bold;
-        this.align = align;
+        this.align = align != null ? align : TextFormatAlign.LEFT;
     }
 }

src/main/haxework/view/text/TextView.hx

@@ -31,8 +31,8 @@ class TextView extends SpriteView implements ITextView {
         style = "text";
         layout = new Layout();
         textField = buildTextField();
-        textField.width = 1;
-        textField.height = 1;
+        textField.width = 100;
+        textField.height = 100;
         textField.multiline = true;
         textField.wordWrap = true;
         #if dev_layout
@@ -77,13 +77,21 @@ class TextView extends SpriteView implements ITextView {
     private function updateTextSize():Void {
         var size = TextUtil.getSize(textField);
         if (!Math.isNaN(size.x) && !Math.isNaN(size.y)/* && size.x > 0 && size.y > 0*/) {
-            setSize(size.x, size.y, "text");
+            setSize(textField.wordWrap ? 0 : size.x, size.y, "text");
         }
     }
 
     override public function update():Void {
+        //Kludge
+        if (textField.wordWrap && width - geometry.padding.horizontal == 0) {
+            return;
+        }
         textField.embedFonts = font.embed;
-        textField.defaultTextFormat = new TextFormat(font.family, font.size, font.color, font.bold);
+        textField.defaultTextFormat = new TextFormat(
+        font.family, font.size, font.color,
+        font.bold, false, false, null,
+        font.align
+        );
         textField.autoSize = fill ? TextFieldAutoSize.NONE : TextFieldAutoSize.LEFT;
         var t:String = currentText();
         if (t != null) textField.text = t;
@@ -102,7 +110,8 @@ class TextView extends SpriteView implements ITextView {
 
     private function placeTextField(textField:TextField):Void {
         textField.width = width;
-        textField.height = height;  // ToDo:
+        textField.height = sizeSet.exists("text") ? sizeSet.get("text").height : height;
+        //textField.height = height;
 
         textField.x = switch (layout.hAlign) {
             case LEFT | NONE: geometry.padding.left;