修复Vector2.zero引起的引用混乱问题

source/src/ECS/Components/Camera.ts

@@ -1,9 +1,4 @@
 module es {
-    export enum CameraStyle {
-        lockOn,
-        cameraWindow,
-    }
-
     export class CameraInset {
         public left: number = 0;
         public right: number = 0;
@@ -16,39 +11,9 @@ module es {
         public _areMatrixedDirty: boolean = true;
         public _areBoundsDirty: boolean = true;
         public _isProjectionMatrixDirty = true;
-        /**
-         * 如果相机模式为cameraWindow 则会进行缓动移动
-         * 该值为移动速度
-         */
-        public followLerp = 0.1;
-        /**
-         * 在cameraWindow模式下，宽度/高度被用做边界框，允许在不移动相机的情况下移动
-         * 在lockOn模式下，只使用deadZone的x/y值 你可以通过直接setCenteredDeadzone重写它来自定义deadZone
-         */
-        public deadzone: Rectangle = new Rectangle();
-        /**
-         * 相机聚焦于屏幕中心的偏移
-         */
-        public focusOffset: Vector2 = Vector2.zero;
-        /**
-         * 如果为true 相机位置则不会超出地图矩形（0, 0, mapwidth, mapheight）
-         */
-        public mapLockEnabled: boolean = false;
-        /**
-         * 當前地圖映射的寬度和高度
-         */
-        public mapSize: Rectangle = new Rectangle();
-        public _targetEntity: Entity;
-        public _targetCollider: Collider;
-        public _desiredPositionDelta: Vector2 = new Vector2();
-        public _cameraStyle: CameraStyle;
-        public _worldSpaceDeadZone: Rectangle = new Rectangle();
 
-        constructor(targetEntity: Entity = null, cameraStyle: CameraStyle = CameraStyle.lockOn) {
+        constructor() {
             super();
-
-            this._targetEntity = targetEntity;
-            this._cameraStyle = cameraStyle;
             this.setZoom(0);
         }
 
@@ -82,7 +47,25 @@ module es {
             this.entity.transform.rotation = value;
         }
 
-        public _zoom;
+        /**
+         * 原始的缩放值。这就是用于比例矩阵的精确值。默认值为1。
+         */
+        public get rawZoom(){
+            return this._zoom;
+        }
+
+        /**
+         * 原始的缩放值。这就是用于比例矩阵的精确值。默认值为1。
+         * @param value
+         */
+        public set rawZoom(value: number){
+            if (value != this._zoom){
+                this._zoom = value;
+                this._areMatrixedDirty = true;
+            }
+        }
+
+        public _zoom: number = 0;
 
         /**
          * 缩放值应该在-1和1之间、然后将该值从minimumZoom转换为maximumZoom。
@@ -218,18 +201,6 @@ module es {
             }
         }
 
-        /**
-         * 当场景渲染目标的大小发生变化时，我们会更新相机的原点并调整它的位置以保持它原来的位置
-         * @param newWidth
-         * @param newHeight
-         */
-        public onSceneSizeChanged(newWidth: number, newHeight: number) {
-            let oldOrigin = this._origin;
-            this.origin = new Vector2(newWidth / 2, newHeight / 2);
-
-            this.entity.transform.position = Vector2.add(this.entity.transform.position, Vector2.subtract(this._origin, oldOrigin));
-        }
-
         /**
          * 设置用于从视口边缘插入摄像机边界的量
          * @param left
@@ -318,6 +289,11 @@ module es {
             return this;
         }
 
+        public forceMatrixUpdate(){
+            // 弄脏矩阵也会自动弄脏边界
+            this._areMatrixedDirty = true;
+        }
+
         public onEntityTransformChanged(comp: transform.Component) {
             this._areMatrixedDirty = true;
         }
@@ -336,7 +312,7 @@ module es {
          */
         public worldToScreenPoint(worldPosition: Vector2): Vector2 {
             this.updateMatrixes();
-            worldPosition = Vector2.transform(worldPosition, this._transformMatrix);
+            worldPosition = Vector2Ext.transformR(worldPosition, this._transformMatrix);
             return worldPosition;
         }
 
@@ -346,10 +322,23 @@ module es {
          */
         public screenToWorldPoint(screenPosition: Vector2): Vector2 {
             this.updateMatrixes();
-            screenPosition = Vector2.transform(screenPosition, this._inverseTransformMatrix);
+            screenPosition = Vector2Ext.transformR(screenPosition, this._inverseTransformMatrix);
             return screenPosition;
         }
 
+        /**
+         * 当场景渲染目标的大小发生变化时，我们会更新相机的原点并调整它的位置以保持它原来的位置
+         * @param newWidth
+         * @param newHeight
+         */
+        public onSceneRenderTargetSizeChanged(newWidth: number, newHeight: number){
+            this._isProjectionMatrixDirty = true;
+            let oldOrigin = this._origin;
+            this.origin = new Vector2(newWidth / 2, newHeight / 2);
+
+            this.entity.transform.position.add(Vector2.subtract(this._origin, oldOrigin));
+        }
+
         /**
          * 返回鼠标在世界空间中的位置
          */
@@ -357,103 +346,6 @@ module es {
             return this.screenToWorldPoint(Input.touchPosition);
         }
 
-        public onAddedToEntity() {
-            this.follow(this._targetEntity, this._cameraStyle);
-        }
-
-        public update() {
-            let halfScreen = Vector2.multiply(this.bounds.size, new Vector2(0.5));
-            this._worldSpaceDeadZone.x = this.position.x - halfScreen.x * Core.scene.scaleX + this.deadzone.x + this.focusOffset.x;
-            this._worldSpaceDeadZone.y = this.position.y - halfScreen.y * Core.scene.scaleY + this.deadzone.y + this.focusOffset.y;
-            this._worldSpaceDeadZone.width = this.deadzone.width;
-            this._worldSpaceDeadZone.height = this.deadzone.height;
-
-            if (this._targetEntity)
-                this.updateFollow();
-
-            this.position = Vector2.lerp(this.position, Vector2.add(this.position, this._desiredPositionDelta), this.followLerp);
-            this.entity.transform.roundPosition();
-
-            if (this.mapLockEnabled) {
-                this.position = this.clampToMapSize(this.position);
-                this.entity.transform.roundPosition();
-            }
-        }
-
-        /**
-         * 固定相机 永远不会离开地图的可见区域
-         * @param position
-         */
-        public clampToMapSize(position: Vector2) {
-            let halfScreen = Vector2.multiply(this.bounds.size, new Vector2(0.5)).add(new Vector2(this.mapSize.x, this.mapSize.y));
-            let cameraMax = new Vector2(this.mapSize.width - halfScreen.x, this.mapSize.height - halfScreen.y);
-
-            return Vector2.clamp(position, halfScreen, cameraMax);
-        }
-
-        public updateFollow() {
-            this._desiredPositionDelta.x = this._desiredPositionDelta.y = 0;
-
-            if (this._cameraStyle == CameraStyle.lockOn) {
-                let targetX = this._targetEntity.transform.position.x;
-                let targetY = this._targetEntity.transform.position.y;
-
-                if (this._worldSpaceDeadZone.x > targetX)
-                    this._desiredPositionDelta.x = targetX - this._worldSpaceDeadZone.x;
-                else if (this._worldSpaceDeadZone.x < targetX)
-                    this._desiredPositionDelta.x = targetX - this._worldSpaceDeadZone.x;
-
-                if (this._worldSpaceDeadZone.y < targetY)
-                    this._desiredPositionDelta.y = targetY - this._worldSpaceDeadZone.y;
-                else if (this._worldSpaceDeadZone.y > targetY)
-                    this._desiredPositionDelta.y = targetY - this._worldSpaceDeadZone.y;
-            } else {
-                if (!this._targetCollider) {
-                    this._targetCollider = this._targetEntity.getComponent<Collider>(Collider);
-                    if (!this._targetCollider)
-                        return;
-                }
-
-                let targetBounds = this._targetEntity.getComponent<Collider>(Collider).bounds;
-                if (!this._worldSpaceDeadZone.containsRect(targetBounds)) {
-                    if (this._worldSpaceDeadZone.left > targetBounds.left)
-                        this._desiredPositionDelta.x = targetBounds.left - this._worldSpaceDeadZone.left;
-                    else if (this._worldSpaceDeadZone.right < targetBounds.right)
-                        this._desiredPositionDelta.x = targetBounds.right - this._worldSpaceDeadZone.right;
-
-                    if (this._worldSpaceDeadZone.bottom < targetBounds.bottom)
-                        this._desiredPositionDelta.y = targetBounds.bottom - this._worldSpaceDeadZone.bottom;
-                    else if (this._worldSpaceDeadZone.top > targetBounds.top)
-                        this._desiredPositionDelta.y = targetBounds.top - this._worldSpaceDeadZone.top;
-                }
-            }
-        }
-
-        public follow(targetEntity: Entity, cameraStyle: CameraStyle = CameraStyle.cameraWindow) {
-            this._targetEntity = targetEntity;
-            this._cameraStyle = cameraStyle;
-
-            switch (this._cameraStyle) {
-                case CameraStyle.cameraWindow:
-                    let w = this.bounds.width / 6;
-                    let h = this.bounds.height / 3;
-                    this.deadzone = new Rectangle((this.bounds.width - w) / 2, (this.bounds.height - h) / 2, w, h);
-                    break;
-                case CameraStyle.lockOn:
-                    this.deadzone = new Rectangle(this.bounds.width / 2, this.bounds.height / 2, 10, 10);
-                    break;
-            }
-        }
-
-        /**
-         * 以给定的尺寸设置当前相机边界中心的死区
-         * @param width
-         * @param height
-         */
-        public setCenteredDeadzone(width: number, height: number) {
-            this.deadzone = new Rectangle((this.bounds.width - width) / 2, (this.bounds.height - height) / 2, width, height);
-        }
-
         protected updateMatrixes() {
             if (!this._areMatrixedDirty)
                 return;

source/src/ECS/Components/FollowCamera.ts

@@ -0,0 +1,186 @@
+module es {
+    export enum CameraStyle {
+        lockOn,
+        cameraWindow,
+    }
+
+    export class FollowCamera extends Component {
+        public camera: Camera;
+
+        /**
+         * 如果相机模式为cameraWindow 则会进行缓动移动
+         * 该值为移动速度
+         */
+        public followLerp = 0.1;
+        /**
+         * 在cameraWindow模式下，宽度/高度被用做边界框，允许在不移动相机的情况下移动
+         * 在lockOn模式下，只使用deadZone的x/y值 你可以通过直接setCenteredDeadzone重写它来自定义deadZone
+         */
+        public deadzone: Rectangle = new Rectangle();
+        /**
+         * 相机聚焦于屏幕中心的偏移
+         */
+        public focusOffset: Vector2 = Vector2.zero;
+        /**
+         * 如果为true 相机位置则不会超出地图矩形（0, 0, mapwidth, mapheight）
+         */
+        public mapLockEnabled: boolean = false;
+        /**
+         * 當前地圖映射的寬度和高度
+         */
+        public mapSize: Rectangle = new Rectangle();
+
+        public _targetEntity: Entity;
+        public _targetCollider: Collider;
+        public _desiredPositionDelta: Vector2 = new Vector2();
+        public _cameraStyle: CameraStyle;
+        public _worldSpaceDeadZone: Rectangle = new Rectangle();
+
+        private rectShape: egret.Shape = new egret.Shape();
+
+        constructor(targetEntity: Entity = null, camera: Camera = null, cameraStyle: CameraStyle = CameraStyle.lockOn) {
+            super();
+
+            this._targetEntity = targetEntity;
+            this._cameraStyle = cameraStyle;
+            this.camera = camera;
+        }
+
+        public onAddedToEntity() {
+            if (!this.camera)
+                this.camera = this.entity.scene.camera;
+
+            this.follow(this._targetEntity, this._cameraStyle);
+
+            Core.emitter.addObserver(CoreEvents.GraphicsDeviceReset, this.onGraphicsDeviceReset, this);
+        }
+
+        public onGraphicsDeviceReset(){
+            // 我们需要这个在下一帧触发 这样相机边界就会更新
+            Core.schedule(0, false, this, t => {
+                let self = t.context as FollowCamera;
+                self.follow(self._targetEntity, self._cameraStyle);
+            });
+        }
+
+        public update() {
+            let halfScreen = Vector2.multiply(this.camera.bounds.size, new Vector2(0.5));
+            this._worldSpaceDeadZone.x = this.camera.position.x - halfScreen.x * Core.scene.scaleX + this.deadzone.x + this.focusOffset.x;
+            this._worldSpaceDeadZone.y = this.camera.position.y - halfScreen.y * Core.scene.scaleY + this.deadzone.y + this.focusOffset.y;
+            this._worldSpaceDeadZone.width = this.deadzone.width;
+            this._worldSpaceDeadZone.height = this.deadzone.height;
+
+            if (this._targetEntity)
+                this.updateFollow();
+
+            this.camera.position = Vector2.lerp(this.camera.position, Vector2.add(this.camera.position, this._desiredPositionDelta), this.followLerp);
+            this.entity.transform.roundPosition();
+
+            if (this.mapLockEnabled) {
+                this.camera.position = this.clampToMapSize(this.camera.position);
+                this.entity.transform.roundPosition();
+            }
+        }
+
+        public debugRender() {
+            if (!this.rectShape)
+                this.debugDisplayObject.addChild(this.rectShape);
+
+            this.rectShape.graphics.clear();
+            if (this._cameraStyle == CameraStyle.lockOn){
+                this.rectShape.graphics.beginFill(0x8B0000, 0);
+                this.rectShape.graphics.lineStyle(1, 0x8B0000);
+                this.rectShape.graphics.drawRect(this._worldSpaceDeadZone.x - 5, this._worldSpaceDeadZone.y - 5,
+                    this._worldSpaceDeadZone.width, this._worldSpaceDeadZone.height);
+                this.rectShape.graphics.endFill();
+            } else {
+                this.rectShape.graphics.beginFill(0x8B0000, 0);
+                this.rectShape.graphics.lineStyle(1, 0x8B0000);
+                this.rectShape.graphics.drawRect(this._worldSpaceDeadZone.x, this._worldSpaceDeadZone.y,
+                    this._worldSpaceDeadZone.width, this._worldSpaceDeadZone.height);
+                this.rectShape.graphics.endFill();
+            }
+        }
+
+
+        /**
+         * 固定相机 永远不会离开地图的可见区域
+         * @param position
+         */
+        public clampToMapSize(position: Vector2) {
+            let halfScreen = Vector2.multiply(this.camera.bounds.size, new Vector2(0.5)).add(new Vector2(this.mapSize.x, this.mapSize.y));
+            let cameraMax = new Vector2(this.mapSize.width - halfScreen.x, this.mapSize.height - halfScreen.y);
+
+            return Vector2.clamp(position, halfScreen, cameraMax);
+        }
+
+        public follow(targetEntity: Entity, cameraStyle: CameraStyle = CameraStyle.cameraWindow) {
+            this._targetEntity = targetEntity;
+            this._cameraStyle = cameraStyle;
+            let cameraBounds = this.camera.bounds;
+
+            switch (this._cameraStyle) {
+                case CameraStyle.cameraWindow:
+                    let w = cameraBounds.width / 6;
+                    let h = cameraBounds.height / 3;
+                    this.deadzone = new Rectangle((cameraBounds.width - w) / 2, (cameraBounds.height - h) / 2, w, h);
+                    break;
+                case CameraStyle.lockOn:
+                    this.deadzone = new Rectangle(cameraBounds.width / 2, cameraBounds.height / 2, 10, 10);
+                    break;
+            }
+        }
+
+        public updateFollow() {
+            this._desiredPositionDelta.x = this._desiredPositionDelta.y = 0;
+
+            if (this._cameraStyle == CameraStyle.lockOn) {
+                let targetX = this._targetEntity.transform.position.x;
+                let targetY = this._targetEntity.transform.position.y;
+
+                if (this._worldSpaceDeadZone.x > targetX)
+                    this._desiredPositionDelta.x = targetX - this._worldSpaceDeadZone.x;
+                else if (this._worldSpaceDeadZone.x < targetX)
+                    this._desiredPositionDelta.x = targetX - this._worldSpaceDeadZone.x;
+
+                if (this._worldSpaceDeadZone.y < targetY)
+                    this._desiredPositionDelta.y = targetY - this._worldSpaceDeadZone.y;
+                else if (this._worldSpaceDeadZone.y > targetY)
+                    this._desiredPositionDelta.y = targetY - this._worldSpaceDeadZone.y;
+            } else {
+                if (!this._targetCollider) {
+                    this._targetCollider = this._targetEntity.getComponent<Collider>(Collider);
+                    if (!this._targetCollider)
+                        return;
+                }
+
+                let targetBounds = this._targetEntity.getComponent<Collider>(Collider).bounds;
+                if (!this._worldSpaceDeadZone.containsRect(targetBounds)) {
+                    if (this._worldSpaceDeadZone.left > targetBounds.left)
+                        this._desiredPositionDelta.x = targetBounds.left - this._worldSpaceDeadZone.left;
+                    else if (this._worldSpaceDeadZone.right < targetBounds.right)
+                        this._desiredPositionDelta.x = targetBounds.right - this._worldSpaceDeadZone.right;
+
+                    if (this._worldSpaceDeadZone.bottom < targetBounds.bottom)
+                        this._desiredPositionDelta.y = targetBounds.bottom - this._worldSpaceDeadZone.bottom;
+                    else if (this._worldSpaceDeadZone.top > targetBounds.top)
+                        this._desiredPositionDelta.y = targetBounds.top - this._worldSpaceDeadZone.top;
+                }
+            }
+        }
+
+        /**
+         * 以给定的尺寸设置当前相机边界中心的死区
+         * @param width
+         * @param height
+         */
+        public setCenteredDeadzone(width: number, height: number) {
+            if (!this.camera){
+                console.error("相机是null。我们不能得到它的边界。请等到该组件添加到实体之后");
+                return;
+            }
+            let cameraBounds = this.camera.bounds;
+            this.deadzone = new Rectangle((cameraBounds.width - width) / 2, (cameraBounds.height - height) / 2, width, height);
+        }
+    }
+}

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

@@ -110,18 +110,18 @@ module es {
             if (!this.pixelShape2.parent)
                 this.debugDisplayObject.addChild(this.pixelShape2);
 
-            this.hollowShape.graphics.clear();
-            this.hollowShape.graphics.beginFill(Colors.colliderBounds, 0);
-            this.hollowShape.graphics.lineStyle(Size.lineSizeMultiplier, Colors.colliderBounds);
-            this.hollowShape.graphics.drawRect(this.bounds.x, this.bounds.y, this.bounds.width, this.bounds.height);
-            this.hollowShape.graphics.endFill();
+            // this.hollowShape.graphics.clear();
+            // this.hollowShape.graphics.beginFill(Colors.colliderBounds, 0);
+            // this.hollowShape.graphics.lineStyle(Size.lineSizeMultiplier, Colors.colliderBounds);
+            // this.hollowShape.graphics.drawRect(this.bounds.x, this.bounds.y, this.bounds.width, this.bounds.height);
+            // this.hollowShape.graphics.endFill();
 
             this.polygonShape.graphics.clear();
             if (poly.points.length >= 2){
                 this.polygonShape.graphics.beginFill(Colors.colliderEdge, 0);
                 this.polygonShape.graphics.lineStyle(Size.lineSizeMultiplier, Colors.colliderEdge);
-                for (let i = 1; i < poly.points.length; i ++){
-                    if (i == 1){
+                for (let i = 0; i < poly.points.length; i ++){
+                    if (i == 0){
                         this.polygonShape.graphics.moveTo(poly.position.x + poly.points[i].x, poly.position.y + poly.points[i].y);
                     }else{
                         this.polygonShape.graphics.lineTo(poly.position.x + poly.points[i].x, poly.position.y + poly.points[i].y);
@@ -136,6 +136,7 @@ module es {
             this.pixelShape1.graphics.beginFill(Colors.colliderPosition, 0);
             this.pixelShape1.graphics.lineStyle(4 * Size.lineSizeMultiplier, Colors.colliderPosition);
             this.pixelShape1.graphics.moveTo(this.entity.transform.position.x, this.entity.transform.position.y);
+            this.pixelShape1.graphics.lineTo(this.entity.transform.position.x, this.entity.transform.position.y);
             this.pixelShape1.graphics.endFill();
 
             this.pixelShape2.graphics.clear();
@@ -143,6 +144,8 @@ module es {
             this.pixelShape2.graphics.lineStyle(2 * Size.lineSizeMultiplier, Colors.colliderCenter);
             this.pixelShape2.graphics.moveTo(this.entity.transform.position.x + this.shape.center.x,
                 this.entity.transform.position.y + this.shape.center.y);
+            this.pixelShape2.graphics.lineTo(this.entity.transform.position.x + this.shape.center.x,
+                this.entity.transform.position.y + this.shape.center.y);
             this.pixelShape2.graphics.endFill();
         }
 

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

@@ -1,5 +1,10 @@
 module es {
     export class CircleCollider extends Collider {
+        private rectShape: egret.Shape = new egret.Shape();
+        private circleShape: egret.Shape = new egret.Shape();
+        private pixelShape1: egret.Shape = new egret.Shape();
+        private pixelShape2: egret.Shape = new egret.Shape();
+
         /**
          * 创建一个有半径的圆
          *
@@ -41,6 +46,46 @@ module es {
             return this;
         }
 
+        public debugRender() {
+            if (!this.rectShape.parent)
+                this.debugDisplayObject.addChild(this.rectShape);
+
+            if (!this.circleShape.parent)
+                this.debugDisplayObject.addChild(this.circleShape);
+
+            if (!this.pixelShape1.parent)
+                this.debugDisplayObject.addChild(this.pixelShape1);
+
+            if (!this.pixelShape2.parent)
+                this.debugDisplayObject.addChild(this.pixelShape2);
+
+            this.rectShape.graphics.clear();
+            this.rectShape.graphics.beginFill(Colors.colliderBounds, 0);
+            this.rectShape.graphics.lineStyle(Size.lineSizeMultiplier, Colors.colliderBounds);
+            this.rectShape.graphics.drawRect(this.bounds.x, this.bounds.y, this.bounds.width, this.bounds.height);
+            this.rectShape.graphics.endFill();
+
+            this.circleShape.graphics.clear();
+            this.circleShape.graphics.beginFill(Colors.colliderEdge, 0);
+            this.circleShape.graphics.lineStyle(Size.lineSizeMultiplier, Colors.colliderEdge);
+            this.circleShape.graphics.drawCircle(this.shape.position.x, this.shape.position.y, (this.shape as Circle).radius);
+            this.circleShape.graphics.endFill();
+
+            this.pixelShape1.graphics.clear();
+            this.pixelShape1.graphics.beginFill(Colors.colliderPosition, 0);
+            this.pixelShape1.graphics.lineStyle(4 * Size.lineSizeMultiplier, Colors.colliderPosition);
+            this.pixelShape1.graphics.moveTo(this.entity.transform.position.x, this.entity.transform.position.y);
+            this.pixelShape1.graphics.lineTo(this.entity.transform.position.x, this.entity.transform.position.y);
+            this.pixelShape1.graphics.endFill();
+
+            this.pixelShape2.graphics.clear();
+            this.pixelShape2.graphics.beginFill(Colors.colliderCenter, 0);
+            this.pixelShape2.graphics.lineStyle(2 * Size.lineSizeMultiplier, Colors.colliderCenter);
+            this.pixelShape2.graphics.moveTo(this.shape.position.x, this.shape.position.y);
+            this.pixelShape2.graphics.lineTo(this.shape.position.x, this.shape.position.y);
+            this.pixelShape2.graphics.endFill();
+        }
+
         public toString() {
             return `[CircleCollider: bounds: ${this.bounds}, radius: ${(this.shape as Circle).radius}]`
         }

source/src/ECS/Components/RenderableComponent.ts

@@ -122,19 +122,20 @@ module es {
             if (!this.pixelShape.parent)
                 this.debugDisplayObject.addChild(this.pixelShape);
 
-            if (!this.entity.getComponent(Collider)){
-                this.hollowShape.graphics.clear();
-                this.hollowShape.graphics.beginFill(Colors.renderableBounds, 0);
-                this.hollowShape.graphics.lineStyle(1, Colors.renderableBounds);
-                this.hollowShape.graphics.drawRect(this.bounds.x, this.bounds.y, this.bounds.width, this.bounds.height);
-                this.hollowShape.graphics.endFill();
-            }
+            // if (!this.entity.getComponent(Collider)){
+            //     this.hollowShape.graphics.clear();
+            //     this.hollowShape.graphics.beginFill(Colors.renderableBounds, 0);
+            //     this.hollowShape.graphics.lineStyle(1, Colors.renderableBounds);
+            //     this.hollowShape.graphics.drawRect(this.bounds.x, this.bounds.y, this.bounds.width, this.bounds.height);
+            //     this.hollowShape.graphics.endFill();
+            // }
 
             let pixelPos = Vector2.add(this.entity.transform.position, this._localOffset);
             this.pixelShape.graphics.clear();
             this.pixelShape.graphics.beginFill(Colors.renderableCenter, 0);
             this.pixelShape.graphics.lineStyle(4, Colors.renderableCenter);
             this.pixelShape.graphics.lineTo(pixelPos.x, pixelPos.y);
+            this.pixelShape.graphics.moveTo(pixelPos.x, pixelPos.y);
             this.pixelShape.graphics.endFill();
         }
 

source/src/ECS/Components/SpriteRenderer.ts

@@ -123,8 +123,10 @@ module es {
         public render(camera: Camera) {
             this.sync(camera);
 
-            if (this.displayObject.x != this.bounds.x) this.displayObject.x = this.bounds.x;
-            if (this.displayObject.y != this.bounds.y) this.displayObject.y = this.bounds.y;
+            let afterPos = new Vector2(this.entity.position.x + this.localOffset.x - this.origin.x - camera.position.x + camera.origin.x,
+                this.entity.position.y + this.localOffset.y - this.origin.y - camera.position.y + camera.origin.y);
+            if (this.displayObject.x != afterPos.x) this.displayObject.x = afterPos.x;
+            if (this.displayObject.y != afterPos.y) this.displayObject.y = afterPos.y;
         }
     }
 }