移除Core，新增各接口用于sdk扩展

source/src/ECS/Components/Physics/Colliders/BoxCollider.ts

@@ -1,6 +1,13 @@
 ///<reference path="./Collider.ts" />
 module es {
     export class BoxCollider extends Collider {
+        /**
+         * 创建一个BoxCollider，并使用x/y组件作为局部Offset
+         * @param x 
+         * @param y 
+         * @param width 
+         * @param height 
+         */
         constructor(x: number, y: number, width: number, height: number) {
             super();
 
@@ -30,10 +37,12 @@ module es {
          * @param height
          */
         public setSize(width: number, height: number) {
+            this._colliderRequiresAutoSizing = false;
             let box = this.shape as Box;
             if (width != box.width || height != box.height) {
                 // 更新框，改变边界，如果我们需要更新物理系统中的边界
                 box.updateBox(width, height);
+                this._isPositionDirty = true;
                 if (this.entity && this._isParentEntityAddedToScene)
                     Physics.updateCollider(this);
             }
@@ -46,10 +55,12 @@ module es {
          * @param width
          */
         public setWidth(width: number): BoxCollider {
+            this._colliderRequiresAutoSizing = false;
             let box = this.shape as Box;
             if (width != box.width) {
                 // 更新框，改变边界，如果我们需要更新物理系统中的边界
                 box.updateBox(width, box.height);
+                this._isPositionDirty = true;
                 if (this.entity && this._isParentEntityAddedToScene)
                     Physics.updateCollider(this);
             }
@@ -62,15 +73,25 @@ module es {
          * @param height
          */
         public setHeight(height: number) {
+            this._colliderRequiresAutoSizing = false;
             let box = this.shape as Box;
             if (height != box.height) {
                 // 更新框，改变边界，如果我们需要更新物理系统中的边界
                 box.updateBox(box.width, height);
+                this._isPositionDirty = true;
                 if (this.entity && this._isParentEntityAddedToScene)
                     Physics.updateCollider(this);
             }
         }
 
+        public debugRender(batcher: IBatcher) {
+            let poly = this.shape as Polygon;
+            batcher.drawHollowRect(this.bounds, Debug.colliderBounds, 1);
+            batcher.drawPolygon(this.shape.position, poly.points, Debug.colliderEdge, true, 1);
+            batcher.drawPixel(this.entity.transform.position, Debug.colliderPosition, 4);
+            batcher.drawPixel(Vector2.add(this.entity.transform.position, this.shape.center), Debug.colliderCenter, 2);
+        }
+
         public toString() {
             return `[BoxCollider: bounds: ${this.bounds}]`;
         }

source/src/ECS/Components/Physics/Colliders/CircleCollider.ts

@@ -1,7 +1,9 @@
 module es {
     export class CircleCollider extends Collider {
         /**
-         * 创建一个有半径的圆
+         * 创建一个具有半径的CircleCollider。
+         * 请注意，当指定半径时，如果在实体上使用RenderableComponent，您将需要设置原点来对齐CircleCollider。
+         * 例如，如果RenderableComponent有一个0,0的原点，并且创建了一个半径为1.5f * renderable.width的CircleCollider，你可以通过设置originNormalied为中心除以缩放尺寸来偏移原点
          *
          * @param radius
          */
@@ -24,18 +26,27 @@ module es {
          * @param radius
          */
         public setRadius(radius: number): CircleCollider {
+            this._colliderRequiresAutoSizing = false;
             let circle = this.shape as Circle;
             if (radius != circle.radius) {
                 circle.radius = radius;
                 circle._originalRadius = radius;
+                this._isPositionDirty = true;
 
-                if (this.entity && this._isParentEntityAddedToScene)
+                if (this.entity != null && this._isParentEntityAddedToScene)
                     Physics.updateCollider(this);
             }
 
             return this;
         }
 
+        public debugRender(batcher: IBatcher) {
+            batcher.drawHollowRect(this.bounds, Debug.colliderBounds, 1);
+            batcher.drawCircle(this.shape.position, (this.shape as Circle).radius, Debug.colliderEdge, 1);
+            batcher.drawPixel(this.entity.transform.position, Debug.colliderPosition, 4);
+            batcher.drawPixel(this.shape.position, Debug.colliderCenter, 2);
+        }
+
         public toString() {
             return `[CircleCollider: bounds: ${this.bounds}, radius: ${(this.shape as Circle).radius}]`
         }

source/src/ECS/Components/Physics/Colliders/Collider.ts

@@ -116,6 +116,28 @@ module es {
         public onAddedToEntity() {
             if (this._colliderRequiresAutoSizing) {
                 Insist.isTrue(this instanceof BoxCollider || this instanceof CircleCollider, "只有框和圆的碰撞器可以自动创建");
+
+                let renderable = this.entity.getComponent<RenderableComponent>(RenderableComponent);
+                if (renderable == null)
+                    console.warn("Collider没有形状，也没有RenderableComponent。不知道如何确定它的大小。");
+                if (renderable != null) {
+                    let renderableBounds = renderable.bounds.clone();
+
+                    // 我们在这里需要大小*反比例，因为当我们自动调整Collider的大小时，它需要没有一个缩放的Renderable
+                    let width = renderableBounds.width / this.entity.transform.scale.x;
+                    let height = renderableBounds.height / this.entity.transform.scale.y;
+
+                    if (this instanceof CircleCollider) {
+                        this.radius = Math.max(width, height) * 0.5;
+                        // 获取Renderable的中心，将其转移到本地坐标，并将其作为我们碰撞器的localOffset
+                        this.localOffset = Vector2.subtract(renderableBounds.center, this.entity.transform.position);
+                    } else if (this instanceof BoxCollider) {
+                        this.width = width;
+                        this.height = height;
+
+                        this.localOffset = Vector2.subtract(renderableBounds.center, this.entity.transform.position);
+                    }
+                }
             }
 
             this._isParentEntityAddedToScene = true;

source/src/ECS/Components/Physics/Colliders/PolygonCollider.ts

@@ -23,5 +23,13 @@ module es {
             Polygon.recenterPolygonVerts(points);
             this.shape = new Polygon(points);
         }
+
+        public debugRender(batcher: IBatcher) {
+            let poly = this.shape as Polygon;
+            batcher.drawHollowRect(this.bounds, Debug.colliderBounds, 1);
+            batcher.drawPolygon(this.shape.position, poly.points, Debug.colliderEdge, true, 1);
+            batcher.drawPixel(this.entity.transform.position, Debug.colliderPosition, 4);
+            batcher.drawPixel(this.shape.position, Debug.colliderCenter, 2);
+        }
     }
 }

source/src/ECS/Components/Renderables/IRenderable.ts

@@ -0,0 +1,80 @@
+module es {
+    /**
+     * 接口，当应用于一个Component时，它将被注册到场景渲染器中。
+     * 请仔细实现这个功能 改变像layerDepth/renderLayer/material这样的东西需要更新Scene RenderableComponentList
+     */
+    export interface IRenderable {
+        /** 包裹此对象的AABB。用来进行相机筛选 */
+        bounds: Rectangle;
+        /** 这个IRenderable是否应该被渲染 */
+        enabled: boolean;
+        /** 
+         * 标准的Batcher图层深度，0为前面，1为后面。
+         * 改变这个值会触发场景中可渲染组件列表的排序 
+         */
+        layerDepth: number;
+        /** 
+         * 较低的renderLayers在前面，较高的在後面，就像layerDepth一样，但不是限制在0-1。
+         * 请注意，这意味着较高的renderLayers首先被发送到Batcher。在使用模板缓冲区时，这是一个重要的事实 
+         */
+        renderLayer: number;
+        /**
+         * 由渲染器使用，用于指定该精灵应如何渲染。
+         * 如果非空，当组件从实体中移除时，它会被自动处理。
+         */
+        material;
+        /**
+         * 这个Renderable的可见性。
+         * 状态的改变最终会调用onBecameVisible/onBecameInvisible方法
+         */
+        isVisible: boolean;
+        /**
+         * 用于检索一个已经铸造的Material子类的帮助程序
+         */
+        getMaterial<T extends IMaterial>(): T;
+        /**
+         * 如果Renderables的边界与Camera.bounds相交，则返回true。
+         * 处理isVisible标志的状态切换。
+         * 在你的渲染方法中使用这个方法来决定你是否应该渲染
+         * @param camera 
+         */
+        isVisibleFromCamera(camera: ICamera): boolean;
+        /**
+         * 被渲染器调用。摄像机可以用来进行裁剪，并使用Batcher实例进行绘制
+         * @param batcher 
+         * @param camera 
+         */
+        render(batcher: IBatcher, camera: ICamera);
+        /**
+         * 只有在没有对撞机的情况下才会渲染边界。
+         * 始终在原点上渲染一个正方形
+         * @param batcher 
+         */
+        debugRender(batcher: IBatcher);
+    }
+
+    /**
+     * 对IRenderables进行排序的比较器。
+     * 首先按 RenderLayer 排序，然后按 LayerDepth 排序。
+     * 如果出现平局，则使用材料作为平局的断定器，以避免渲染状态的改变
+     */
+    export class RenderableComparer implements IComparer<IRenderable> {
+        public compare(self: IRenderable, other: IRenderable): number {
+            let res = other.renderLayer - self.renderLayer;
+            if (res == 0) {
+                res = other.layerDepth - self.layerDepth;
+                if (res == 0) {
+                    if (self.material == other.material)
+                        return 0;
+
+                    if (other.material == null)
+                        return -1;
+
+                    return 1;
+                }
+            }
+
+            return res;
+        }
+    }
+}

source/src/ECS/Components/Renderables/RenderableComponent.ts

@@ -0,0 +1,232 @@
+module es {
+    /**
+     * IRenderable的具体实现。包含方便的方法。
+     * 非常重要！子类必须覆盖width/height或bounds! 子类必须覆盖width/height或bounds!
+     */
+    export abstract class RenderableComponent extends Component implements IRenderable, IComparer<RenderableComponent> {
+        /**
+         * 不重写bounds属性的子类必须实现这个！RenderableComponent的宽度。
+         */
+        public get width() {
+            return this.bounds.width;
+        }
+
+        /**
+         * 不重写bounds属性的子类必须实现这个!
+         */
+        public get height() {
+            return this.bounds.height;
+        }
+
+        /**
+         * 包裹此对象的AABB。用来进行相机筛选。
+         */
+        public get bounds(): Rectangle {
+            if (this._areBoundsDirty) {
+                this._bounds.calculateBounds(this.entity.transform.position, this._localOffset, Vector2.zero,
+                    this.entity.transform.scale, this.entity.transform.rotation, this.width, this.height);
+                this._areBoundsDirty = false;
+            }
+
+            return this._bounds;
+        }
+
+        /**
+         * 标准的Batcher图层深度，0为前面，1为后面。
+         * 改变这个值会触发场景中可渲染组件列表的排序。
+         */
+        public get layerDepth() {
+            return this._layerDepth;
+        }
+        public set layerDepth(value: number) {
+            this.setLayerDepth(value);
+        }
+
+        /**
+         * 较低的renderLayers在前面，较高的在后面，就像layerDepth一樣，但不是限制在0-1。
+         * 请注意，这意味着更高的renderLayers首先被发送到Batcher。
+         */
+        public get renderLayer() {
+            return this._renderLayer;
+        }
+        public set renderLayer(value: number) {
+            this.setRenderLayer(value);
+        }
+
+        /**
+         * 由渲染器使用，用于指定该精灵的渲染方式
+         */
+        public material: IMaterial;
+        /**
+         * 偏移。用于将多个Renderables添加到需要特定定位的实体
+         */
+        public get localOffset(): Vector2 {
+            return this._localOffset;
+        }
+        public set localOffset(value: Vector2) {
+            this.setLocalOffset(value);
+        }
+        /**
+         * 这个Renderable的可见性。
+         * 状态的改变最终会调用onBecameVisible/onBecameInvisible方法
+         */
+        public get isVisible() {
+            return this._isVisble;
+        }
+        public set isVisible(value: boolean) {
+            if (this._isVisble != value) {
+                this._isVisble = value;
+
+                if (this._isVisble)
+                    this.onBecameVisible();
+                else
+                    this.onBecameInvisible();
+            }
+        }
+
+        public debugRenderEnabled: boolean = true;
+
+        protected _localOffset: Vector2;
+        protected _layerDepth: number;
+        protected _renderLayer: number;
+        protected _bounds: Rectangle;
+        protected _isVisble: boolean;
+
+        protected _areBoundsDirty: boolean = true;
+
+        public onEntityTransformChanged(comp: transform.Component) {
+            this._areBoundsDirty = true;
+        }
+
+        /**
+         * 被渲染器调用。摄像机可以用来进行裁剪，并使用Batcher实例进行绘制
+         * @param batcher 
+         * @param camera 
+         */
+        public abstract render(batcher: IBatcher, camera: ICamera);
+
+        /**
+         * 只有在没有对撞机的情况下才会渲染边界。始终在原点上渲染一个正方形
+         * @param batcher 
+         */
+        public debugRender(batcher: IBatcher) {
+            if (!this.debugRenderEnabled)
+                return;
+
+            // 如果我们没有对撞机，我们就画出我们的范围
+            if (this.entity.getComponent<Collider>(Collider) == null)
+                batcher.drawHollowRect(this.bounds, 0xFFFF00);
+
+            batcher.drawPixel(this.entity.transform.position.add(this._localOffset), 0xcc3299, 4);
+        }
+
+        /**
+         * 当Renderable进入相机帧时被调用。
+         * 请注意，如果您的Renderer没有使用isVisibleFromCamera来进行裁剪检查，这些方法将不会被调用。
+         * 所有默认的Renderer都会这样做
+         */
+        protected onBecameVisible() {
+
+        }
+
+        /**
+         * 当渲染器退出相机帧时，将调用这些方法。
+         * 请注意，如果你的Renderer没有使用isVisibleFromCamera来进行Culling检查，这些方法将不会被调用。
+         * 所有默认的Renderer都会这样做
+         */
+        protected onBecameInvisible() {
+
+        }
+
+        public onRemovedFromEntity() {
+
+        }
+
+        /**
+         * 如果Renderables的边界与Camera.bounds相交，则返回true。
+         * 处理isVisible标志的状态切换。在你的渲染方法中使用这个方法来决定你是否应该渲染
+         * @param camera 
+         */
+        public isVisibleFromCamera(camera: ICamera) {
+            this.isVisible = camera.bounds.intersects(this.bounds);
+            return this.isVisible;
+        }
+
+        public setMaterial(material: IMaterial) {
+            this.material = material;
+            if (this.entity != null && this.entity.scene != null)
+                this.entity.scene.renderableComponents.setRenderLayerNeedsComponentSort(this.renderLayer);
+            return this;
+        }
+
+        /**
+         * 标准的Batcher图层深度，0为前面，1为后面。
+         * 改变这个值会触发一种类似于renderableComponents的方法
+         * @param layerDepth 
+         */
+        public setLayerDepth(layerDepth: number): RenderableComponent {
+            this._layerDepth = MathHelper.clamp01(layerDepth);
+
+            if (this.entity != null && this.entity.scene != null)
+                this.entity.scene.renderableComponents.setRenderLayerNeedsComponentSort(this.renderLayer);
+            return this;
+        }
+
+        /**
+        * 较低的渲染层在前面，较高的在后面
+        * @param renderLayer
+        */
+        public setRenderLayer(renderLayer: number): RenderableComponent {
+            if (renderLayer != this._renderLayer) {
+                let oldRenderLayer = this._renderLayer;
+                this._renderLayer = renderLayer;
+
+                // 如果该组件拥有一个实体，那么是由ComponentList管理，需要通知它改变了渲染层
+                if (this.entity && this.entity.scene)
+                    this.entity.scene.renderableComponents.updateRenderableRenderLayer(this, oldRenderLayer, this._renderLayer);
+            }
+
+            return this;
+        }
+
+        /**
+         * 偏移。用于将多个Renderables添加到需要特定定位的实体
+         * @param offset 
+         */
+        public setLocalOffset(offset: Vector2): RenderableComponent {
+            if (!this._localOffset.equals(offset)) {
+                this._localOffset = offset;
+                this._areBoundsDirty = true;
+            }
+
+            return this;
+        }
+
+        /**
+         * 用于检索一个已经铸造的Material子类的帮助程序
+         */
+        public getMaterial<T extends IMaterial>(): T {
+            return this.material as T;
+        }
+
+        /**
+         * 先按renderLayer排序，再按layerDepth排序，最后按材质排序
+         * @param other 
+         */
+        public compare(other: RenderableComponent) {
+            let res = other.renderLayer - this.renderLayer;
+            if (res == 0) {
+                res = other.layerDepth - this.layerDepth;
+                if (res == 0) {
+                    if (this.material == other.material)
+                        return 0;
+
+                    if (other.material == null)
+                        return -1;
+
+                    return 1;
+                }
+            }
+        }
+    }
+}

source/src/ECS/Components/SceneComponent.ts

@@ -8,7 +8,7 @@ module es {
         /**
          * 如果启用了SceneComponent，则为true。状态的改变会导致调用onEnabled/onDisable。
          */
-        public get enabled(){
+        public get enabled() {
             return this._enabled;
         }
 
@@ -16,7 +16,7 @@ module es {
          * 如果启用了SceneComponent，则为true。状态的改变会导致调用onEnabled/onDisable。
          * @param value
          */
-        public set enabled(value: boolean){
+        public set enabled(value: boolean) {
             this.setEnabled(value);
         }
 
@@ -30,38 +30,38 @@ module es {
         /**
          * 在启用此SceneComponent时调用
          */
-        public onEnabled(){
+        public onEnabled() {
         }
 
         /**
          * 当禁用此SceneComponent时调用
          */
-        public onDisabled(){
+        public onDisabled() {
         }
 
         /**
          * 当该SceneComponent从场景中移除时调用
          */
-        public onRemovedFromScene(){
+        public onRemovedFromScene() {
         }
 
         /**
          * 在实体更新之前每一帧调用
          */
-        public update(){
+        public update() {
         }
 
         /**
          * 启用/禁用这个SceneComponent
          * @param isEnabled
          */
-        public setEnabled(isEnabled: boolean): SceneComponent{
-            if (this._enabled != isEnabled){
+        public setEnabled(isEnabled: boolean): SceneComponent {
+            if (this._enabled != isEnabled) {
                 this._enabled = isEnabled;
 
-                if (this._enabled){
+                if (this._enabled) {
                     this.onEnabled();
-                }else{
+                } else {
                     this.onDisabled();
                 }
             }
@@ -73,16 +73,15 @@ module es {
          * 设置SceneComponent的updateOrder并触发某种SceneComponent
          * @param updateOrder
          */
-        public setUpdateOrder(updateOrder: number){
-            if (this.updateOrder != updateOrder){
+        public setUpdateOrder(updateOrder: number) {
+            if (this.updateOrder != updateOrder) {
                 this.updateOrder = updateOrder;
-                Core.scene._sceneComponents.sort(this.compare);
             }
 
             return this;
         }
 
-        public compare(other: SceneComponent): number{
+        public compare(other: SceneComponent): number {
             return this.updateOrder - other.updateOrder;
         }
     }