Skip to content

Commit

Permalink
Adding RoundedRectangle support
Browse files Browse the repository at this point in the history
Also refactored Graphic base-class to provide common support for generating UV coordinates.
Push vertex/index buffer generation down into base class.
Updated Graphics-API example.
  • Loading branch information
jonathanrpace committed Dec 8, 2012
1 parent a8f5e0e commit 907f55d
Show file tree
Hide file tree
Showing 19 changed files with 628 additions and 535 deletions.
177 changes: 46 additions & 131 deletions examples/01_Graphics_API_Example/src/GraphicsAPIExample.as
Original file line number Diff line number Diff line change
Expand Up @@ -9,13 +9,13 @@ package

public class GraphicsAPIExample extends Sprite
{
[Embed( source = "/assets/Rock2.png" )]
[Embed( source = "/assets/Rock.png" )]
private var RockBMP :Class;

[Embed( source = "/assets/Checker.png" )]
private var CheckerBMP :Class;

[Embed( source = "/assets/marble_80x80.png" )]
[Embed( source = "/assets/Marble.png" )]
private var MarbleBMP :Class;

[Embed( source = "/assets/Grass.png" )]
Expand All @@ -28,164 +28,79 @@ package

private function onAdded ( e:Event ):void
{
var top:int = 0;
var left:int = 0;
var right:int = 100;
var bottom:int = 100;

var fillColor:uint = 0x08acff;
var fillAlpha:Number = 1;
var strokeColor:int = 0xc07732;
var strokeAlpha:Number = 1;
var strokeThickness:int = 3;

var rockTexture:Texture = Texture.fromBitmap( new RockBMP(), false );
var grassTexture:Texture = Texture.fromBitmap( new GrassBMP(), false );
var checkerTexture:Texture = Texture.fromBitmap( new CheckerBMP(), false );
var marbleTexture:Texture = Texture.fromBitmap( new MarbleBMP(), false );

// Rect drawn with drawRect()
var shape:Shape = new Shape();
addChild(shape);
shape.x = 20;
shape.y = 20;

shape.x = 100;
shape.y = 100;

shape.graphics.beginFill(fillColor, fillAlpha);
shape.graphics.lineStyle(strokeThickness, strokeColor, strokeAlpha);
shape.graphics.drawRect(top, left, right, bottom);
// Rect drawn with drawRect()
shape.graphics.beginFill(0x8dc63f);
shape.graphics.drawRect(0, 0, 100, 100);
shape.graphics.endFill();

var m:Matrix = new Matrix();

// Rect drawn with lineTo()
shape = new Shape();
addChild(shape);

shape.x = 300;
shape.y = 100;

shape.graphics.beginFill(fillColor, 0.2);
shape.graphics.lineStyle(5, 0xFF0000, strokeAlpha);
shape.graphics.moveTo(left, top);
shape.graphics.lineTo(right, top);
shape.graphics.lineTo(right, bottom);
shape.graphics.lineTo(left, bottom);
shape.graphics.lineTo(left, top);

shape.graphics.beginFill(0xc72046);
shape.graphics.moveTo(110, 0);
shape.graphics.lineTo(210, 0);
shape.graphics.lineTo(210, 100);
shape.graphics.lineTo(110, 100);
shape.graphics.lineTo(110, 0);
shape.graphics.endFill();


// Filled Circle
shape = new Shape();
addChild(shape);

shape.x = 150;
shape.y = 300;

shape.graphics.beginFill(fillColor, 0.2);
shape.graphics.lineStyle(5, 0x00FF00, strokeAlpha);
shape.graphics.drawCircle(0, 0, 50);
// Rounded rect
shape.graphics.lineStyle(2,0xFFFFFF);
shape.graphics.beginFill(0x0957c0);
shape.graphics.drawRoundRect( 220, 0, 100, 100, 20 );
shape.graphics.endFill();
shape.graphics.lineStyle();


// Line Ellipse
shape = new Shape();
addChild(shape);

shape.x = 350;
shape.y = 300;

shape.graphics.lineStyle(3, 0x0000FF, strokeAlpha);
shape.graphics.drawEllipse(0, 0, 75, 50);


// 2 Triangles in one Shape
shape = new Shape();
addChild(shape);

shape.x = 500;
shape.y = 100;

m.identity();
m.translate(1,5);
m.scale(2,2);
m.rotate(25)
shape.graphics.beginTextureFill(checkerTexture,m);
shape.graphics.lineStyle(2, 0xFF0000, 0.5);
shape.graphics.moveTo(left, top);
shape.graphics.lineTo(right, bottom);
shape.graphics.lineTo(left, bottom);
shape.graphics.lineTo(left, top);

// Filled Circle
shape.graphics.beginFill(0xfcc738);
shape.graphics.drawCircle(380, 50, 50);
shape.graphics.endFill();

var xOffset:uint = 140;
shape.graphics.beginFill(fillColor, 0.2);
shape.graphics.lineStyle(2, 0xFF0000, 0.5);
shape.graphics.moveTo(left + xOffset, top);
shape.graphics.lineTo(right + xOffset, bottom);
shape.graphics.lineTo(left + xOffset, bottom);
shape.graphics.lineTo(left + xOffset, top);

// Complex rounded rect
shape.graphics.beginFill(0xff7b00);
shape.graphics.drawRoundRectComplex( 0, 110, 430, 100, 0, 20, 40, 80 );
shape.graphics.endFill();

// Stroked ellipse
shape.graphics.lineStyle(6, 0x00bff3);
shape.graphics.drawEllipse(490, 105, 100, 200);

// Multiple moveTo() test
shape = new Shape();
addChild(shape);

shape.x = 500;
shape.y = 250;

shape.graphics.lineStyle(2, 0x000000, 0.5);
shape.graphics.lineTo(100, 0);
shape.graphics.moveTo(0,30);
shape.graphics.lineTo(100, 30);
shape.graphics.moveTo(0,60);
shape.graphics.lineTo(100, 60);

// Triangle with CheckerBMP
shape = new Shape();
addChild(shape);



shape.x = 100;
shape.y = 400;

shape.graphics.beginBitmapFill(new CheckerBMP().bitmapData, m);
shape.graphics.lineStyle(2, 0xFF0000, 0.5);
shape.graphics.moveTo(left, top);
shape.graphics.lineTo(right, bottom);
shape.graphics.lineTo(left, bottom);
shape.graphics.lineTo(left, top);
shape.graphics.lineStyle(2, 0xFFFFFF, 1);
for ( var i:int = 0; i < 4; i++ )
{
shape.graphics.moveTo(0, 220+i*20);
shape.graphics.lineTo(550, 220+i*20);
}

// Textured fill
shape.graphics.lineStyle(-1);
shape.graphics.beginTextureFill(checkerTexture);
shape.graphics.moveTo(0, 300);
shape.graphics.lineTo(100, 400);
shape.graphics.lineTo(0, 400);
shape.graphics.lineTo(0, 300);
shape.graphics.endFill();


// Marble
shape = new Shape();
addChild(shape);

shape.x = 350;
shape.y = 450;

shape.graphics.beginBitmapFill(new MarbleBMP().bitmapData);
shape.graphics.lineStyle(2, 0x0000FF, strokeAlpha);
shape.graphics.drawCircle(0, 0, 32);
shape.graphics.beginTextureFill(marbleTexture);
shape.graphics.lineStyle(2, 0xFFFFFF, 1);
shape.graphics.drawCircle(150, 364, 32);
shape.graphics.endFill();


// Rect drawn with textured fill and stroke
shape = new Shape();
addChild(shape);
shape.x = 500;
shape.y = 400;

shape.graphics.beginTextureFill(rockTexture);
shape.graphics.lineTexture(20, grassTexture);
shape.graphics.drawRect(top, left, right, bottom);
shape.graphics.drawRect(0, 450, 550, 100);
shape.graphics.endFill();

}
}
}
Expand Down
4 changes: 2 additions & 2 deletions examples/01_Graphics_API_Example/src/Main.as
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ package

