1

.idea/inspectionProfiles/Project_Default.xml

+<component name="InspectionProjectProfileManager">
+  <profile version="1.0">
+    <option name="myName" value="Project Default" />
+    <inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
+    <inspection_tool class="TsLint" enabled="true" level="WARNING" enabled_by_default="true" />
+  </profile>
+</component>
\ No newline at end of file

.idea/misc.xml

 <?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
   <component name="JavaScriptSettings">
-    <option name="languageLevel" value="ES6" />
+    <option name="languageLevel" value="FLOW" />
   </component>
 </project>
\ No newline at end of file

.idea/shelf/Uncommitted_changes_before_Checkout_at_2020_5_15__2_12___Default_Changelist_.xml

+<changelist name="Uncommitted_changes_before_Checkout_at_2020_5_15,_2_12_下午_[Default_Changelist]" date="1589523138013" recycled="false" toDelete="true">
+  <option name="PATH" value="$PROJECT_DIR$/.idea/shelf/Uncommitted_changes_before_Checkout_at_2020_5_15,_2_12_下午_[Default_Changelist]/shelved.patch" />
+  <option name="DESCRIPTION" value="Uncommitted changes before Checkout at 2020/5/15, 2:12 下午 [Default Changelist]" />
+</changelist>
\ No newline at end of file

.idea/shelf/Uncommitted_changes_before_Update_at_2020_5_14__2_47___Default_Changelist_.xml

+<changelist name="Uncommitted_changes_before_Update_at_2020_5_14,_2_47_下午_[Default_Changelist]" date="1589438835098" recycled="false" toDelete="true">
+  <option name="PATH" value="$PROJECT_DIR$/.idea/shelf/Uncommitted_changes_before_Update_at_2020_5_14,_2_47_下午_[Default_Changelist]/shelved.patch" />
+  <option name="DESCRIPTION" value="Uncommitted changes before Update at 2020/5/14, 2:47 下午 [Default Changelist]" />
+</changelist>
\ No newline at end of file

.idea/shelf/Uncommitted_changes_before_Update_at_2020_5_14__2_47___Default_Changelist_1.xml

+<changelist name="Uncommitted_changes_before_Update_at_2020_5_14,_2_47_下午_[Default_Changelist]1" date="1589438857749" recycled="true" deleted="true">
+  <option name="PATH" value="$PROJECT_DIR$/.idea/shelf/Uncommitted_changes_before_Update_at_2020_5_14,_2_47_下午_[Default_Changelist]1/shelved.patch" />
+  <option name="DESCRIPTION" value="Uncommitted changes before Update at 2020/5/14, 2:47 下午 [Default Changelist]" />
+</changelist>
\ No newline at end of file

package.json

