fix: view.getBounds bug, when view has align property, see #108

hiloteam · Dec 12, 2017 · 0f5b1ec · 0f5b1ec
1 parent dfc281f
commit 0f5b1ec
Show file tree

Hide file tree

Showing 3 changed files with 67 additions and 50 deletions.
diff --git a/src/renderer/CanvasRenderer.js b/src/renderer/CanvasRenderer.js
@@ -145,53 +145,9 @@ var CanvasRenderer = Class.create(/** @lends CanvasRenderer.prototype */{
             //alignment
             var align = target.align;
             if(align){
-                if(typeof align === 'function'){
-                    target.align();
-                }else{
-                    var parent = target.parent;
-                    if(parent){
-                        var w = target.width, h = target.height,
-                            pw = parent.width, ph = parent.height;
-                        switch(align){
-                            case 'TL':
-                                x = 0;
-                                y = 0;
-                                break;
-                            case 'T':
-                                x = pw - w >> 1;
-                                y = 0;
-                                break;
-                            case 'TR':
-                                x = pw - w;
-                                y = 0;
-                                break;
-                            case 'L':
-                                x = 0;
-                                y = ph - h >> 1;
-                                break;
-                            case 'C':
-                                x = pw - w >> 1;
-                                y = ph - h >> 1;
-                                break;
-                            case 'R':
-                                x = pw - w;
-                                y = ph - h >> 1;
-                                break;
-                            case 'BL':
-                                x = 0;
-                                y = ph - h;
-                                break;
-                            case 'B':
-                                x = pw - w >> 1;
-                                y = ph - h;
-                                break;
-                            case 'BR':
-                                x = pw - w;
-                                y = ph - h;
-                                break;
-                        }
-                    }
-                }
+                var pos = target.getAlignPosition();
+                x = pos.x;
+                y = pos.y;
             }
 
             if(x != 0 || y != 0) ctx.translate(x, y);

diff --git a/src/renderer/WebGLRenderer.js b/src/renderer/WebGLRenderer.js
@@ -455,12 +455,13 @@ var WebGLRenderer = Class.create(/** @lends WebGLRenderer.prototype */{
             sin = Math.sin(r);
         }
 
+        var pos = view.getAlignPosition();
         mtx.a = cos*scaleX;
         mtx.b = sin*scaleX;
         mtx.c = -sin*scaleY;
         mtx.d = cos*scaleY;
-        mtx.tx =  view.x - mtx.a * pivotX - mtx.c * pivotY;
-        mtx.ty =  view.y - mtx.b * pivotX - mtx.d * pivotY;
+        mtx.tx =  pos.x - mtx.a * pivotX - mtx.c * pivotY;
+        mtx.ty =  pos.y - mtx.b * pivotX - mtx.d * pivotY;
 
         mtx.concat(ancestor.__webglWorldMatrix);
     },

diff --git a/src/view/View.js b/src/view/View.js
@@ -273,11 +273,71 @@ return Class.create(/** @lends View.prototype */{
 
             if(pivotX != 0) mtx.tx -= pivotX;
             if(pivotY != 0) mtx.ty -= pivotY;
-            mtx.concat(cos*scaleX, sin*scaleX, -sin*scaleY, cos*scaleY, o.x, o.y);
+
+            var pos = o.getAlignPosition();
+            mtx.concat(cos*scaleX, sin*scaleX, -sin*scaleY, cos*scaleY, pos.x, pos.y);
         }
         return mtx;
     },
 
+    getAlignPosition(){
+        var parent = this.parent;
+        var align = this.align;
+        var x = this.x;
+        var y = this.y;
+        if(parent && this.align){
+            if(typeof align === 'function'){
+                return this.align();
+            }
+
+            var w = this.width, h = this.height,
+                pw = parent.width, ph = parent.height;
+            switch(align){
+                case 'TL':
+                    x = 0;
+                    y = 0;
+                    break;
+                case 'T':
+                    x = pw - w >> 1;
+                    y = 0;
+                    break;
+                case 'TR':
+                    x = pw - w;
+                    y = 0;
+                    break;
+                case 'L':
+                    x = 0;
+                    y = ph - h >> 1;
+                    break;
+                case 'C':
+                    x = pw - w >> 1;
+                    y = ph - h >> 1;
+                    break;
+                case 'R':
+                    x = pw - w;
+                    y = ph - h >> 1;
+                    break;
+                case 'BL':
+                    x = 0;
+                    y = ph - h;
+                    break;
+                case 'B':
+                    x = pw - w >> 1;
+                    y = ph - h;
+                    break;
+                case 'BR':
+                    x = pw - w;
+                    y = ph - h;
+                    break;
+            }
+        }
+
+        return {
+            x:x,
+            y:y
+        }
+    },
+
     /**
      * @language=en
      * Determining whether a point is in the circumscribed rectangle of current view.