import starling.core.Starling;

[SWF( width="800", height="600", backgroundColor="#CCCCCC", frameRate="60" )]
[SWF( width="600", height="600", backgroundColor="#232323", frameRate="60" )]
public class Main extends Sprite
{
private var starling :Starling;
Expand All @@ -18,7 +18,7 @@ package

starling = new Starling( GraphicsAPIExample, stage );

starling.antiAliasing = 1;
starling.antiAliasing = 0;
starling.start();
}

Expand Down
Binary file not shown.
Binary file modified examples/01_Graphics_API_Example/src/assets/Rock.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
6 changes: 5 additions & 1 deletion examples/03_Profiling_Example/src/Profiling.as
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
package
{
import flash.display.Bitmap;
import flash.utils.getTimer;

import starling.core.Starling;
import starling.display.Shape;
Expand All @@ -16,6 +17,8 @@ package

private var checkerBMP :Bitmap;

private var startTime :int;

public function Profiling()
{
addEventListener(Event.ADDED_TO_STAGE, onAdded);
Expand All @@ -28,6 +31,7 @@ package

checkerBMP = new CheckerBMP();

startTime = getTimer();
addEventListener(Event.ENTER_FRAME, enterFrameHandler);
}

Expand All @@ -45,7 +49,7 @@ package
numFrames++;
if ( numFrames == 500 )
{
trace("Finished");
trace("Total time: " + String(getTimer()-startTime));
removeEventListener(Event.ENTER_FRAME, enterFrameHandler);
}
}
Expand Down
4 changes: 2 additions & 2 deletions examples/04_Fill_Stroke_Example/src/FillStrokeExample.as
Original file line number Diff line number Diff line change
Expand Up @@ -156,7 +156,7 @@ package
triangleFan.y = y2;
triangleFan.rotation = Math.random() * 360;
leaves.push(triangleFan);
triangleFan.addVertex(0, 0, 0xFFFFFF, 1, 0, 1);
triangleFan.addVertex(0, 0, 0, 1);
var radius:Number = 30 + Math.random() * 30;
var numBumps:int = 2 + Math.random() * 1;
var bumpSize:Number = 5 + Math.random() * 5;
Expand All @@ -172,7 +172,7 @@ package
trace(Math.sin( (angle * 2) % Math.PI ));
//currRadius += Math.random() * 5;

