Skip to content

Commit 20f63c0

Browse files
committed
Fixed Graphics not working correctly.
1 parent 9479c79 commit 20f63c0

4 files changed

Lines changed: 106 additions & 107 deletions

File tree

13.3 KB
Loading

examples/display/graphics.php

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
<?php
2+
$title = "Canvas Smoothing";
3+
require('../head.php');
4+
?>
5+
6+
<script type="text/javascript">
7+
8+
var graphics;
9+
10+
(function () {
11+
12+
var game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: preload, create: create, update: update, render: render });
13+
14+
function preload() {
15+
16+
game.load.image('atari1', 'assets/sprites/atari130xe.png');
17+
18+
}
19+
20+
21+
function create() {
22+
23+
graphics = game.add.graphics(0, 0);
24+
25+
// set a fill and line style
26+
graphics.beginFill(0xFF3300);
27+
graphics.lineStyle(10, 0xffd900, 1);
28+
29+
// draw a shape
30+
graphics.moveTo(50,50);
31+
graphics.lineTo(250, 50);
32+
graphics.lineTo(100, 100);
33+
graphics.lineTo(250, 220);
34+
graphics.lineTo(50, 220);
35+
graphics.lineTo(50, 50);
36+
graphics.endFill();
37+
38+
// set a fill and line style again
39+
graphics.lineStyle(10, 0xFF0000, 0.8);
40+
graphics.beginFill(0xFF700B, 1);
41+
42+
// draw a second shape
43+
graphics.moveTo(210,300);
44+
graphics.lineTo(450,320);
45+
graphics.lineTo(570,350);
46+
graphics.lineTo(580,20);
47+
graphics.lineTo(330,120);
48+
graphics.lineTo(410,200);
49+
graphics.lineTo(210,300);
50+
graphics.endFill();
51+
52+
// draw a rectangel
53+
graphics.lineStyle(2, 0x0000FF, 1);
54+
graphics.drawRect(50, 250, 100, 100);
55+
56+
// draw a circle
57+
graphics.lineStyle(0);
58+
graphics.beginFill(0xFFFF0B, 0.5);
59+
graphics.drawCircle(470, 200,100);
60+
61+
graphics.lineStyle(20, 0x33FF00);
62+
graphics.moveTo(30,30);
63+
graphics.lineTo(600, 300);
64+
65+
game.add.tween(graphics).to({ x: 200 }, 2000, Phaser.Easing.Linear.None, true, 0, 1000, true);
66+
67+
// graphics.rotation = 1.2;
68+
// graphics.angle = 10;
69+
70+
}
71+
72+
function update() {
73+
}
74+
75+
function render() {
76+
}
77+
78+
})();
79+
</script>
80+
81+
<?php
82+
require('../foot.php');
83+
?>

src/gameobjects/Graphics.js

Lines changed: 22 additions & 99 deletions
Original file line numberDiff line numberDiff line change
@@ -1,124 +1,45 @@
11
Phaser.Graphics = function (game, x, y) {
22

3-
// If exists = false then the Sprite isn't updated by the core game loop or physics subsystem at all
4-
this.exists = true;
3+
PIXI.Graphics.call(this);
54

6-
// This is a handy little var your game can use to determine if a sprite is alive or not, it doesn't effect rendering
7-
this.alive = true;
8-
9-
this.group = null;
10-
11-
this.name = '';
12-
13-
this.game = game;
14-
15-
PIXI.DisplayObjectContainer.call(this);
5+
Phaser.Sprite.call(this, game, x, y);
166

177
this.type = Phaser.GRAPHICS;
188

19-
this.position.x = x;
20-
this.position.y = y;
21-
22-
// Replaces the PIXI.Point with a slightly more flexible one
23-
this.scale = new Phaser.Point(1, 1);
24-
25-
// Influence of camera movement upon the position
26-
this.scrollFactor = new Phaser.Point(1, 1);
27-
28-
// A mini cache for storing all of the calculated values
29-
this._cache = {
30-
31-
dirty: false,
32-
33-
// Transform cache
34-
a00: 1, a01: 0, a02: x, a10: 0, a11: 1, a12: y, id: 1,
35-
36-
// The previous calculated position inc. camera x/y and scrollFactor
37-
x: -1, y: -1,
38-
39-
// The actual scale values based on the worldTransform
40-
scaleX: 1, scaleY: 1
41-
42-
};
43-
44-
this._cache.x = this.x - (this.game.world.camera.x * this.scrollFactor.x);
45-
this._cache.y = this.y - (this.game.world.camera.y * this.scrollFactor.y);
46-
47-
this.renderable = true;
48-
49-
/**
50-
* The alpha of the fill of this graphics object
51-
*
52-
* @property fillAlpha
53-
* @type Number
54-
*/
55-
this.fillAlpha = 1;
56-
57-
/**
58-
* The width of any lines drawn
59-
*
60-
* @property lineWidth
61-
* @type Number
62-
*/
63-
this.lineWidth = 0;
64-
65-
/**
66-
* The color of any lines drawn
67-
*
68-
* @property lineColor
69-
* @type String
70-
*/
71-
this.lineColor = "black";
72-
73-
/**
74-
* Graphics data
75-
*
76-
* @property graphicsData
77-
* @type Array
78-
* @private
79-
*/
80-
this.graphicsData = [];
81-
82-
/**
83-
* Current path
84-
*
85-
* @property currentPath
86-
* @type Object
87-
* @private
88-
*/
89-
this.currentPath = {points:[]};
90-
919
};
9210

