diff --git a/demo/src/demo/Demo.hx b/demo/src/demo/Demo.hx index 1078d2d..146a858 100644 --- a/demo/src/demo/Demo.hx +++ b/demo/src/demo/Demo.hx @@ -16,7 +16,7 @@ import haxework.view.group.VGroupView; @:view var tabs:ButtonGroup; private function init():Void { - switcher.change("tail"); + switcher.change("list"); } private function onFrameSwitch(frame:FrameView):Void { diff --git a/demo/src/demo/DemoView.yaml b/demo/src/demo/DemoView.yaml index 2c4403a..3ff6442 100644 --- a/demo/src/demo/DemoView.yaml +++ b/demo/src/demo/DemoView.yaml @@ -11,7 +11,7 @@ views: geometry.width: 100% geometry.padding.left: 5 geometry.margin.bottom: -6 - buttonStyle: tab + buttonStyle: button.tab +onDataSelect: ~function(id) switcher.change(id) data: - "list" diff --git a/src/main/haxework/view/View.hx b/src/main/haxework/view/View.hx index 5644219..5707bc0 100755 --- a/src/main/haxework/view/View.hx +++ b/src/main/haxework/view/View.hx @@ -74,7 +74,11 @@ class View implements IView { } public function update():Void { - setSize(geometry.width.fixed, geometry.height.fixed, "geometry"); + setSize( + geometry.width.fixed - geometry.padding.horizontal, + geometry.height.fixed - geometry.padding.vertical, + "geometry" + ); } public function redraw():Void { diff --git a/src/main/haxework/view/frame/FrameSwitcher.hx b/src/main/haxework/view/frame/FrameSwitcher.hx index f3323b0..47e4cde 100755 --- a/src/main/haxework/view/frame/FrameSwitcher.hx +++ b/src/main/haxework/view/frame/FrameSwitcher.hx @@ -57,7 +57,7 @@ class FrameSwitcher extends GroupView { } addView(current); toUpdate(); - //update(); + update(); //ToDo: if (content.stage != null) { content.stage.focus = current.content; diff --git a/src/main/haxework/view/skin/ButtonColorSkin.hx b/src/main/haxework/view/skin/ButtonColorSkin.hx index 87a7374..fd71181 100644 --- a/src/main/haxework/view/skin/ButtonColorSkin.hx +++ b/src/main/haxework/view/skin/ButtonColorSkin.hx @@ -4,29 +4,31 @@ import flash.display.CapsStyle; import flash.display.Graphics; import flash.display.JointStyle; import flash.display.LineScaleMode; -import haxework.color.ColorUtil; +import haxework.color.Color; import haxework.view.form.ButtonView; import haxework.view.form.ToggleButtonView; +using haxework.color.ColorUtil; + class ButtonColorSkin implements ISkin { - public var color(default, default):Int; - public var borderColor(default, default):Int; + public var color(default, default):Color; + public var borderColor(default, default):Null; public var round(default, default):Float; private var colors:Map; - public function new(color:Int = 0xffffff, borderColor:Int = -1, round:Float = 15) { - this.color = color; + public function new(?color:Color, ?borderColor:Color, round:Float = 15) { + this.color = color != null ? color : 0xffffff; this.borderColor = borderColor; this.round = round; } public function draw(view:ButtonView):Void { - var color:Int = stateColor(color, view.state); - var borderColor:Int = borderColor > -1 ? borderColor : ColorUtil.multiply(color, 1.5); + var color:Color = stateColor(color, view.state); + var borderColor:Color = borderColor != null ? borderColor : color.multiply(1.5); if (Std.is(view, ToggleButtonView)) { if (!cast(view, ToggleButtonView).on) { - color = ColorUtil.multiply(color, 0.5); + color = color.multiply(0.5); } } var graphics:Graphics = view.content.graphics; @@ -37,12 +39,12 @@ class ButtonColorSkin implements ISkin { graphics.endFill(); } - private static function stateColor(color:Int, state:ButtonState):Int { + private static function stateColor(color:Color, state:ButtonState):Color { return switch state { case UP: color; - case DOWN: ColorUtil.diff(color, -24); - case OVER: ColorUtil.diff(color, 24); - case DISABLED: ColorUtil.multiply(color, 0.6); + case DOWN: color.diff(-24); + case OVER: color.diff(24); + case DISABLED: color.multiply(0.6); } } } diff --git a/src/main/haxework/view/skin/Skin.hx b/src/main/haxework/view/skin/Skin.hx index db7d396..fc06a5a 100644 --- a/src/main/haxework/view/skin/Skin.hx +++ b/src/main/haxework/view/skin/Skin.hx @@ -1,6 +1,7 @@ package haxework.view.skin; import flash.display.BitmapData; +import haxework.color.Color; import haxework.view.form.ButtonView; import haxework.view.utils.DrawUtil; @@ -16,7 +17,7 @@ class Skin { return new SpriteSkin({color: color, alpha: alpha}); } - public static function buttonColor(color:Int, borderColor:Int = -1):ISkin { + public static function buttonColor(color:Color, ?borderColor:Color):ISkin { return new ButtonColorSkin(color, borderColor); } diff --git a/src/main/haxework/view/text/FontPreset.hx b/src/main/haxework/view/text/FontPreset.hx index b32c595..4a1c31e 100644 --- a/src/main/haxework/view/text/FontPreset.hx +++ b/src/main/haxework/view/text/FontPreset.hx @@ -6,18 +6,18 @@ import flash.text.TextFormatAlign; class FontPreset { public var family(default, default):String; public var embed(default, default):Bool; - public var color(default, default):Color; - public var size(default, default):Int; + public var color(default, default):Null; + public var size(default, default):Null; public var bold(default, default):Bool; public var align(default, default):TextFormatAlign; - public function new(family:String = null, embed:Bool = false, color:Color = null, size:Int = 16, - bold:Bool = false, align:TextFormatAlign = null) { + public function new(?family:String, ?embed:Bool, ?color:Color, ?size:Int, + ?bold:Bool, ?align:TextFormatAlign) { this.family = family; this.embed = embed; - this.color = color != null ? color : 0xffffff; + this.color = color; this.size = size; this.bold = bold; - this.align = align != null ? align : TextFormatAlign.LEFT; + this.align = align; } } diff --git a/src/main/haxework/view/theme/FontStyle.hx b/src/main/haxework/view/theme/FontStyle.hx index 3dad054..6c0a857 100644 --- a/src/main/haxework/view/theme/FontStyle.hx +++ b/src/main/haxework/view/theme/FontStyle.hx @@ -12,7 +12,23 @@ class FontStyle implements IStyle { } public function apply(view:ITextView):Void { - view.font = font; - view.toUpdate(); + var update = false; + if (font.family != null) { + view.font.family = font.family; + view.font.embed = font.embed; + update = true; + } + if (font.color != null) { + view.font.color = font.color; + update = true; + } + if (font.size != null) { + view.font.size = font.size; + update = true; + } + // ToDo: other properties + if (update) { + view.toUpdate(); + } } } diff --git a/src/main/haxework/view/theme/GeometryStyle.hx b/src/main/haxework/view/theme/GeometryStyle.hx index 7e177c3..65c1f42 100644 --- a/src/main/haxework/view/theme/GeometryStyle.hx +++ b/src/main/haxework/view/theme/GeometryStyle.hx @@ -29,6 +29,7 @@ class GeometryStyle implements IStyle> { update = true; } if (update) { + view.toUpdate(); view.toUpdateParent(); } } diff --git a/src/main/haxework/view/theme/LayoutStyle.hx b/src/main/haxework/view/theme/LayoutStyle.hx index f1981bd..aca84b5 100644 --- a/src/main/haxework/view/theme/LayoutStyle.hx +++ b/src/main/haxework/view/theme/LayoutStyle.hx @@ -1,5 +1,6 @@ package haxework.view.theme; +import haxework.view.geometry.HAlign; import haxework.view.group.IGroupView; import haxework.view.layout.ILayout; @@ -12,7 +13,21 @@ class LayoutStyle implements IStyle { } public function apply(view:IGroupView):Void { - view.layout = layout; - view.toUpdate(); + var update = false; + if (layout.margin != 0) { + view.layout.margin = layout.margin; + update = true; + } + if (layout.hAlign != NONE) { + view.layout.hAlign = layout.hAlign; + update = true; + } + if (layout.vAlign != NONE) { + view.layout.vAlign = layout.vAlign; + update = true; + } + if (update) { + view.toUpdate(); + } } } diff --git a/src/main/haxework/view/theme/Theme.hx b/src/main/haxework/view/theme/Theme.hx index eca1477..c2d7ef5 100644 --- a/src/main/haxework/view/theme/Theme.hx +++ b/src/main/haxework/view/theme/Theme.hx @@ -97,8 +97,9 @@ class Theme implements ITheme { styles.put("text", text()); styles.put("label", text().concat([new GeometryStyle(new Geometry().setPadding([8, 2]))])); styles.put("button", button()); + styles.put("button.active", button(null, null, colors.active)); styles.put("dropdown", background(null, true)); - styles.put("tab", text().concat([ + styles.put("button.tab", text().concat([ new SkinStyle(Skin.tabColor(this.colors.light)), new GeometryStyle(new Geometry().setPadding([25, 8])) ])); @@ -137,12 +138,12 @@ class Theme implements ITheme { ]; } - public function button(?color:Color, ?textColor:Color):StyleSet { + public function button(?color:Color, ?textColor:Color, ?borderColor:Color):StyleSet { if (color == null) { color = colors.light; } return text(textColor).concat([ - new SkinStyle(Skin.buttonColor(color)), + new SkinStyle(Skin.buttonColor(color, borderColor)), new GeometryStyle(new Geometry().setPadding([25, 8])), ]); }