add support for percentage position of left,right,top,bottom,horizont…

…alCenter and verticalCenter properties.
wanhconyan · Aug 3, 2016 · 90b1160 · 90b1160
1 parent bc81536
commit 90b1160
Show file tree

Hide file tree

Showing 11 changed files with 253 additions and 150 deletions.
diff --git a/build/eui/eui.d.ts b/build/eui/eui.d.ts
diff --git a/build/eui/eui.js b/build/eui/eui.js
@@ -1876,7 +1876,12 @@ var eui;
                     return this.$UIComponent[0 /* left */];
                 }
                 ,function (value) {
-                    value = +value;
+                    if (!value || typeof value == "number") {
+                        value = +value;
+                    }
+                    else {
+                        value = value.toString().trim();
+                    }
                     var values = this.$UIComponent;
                     if (values[0 /* left */] === value)
                         return;
@@ -1893,7 +1898,12 @@ var eui;
                     return this.$UIComponent[1 /* right */];
                 }
                 ,function (value) {
-                    value = +value;
+                    if (!value || typeof value == "number") {
+                        value = +value;
+                    }
+                    else {
+                        value = value.toString().trim();
+                    }
                     var values = this.$UIComponent;
                     if (values[1 /* right */] === value)
                         return;
@@ -1910,7 +1920,12 @@ var eui;
                     return this.$UIComponent[2 /* top */];
                 }
                 ,function (value) {
-                    value = +value;
+                    if (!value || typeof value == "number") {
+                        value = +value;
+                    }
+                    else {
+                        value = value.toString().trim();
+                    }
                     var values = this.$UIComponent;
                     if (values[2 /* top */] === value)
                         return;
@@ -1927,7 +1942,12 @@ var eui;
                     return this.$UIComponent[3 /* bottom */];
                 }
                 ,function (value) {
-                    value = +value;
+                    if (!value || typeof value == "number") {
+                        value = +value;
+                    }
+                    else {
+                        value = value.toString().trim();
+                    }
                     var values = this.$UIComponent;
                     if (values[3 /* bottom */] == value)
                         return;
@@ -1944,7 +1964,12 @@ var eui;
                     return this.$UIComponent[4 /* horizontalCenter */];
                 }
                 ,function (value) {
-                    value = +value;
+                    if (!value || typeof value == "number") {
+                        value = +value;
+                    }
+                    else {
+                        value = value.toString().trim();
+                    }
                     var values = this.$UIComponent;
                     if (values[4 /* horizontalCenter */] === value)
                         return;
@@ -1961,7 +1986,12 @@ var eui;
                     return this.$UIComponent[5 /* verticalCenter */];
                 }
                 ,function (value) {
-                    value = +value;
+                    if (!value || typeof value == "number") {
+                        value = +value;
+                    }
+                    else {
+                        value = value.toString().trim();
+                    }
                     var values = this.$UIComponent;
                     if (values[5 /* verticalCenter */] === value)
                         return;
@@ -20528,6 +20558,24 @@ var eui;
     var sys;
     (function (sys) {
         var UIComponentClass = "eui.UIComponent";
+        /**
+         * @private
+         * @param value 要格式化的相对值
+         * @param total 在此值方向上的总长度
+         */
+        function formatRelative(value, total) {
+            if (!value || typeof value == "number") {
+                return value;
+            }
+            var str = value;
+            var index = str.indexOf("%");
+            if (index == -1) {
+                return +str;
+            }
+            var percent = +str.substring(0, index);
+            return percent * 0.01 * total;
+        }
+        sys.formatRelative = formatRelative;
         /**
          * @private
          * 一个工具方法，使用BasicLayout规则测量目标对象。
@@ -20546,12 +20594,12 @@ var eui;
                     continue;
                 }
                 var values = layoutElement.$UIComponent;
-                var hCenter = values[4 /* horizontalCenter */];
-                var vCenter = values[5 /* verticalCenter */];
-                var left = values[0 /* left */];
-                var right = values[1 /* right */];
-                var top = values[2 /* top */];
-                var bottom = values[3 /* bottom */];
+                var hCenter = +values[4 /* horizontalCenter */];
+                var vCenter = +values[5 /* verticalCenter */];
+                var left = +values[0 /* left */];
+                var right = +values[1 /* right */];
+                var top = +values[2 /* top */];
+                var bottom = +values[3 /* bottom */];
                 var extX;
                 var extY;
                 layoutElement.getPreferredBounds(bounds);
@@ -20606,12 +20654,12 @@ var eui;
                     continue;
                 }
                 var values = layoutElement.$UIComponent;
-                var hCenter = values[4 /* horizontalCenter */];
-                var vCenter = values[5 /* verticalCenter */];
-                var left = values[0 /* left */];
-                var right = values[1 /* right */];
-                var top = values[2 /* top */];
-                var bottom = values[3 /* bottom */];
+                var hCenter = formatRelative(values[4 /* horizontalCenter */], unscaledWidth);
+                var vCenter = formatRelative(values[5 /* verticalCenter */], unscaledHeight);
+                var left = formatRelative(values[0 /* left */], unscaledWidth);
+                var right = formatRelative(values[1 /* right */], unscaledWidth);
+                var top = formatRelative(values[2 /* top */], unscaledHeight);
+                var bottom = formatRelative(values[3 /* bottom */], unscaledHeight);
                 var percentWidth = values[6 /* percentWidth */];
                 var percentHeight = values[7 /* percentHeight */];
                 var childWidth = NaN;

diff --git a/build/eui/eui.min.js b/build/eui/eui.min.js
diff --git a/src/extension/eui/components/BitmapLabel.ts b/src/extension/eui/components/BitmapLabel.ts
@@ -256,7 +256,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public left: number;
+        public left: number|string;
 
         /**
          * @copy eui.UIComponent#right
@@ -265,7 +265,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public right: number;
+        public right: number|string;
 
         /**
          * @copy eui.UIComponent#top
@@ -274,7 +274,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public top: number;
+        public top: number|string;
 
         /**
          * @copy eui.UIComponent#bottom
@@ -283,7 +283,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public bottom: number;
+        public bottom: number|string;
 
         /**
          * @copy eui.UIComponent#horizontalCenter
@@ -292,7 +292,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public horizontalCenter: number;
+        public horizontalCenter: number|string;
 
         /**
          * @copy eui.UIComponent#verticalCenter
@@ -301,7 +301,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public verticalCenter: number;
+        public verticalCenter: number|string;
 
         /**
          * @copy eui.UIComponent#percentWidth

diff --git a/src/extension/eui/components/Component.ts b/src/extension/eui/components/Component.ts
@@ -776,7 +776,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public left:number;
+        public left:number|string;
 
         /**
          * @inheritDoc
@@ -785,7 +785,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public right:number;
+        public right:number|string;
 
         /**
          * @inheritDoc
@@ -794,7 +794,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public top:number;
+        public top:number|string;
 
         /**
          * @inheritDoc
@@ -803,7 +803,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public bottom:number;
+        public bottom:number|string;
 
         /**
          * @inheritDoc
@@ -812,7 +812,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public horizontalCenter:number;
+        public horizontalCenter:number|string;
 
         /**
          * @inheritDoc
@@ -821,7 +821,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public verticalCenter:number;
+        public verticalCenter:number|string;
 
         /**
          * @inheritDoc

diff --git a/src/extension/eui/components/EditableText.ts b/src/extension/eui/components/EditableText.ts
@@ -413,7 +413,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public left: number;
+        public left: number|string;
 
         /**
          * @inheritDoc
@@ -422,7 +422,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public right: number;
+        public right: number|string;
 
         /**
          * @inheritDoc
@@ -431,7 +431,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public top: number;
+        public top: number|string;
 
         /**
          * @inheritDoc
@@ -440,7 +440,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public bottom: number;
+        public bottom: number|string;
 
         /**
          * @inheritDoc
@@ -449,7 +449,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public horizontalCenter: number;
+        public horizontalCenter: number|string;
 
         /**
          * @inheritDoc
@@ -458,7 +458,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public verticalCenter: number;
+        public verticalCenter: number|string;
 
         /**
          * @inheritDoc

diff --git a/src/extension/eui/components/Group.ts b/src/extension/eui/components/Group.ts
@@ -659,7 +659,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public left:number;
+        public left:number|string;
 
         /**
          * @inheritDoc
@@ -668,7 +668,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public right:number;
+        public right:number|string;
 
         /**
          * @inheritDoc
@@ -677,7 +677,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public top:number;
+        public top:number|string;
 
         /**
          * @inheritDoc
@@ -686,7 +686,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public bottom:number;
+        public bottom:number|string;
 
         /**
          * @inheritDoc
@@ -695,7 +695,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public horizontalCenter:number;
+        public horizontalCenter:number|string;
 
         /**
          * @inheritDoc
@@ -704,7 +704,7 @@ module eui {
          * @version eui 1.0
          * @platform Web,Native
          */
-        public verticalCenter:number;
+        public verticalCenter:number|string;
 
         /**
          * @inheritDoc