93-
Phaser.Graphics.prototype = Phaser.Utils.extend(true, PIXI.Graphics.prototype, PIXI.DisplayObjectContainer.prototype, Phaser.Sprite.prototype);
11+
Phaser.Graphics.prototype = Object.create( PIXI.Graphics.prototype );
9412
Phaser.Graphics.prototype.constructor = Phaser.Graphics;
9513

14+
Phaser.Graphics.prototype = Phaser.Utils.extend(true, Phaser.Graphics.prototype, Phaser.Sprite.prototype);
15+
9616
// Add our own custom methods
9717

9818
/**
9919
* Automatically called by World.update
10020
*/
101-
Phaser.Graphics.prototype.update = function() {
21+
Phaser.Graphics.prototype.OLDupdate = function() {
10222

103-
if (!this.exists)
104-
{
105-
return;
106-
}
23+
// if (!this.exists)
24+
// {
25+
// return;
26+
// }
10727

108-
this._cache.dirty = false;
28+
// this._cache.dirty = false;
10929

110-
this._cache.x = this.x - (this.game.world.camera.x * this.scrollFactor.x);
111-
this._cache.y = this.y - (this.game.world.camera.y * this.scrollFactor.y);
30+
// this._cache.x = this.x - (this.game.world.camera.x * this.scrollFactor.x);
31+
// this._cache.y = this.y - (this.game.world.camera.y * this.scrollFactor.y);
11232

113-
if (this.position.x != this._cache.x || this.position.y != this._cache.y)
114-
{
115-
this.position.x = this._cache.x;
116-
this.position.y = this._cache.y;
117-
this._cache.dirty = true;
118-
}
33+
// if (this.position.x != this._cache.x || this.position.y != this._cache.y)
34+
// {
35+
// this.position.x = this._cache.x;
36+
// this.position.y = this._cache.y;
37+
// this._cache.dirty = true;
38+
// }
11939

12040
}
12141

42+
/*
12243
Object.defineProperty(Phaser.Graphics.prototype, 'angle', {
12344
12445
get: function() {
@@ -154,3 +75,5 @@ Object.defineProperty(Phaser.Graphics.prototype, 'y', {
15475
}
15576
15677
});
78+
79+
*/

src/utils/Utils.js

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -87,13 +87,6 @@ Phaser.Utils = {
8787
return true;
8888
},
8989

90-
91-
// deep, target, objects to copy to the target object
92-
// This is a slightly modified version of jQuery.extend (http://api.jquery.com/jQuery.extend/)
93-
// deep (boolean)
94-
// target (object to add to)
95-
// objects ... (objects to recurse and copy from)
96-
9790
/**
9891
* This is a slightly modified version of jQuery.extend (http://api.jquery.com/jQuery.extend/)
9992
* @method extend
@@ -156,7 +149,7 @@ Phaser.Utils = {
156149
}
157150

158151
// Never move original objects, clone them
159-
target[name] = extend(deep, clone, copy);
152+
target[name] = Phaser.Utils.extend(deep, clone, copy);
160153

161154
// Don't bring in undefined values
162155
}

0 commit comments

Comments
 (0)