triangleFan.addVertex( nx * currRadius, ny * currRadius, 0xFFFFFF, 1, ratio, 0 );
triangleFan.addVertex( nx * currRadius, ny * currRadius, ratio, 0 );
}

continue;
Expand Down
10 changes: 9 additions & 1 deletion examples/06_Primitives_Example/src/PrimitivesExample.as
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,9 @@ package
import starling.display.Sprite;
import starling.display.graphics.NGon;
import starling.display.graphics.Plane;
import starling.display.graphics.RoundedRectangle;
import starling.display.materials.StandardMaterial;
import starling.display.materials.TextureMaterial;
import starling.display.shaders.fragment.TextureFragmentShader;
import starling.display.shaders.fragment.VertexColorFragmentShader;
import starling.display.shaders.vertex.StandardVertexShader;
Expand Down Expand Up @@ -46,13 +48,19 @@ package
addChild(nGonB);

nGonC = new NGon(100, 50, 50, -5, 356);
nGonC.x = 300;
nGonC.x = 340;
nGonC.y = 200;
nGonC.material = new StandardMaterial( new StandardVertexShader(), new TextureFragmentShader() );
nGonC.material.textures[0] = Texture.fromBitmap( new CheckerBMP() );
nGonC.material.color = 0x9900FF;
addChild(nGonC);

var roundedRect:RoundedRectangle = new RoundedRectangle(200, 100, 10, 20, 30, 40);
roundedRect.material = new TextureMaterial( Texture.fromBitmap( new CheckerBMP() ) );
roundedRect.x = 20;
roundedRect.y = 140;
addChild(roundedRect);

Starling.current.nativeStage.addEventListener(MouseEvent.MOUSE_MOVE, onMouseMove);
}

Expand Down
Binary file modified extension/bin/Starling-Extension-Graphics.swc
Binary file not shown.
Loading

0 comments on commit 907f55d

Please sign in to comment.