@@ -7,14 +7,14 @@
   "dependencies": {
     "color": "^3.1.2",
     "emoji-regex": "^8.0.0",
-    "howler": "^2.1.2"
+    "howler": "^2.1.2",
+    "rollup-plugin-progress": "^1.1.2"
   },
   "devDependencies": {
     "dts-bundle": "^0.7.3",
     "glob": "^7.1.6",
     "rollup-plugin-commonjs": "^10.1.0",
     "rollup-plugin-node-resolve": "^5.2.0",
-    "rollup-plugin-progress": "^1.1.1",
     "rollup-plugin-typescript": "^1.0.1",
     "rollup-plugin-typescript2": "^0.25.2",
     "rollup-plugin-uglify": "^6.0.3",

rollup.config.js

@@ -26,10 +26,10 @@ export default {
 		},
 	],
 	plugins: [
-		progress(),
+		// progress(),
 		resolve({}),
 		typescript({
-			//useTsconfigDeclarationDir: true,
+			// useTsconfigDeclarationDir: true,
 		}),
 		commonjs(),
 		process.env.BUILD === 'production' && uglify({})

src/2d/display/Sprite.ts

@@ -395,10 +395,19 @@ export default class Sprite extends Container {
 	}
 
 	set width(value) {
+        value = Math.abs(value);
 		const s = sign(this.scale.x) || 1;
 
 		this.scale.x = s * value / this._texture.orig.width;
 		this._width = value;
+
+
+        this.dispatchEvent(Event.MAYBE_ALIGN);
+        if(isNaN(this.percentWidth) || this.percentWidth === null) {
+            this.__width = value;
+        } else {
+            this.__width = 0;
+        }
 	}
 
 	/**
@@ -410,9 +419,17 @@ export default class Sprite extends Container {
 	}
 
 	set height(value) {
+	    value = Math.abs(value);
 		const s = sign(this.scale.y) || 1;
 		this.scale.y = s * value / this._texture.orig.height;
 		this._height = value;
+
+        this.dispatchEvent(Event.MAYBE_ALIGN);
+        if(isNaN(this.percentHeight) || this.percentHeight === null) {
+            this.__height = value;
+        } else {
+            this.__height= 0;
+        }
 	}
 
 	/**

src/2d/display/Stage.ts

@@ -12,6 +12,7 @@ import {WebglRenderer} from "../renderers/WebglRenderer";
 import {GDispatcher} from "../events/GDispatcher";
 import CanvasRenderer from "../renderers/CanvasRenderer";
 import {GlobalPro, isWebGLSupported} from "../utils/index";
+import { alignMgr } from "../../zeroing/decorators/AlignManager";
 
 //如果以后还出现帧率问题，使用ticker；
 //兼容requestAnimationFrame
@@ -972,12 +973,13 @@ export class Stage extends Container {
 		if (!GlobalPro.startTime) GlobalPro.startTime = Date.now();
 
 		//console.log('flushAll', Date.now());
-
+        alignMgr.flush();
 		if (!Stage._pause) {
 			let len = Stage.allUpdateObjList.length;
 			for (let i = 0; i < len; i++) {
 				Stage.allUpdateObjList[i] && Stage.allUpdateObjList[i].flush();
 			}
+
 		}
 		requestAnimationFrame(Stage.flushAll);
 	}
@@ -1035,4 +1037,4 @@ export class Stage extends Container {
 		s._ml = null;
 		super.destroy();
 	}
-}
\ No newline at end of file
+}

src/2d/events/Event.ts

@@ -9,9 +9,10 @@ import {HashObject} from "../HashObject";
  */
 export class Event extends HashObject {
 
-	// public static IMAGE_LOADED: string = "onImageLoaded"
+    public static MAYBE_ALIGN: string = "maybeAlign";
 
-	/**
+	// public static IMAGE_LOADED: string = "onImageLoaded"
+    /**
 	 * 舞台尺寸发生变化时触发
 	 * @Event
 	 * @property RESIZE

src/zeroing/decorators/AlignManager.ts

+import { ALIGN_MODE } from "./auto-adjust";
+import { toBoolean } from "../utils/utils";
+
+/**
+ * 自适应管理器
+ * @constructor
+ */
+class AlignManager {
+
+    // 这个列表里的对象会在渲染前被自动调整
+    private alignList = [];
+
+    constructor() {
+
+    }
+
+    /**
+     * flash (渲染前)
+     */
+    public flush() {
+        this.alignList.forEach((v) => {
+            this.autoSize(v);   // 去调整大小
+            this.align(v);  // 去自动对齐
+        });
+
+        // 要在这里单独检查，因为对齐一次后可能遇到其父节点需要对齐导致其再对齐一次
+        this.alignList.forEach((v) => {
+            if(v.alignMode === ALIGN_MODE.ONCE) {    // 如果是单次对齐则一次运算之后就关闭它
+                v.alignEnabled = false;
+            }
+        });
+        // 干掉列表
+        this.alignList.length = 0;
+    }
+
+    /**
+     * align
+     * @param that
+     */
+    private align(that) {
+        // if(that)
+
+        if(!that.alignEnabled) return;  // 如果的自动对齐关闭里则啥也不干
+
+        // if(that.alignMode === ALIGN_MODE.ONCE) {    // 如果是单次对齐则一次运算之后就关闭它
+        //     that.alignEnabled = false;
+        // }
+
+        const {percentWidth, percentHeight, left, top, right, bottom, horizonCenter, verticalCenter} = that;
+
+        let {_width: tW_Z = 0, _height: tH_Z = 0} = that;
+        const {_width: pW_Z = 0, _height: pH_Z = 0} = (that.parent || {});
+
+        /**
+         * 计算 width 和 x 值
+         */
+        if(toBoolean(left) && toBoolean(right)) {   // left right 都有则直接拉伸或缩小
+
+            that.x = left;
+
+            that.width = pW_Z - left - right;
+
+        } else {
+            // 先设置下自己的 width
+            toBoolean(percentWidth) && (tW_Z = that.width = pW_Z * percentWidth / 100);
+
+            // 先考虑 horizonCenter 属性
+            if(toBoolean(horizonCenter)) {
+                // x 值 = 父节点的中间值 - 自己宽度的一半 - 居中差值
+                that.x = pW_Z / 2 - tW_Z / 2 + horizonCenter;
+
+            } else if(toBoolean(left)) {   // 假如有左边距
+
+                that.x = left;
+
+            } else if(toBoolean(right)) {   // 假如有右边距
+
+                that.x = pW_Z - right - tW_Z;
+
+            }
+        }
+
+        /**
+         * 计算 height 和 y 值
+         */
+        if(toBoolean(top) && toBoolean(bottom)) {   // top bottom 都有则直接拉伸或缩小
+
+            that.y = top;
+
+            that.height = pH_Z - top - bottom;
+
+        } else {
+            // 先设置下自己的 height
+            toBoolean(percentHeight) && (tH_Z = that.height = pH_Z * percentHeight / 100);
+
+            // 先考虑 horizonCenter 属性
+            if(toBoolean(verticalCenter)) {
+                // x 值 = 父节点的中间值 - 自己高度的一半 - 居中差值
+                that.y = pH_Z / 2 - tH_Z / 2 + verticalCenter;
+
+            } else if(toBoolean(top)) {   // 假如有 top
+
+                that.y = top;
+
+            } else if(toBoolean(bottom)) {   // 假如有 bottom
+
+                that.y = pH_Z - bottom - tH_Z;
+
+            }
+        }
+
+        // console.log(that.name, that.width, that.height);
+        that.children.forEach(v => this.align(v));
+    }
+
+    /**
+     * 自动大小
+     * @param that
+     */
+    private autoSize(that) {
+
+        let len = that.children.length
+        if(len > 0) {
+
+            // 检测本身的是否是可以自动宽
+            if(that.autoWidth && !toBoolean(that.right) && !toBoolean(that.percentWidth)) {
+                // 找出子节点最小x
+                // let minX = 0;
+                // for(let i = 0; i < len; i++) {
+                //     if(that.children[i].x < minX) {
+                //         minX = that.children[i].x;
+                //     }
+                // }
+                // if(minX < 0) {
+                //     that.children.forEach(v => v.x -= minX);
+                //     that.x += minX;
+                //     that.width -= minX;
+                // }
+
+                // 找出最右值
+                let max = 0;
+                for(let i = 0; i < len; i++) {
+                    if(toBoolean(that.children[i].right)) continue;
+                    let _x = that.children[i].x || 0;
+                    let _w = that.children[i].__width || 0;
+                    if(_x + _w > max) {
+                        max = _x + _w;
+                    }
+                }
+                that.width = max;
+            }
+
+            // 检测本身的是否是可以自动高
+            if(that.autoHeight && !toBoolean(that.bottom) && !toBoolean(that.percentHeight)) {
+                // 找出子节点最小y
+                // let minY = 0;
+                // for(let i = 1; i < len; i++) {
+                //     if(that.children[i].y < minY) {
+                //         minY = that.children[i].y;
+                //     }
+                // }
+                // if(minY < 0) {
+                //     that.children.forEach(v => v.y -= minY);
+                //     that.y += minY;
+                //     that.height -= minY;
+                // }
+
+                // 找出最下值
+                let max = 0;
+                for(let i = 0; i < len; i++) {
+                    if(toBoolean(that.children[i].bottom)) continue;
+                    let _y = that.children[i].y || 0;
+                    let _h = that.children[i].__height || 0;
+                    if(_y + _h > max) {
+                        max = _y + _h;
+                    }
+                }
+                that.height = max;
+            }
+        }
+    }
+
+    /**
+     * 添加一个变脏的对象
+     * @param obj
+     */
+    public addAlign(obj) {
+        if(this.alignList.indexOf(obj) < 0) {
+            this.alignList.push(obj);
+        }
+    }
+}
+
+export let alignMgr = new AlignManager();

yarn.lock

@@ -438,10 +438,10 @@ rollup-plugin-node-resolve@^5.2.0:
     resolve "^1.11.1"
     rollup-pluginutils "^2.8.1"
 
-rollup-plugin-progress@^1.1.1:
-  version "1.1.1"
-  resolved "https://registry.npm.taobao.org/rollup-plugin-progress/download/rollup-plugin-progress-1.1.1.tgz#fcce2f915d545014ac89ea0927ee97cb48052f60"
-  integrity sha1-/M4vkV1UUBSsieoJJ+6Xy0gFL2A=
+rollup-plugin-progress@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.npm.taobao.org/rollup-plugin-progress/download/rollup-plugin-progress-1.1.2.tgz#5c1dfe7c50f654906bc34d167d5512ee1a4b72d5"
+  integrity sha1-XB3+fFD2VJBrw00WfVUS7hpLctU=
   dependencies:
     chalk "^2.4.2"