diff --git a/demo/run.sh b/demo/run.sh
old mode 100644
new mode 100755
diff --git a/demo/run_openfl.sh b/demo/run_openfl.sh
old mode 100644
new mode 100755
diff --git a/src/main/haxework/gui/ButtonView.hx b/src/main/haxework/gui/ButtonView.hx
index 018528c..822ed17 100755
--- a/src/main/haxework/gui/ButtonView.hx
+++ b/src/main/haxework/gui/ButtonView.hx
@@ -43,7 +43,7 @@ class ButtonView extends LabelView {
 
     private function onMouseClick(event:MouseEvent):Void {
         #if js if (downed) { #end
-        event.stopImmediatePropagation();
+        //event.stopImmediatePropagation();
         if (!disabled) onPress.emit(this);
         #if js } #end
     }
diff --git a/src/main/haxework/gui/DataView.hx b/src/main/haxework/gui/DataView.hx
index 4487527..7ec3a8f 100644
--- a/src/main/haxework/gui/DataView.hx
+++ b/src/main/haxework/gui/DataView.hx
@@ -1,9 +1,17 @@
 package haxework.gui;
 
+import flash.display.DisplayObject;
+import flash.events.MouseEvent;
+import haxework.signal.Signal;
+
 class DataView<D> extends GroupView {
 
     public var data(default, set):Array<D>;
     public var factory(default, default):Int -> D -> IView<Dynamic>;
+    public var onItemSelect(default, null):Signal3<Int, D, IView<Dynamic>> = new Signal3();
+    public var onDataSelect(default, null):Signal<D> = new Signal();
+
+    private var objectIndexes:Map<DisplayObject, Int> = new Map();
 
     private function set_data(value:Array<D>):Array<D> {
         data = value;
@@ -12,6 +20,20 @@ class DataView<D> extends GroupView {
     }
 
     private function rebuild():Void {
+        for (view in views) {
+            view.content.removeEventListener(MouseEvent.CLICK, onItemClick);
+        }
+        objectIndexes = new Map();
         views = Lambda.array(Lambda.mapi(data, factory));
+        for (i in 0...views.length) {
+            objectIndexes[views[i].content] = i;
+            views[i].content.addEventListener(MouseEvent.CLICK, onItemClick);
+        }
+    }
+
+    private function onItemClick(event:MouseEvent):Void {
+        var index = objectIndexes[event.currentTarget];
+        onDataSelect.emit(data[index]);
+        onItemSelect.emit(index, data[index], views[index]);
     }
 }
diff --git a/src/main/haxework/gui/core/Geometry.hx b/src/main/haxework/gui/core/Geometry.hx
index 57b85ef..487bc19 100644
--- a/src/main/haxework/gui/core/Geometry.hx
+++ b/src/main/haxework/gui/core/Geometry.hx
@@ -5,14 +5,39 @@ enum SizeValue {
     PERCENT(value:Float);
 }
 
+abstract SValue(String) {
+    public var percent(get, never):Bool;
+    public var value(get, never):Float;
+
+    inline public function new(value:String) {
+        this = value;
+    }
+
+    inline private function get_percent():Bool {
+        return this.substr(this.length - 1) == "%";
+    }
+
+    inline private function get_value():Float {
+        return Std.parseFloat(this);
+    }
+
+    @:from static public inline function fromFloat(value:Float):SValue {
+        return new SValue('$value');
+    }
+
+    @:from static public inline function fromString(value:String):SValue {
+        return new SValue(value);
+    }
+}
+
 class SizeSet {
     public var content(default, default):Size;
     public var fixed(default, default):Size;
     public var percent(default, default):Size;
     public var stretch(null, set):Bool;
 
-    public var width(null, set):Dynamic;
-    public var height(null, set):Dynamic;
+    public var width(null, set):SValue;
+    public var height(null, set):SValue;
 
     public function new() {
         this.content = [];
@@ -25,20 +50,22 @@ class SizeSet {
         return value;
     }
 
-    inline private function set_width(value:Dynamic):Dynamic {
-        if (Std.is(value, Float)) {
-            return fixed.width = value;
+    inline private function set_width(value:SValue):SValue {
+        if (value.percent) {
+            percent.width = value.value;
         } else {
-            return percent.width = Std.parseFloat(value);
+            fixed.width = value.value;
         }
+        return value;
     }
 
-    inline private function set_height(value:Dynamic):Dynamic {
-        if (Std.is(value, Float)) {
-            return fixed.height = value;
+    inline private function set_height(value:SValue):SValue {
+        if (value.percent) {
+            percent.height = value.value;
         } else {
-            return percent.height = Std.parseFloat(value);
+            fixed.height = value.value;
         }
+        return value;
     }
 }
 
diff --git a/src/main/haxework/gui/layout/TailLayout.hx b/src/main/haxework/gui/layout/TailLayout.hx
index 806551f..a8f83bf 100644
--- a/src/main/haxework/gui/layout/TailLayout.hx
+++ b/src/main/haxework/gui/layout/TailLayout.hx
@@ -42,9 +42,9 @@ class TailLayout extends DefaultLayout {
         }
         rows.push(row);
         var h:Float = Lambda.fold(rows, function(row, h) return row.height + h, 0) + margin * (rows.length - 1);
-        var y:Float = Math.max(group.geometry.margin.top, (group.height - h) / 2);
+        var y:Float = Math.max(group.geometry.padding.top, (group.height - h) / 2);
 
-        y = 0;
+        y = group.geometry.padding.top;
         for (row in rows) {
             placeRow(group, y, row);
             y += row.height + margin;
diff --git a/src/main/haxework/gui/skin/ButtonColorSkin.hx b/src/main/haxework/gui/skin/ButtonColorSkin.hx
index 69c5cb3..811511e 100644
--- a/src/main/haxework/gui/skin/ButtonColorSkin.hx
+++ b/src/main/haxework/gui/skin/ButtonColorSkin.hx
@@ -27,6 +27,11 @@ class ButtonColorSkin implements ISkin<ButtonView> {
 
     public function draw(view:ButtonView):Void {
         var color:Int = selectColor(view);
+        if (Std.is(view, ToggleButtonView)) {
+            if (!cast(view, ToggleButtonView).on) {
+                color = ColorUtils.multiply(color, 0.5);
+            }
+        }
         var graphics:Graphics = view.content.graphics;
         graphics.beginFill(color, alpha);
         graphics.lineStyle(2, ColorUtils.multiply(color, 1.5));