starling\display\materials\graphics\plane

[vjroger]

Hi there,

first of all: I just love this graphics extention! i'm trying to use the extension called "plane" i think it has nice posibilities for warping images by transforming its uvcoordinates But... I cant get it to work. i tried adding it to stage like this:

        grid = new Plane(1,1,10,10);
        grid.material = new StandardMaterial( new StandardVertexShader(), new TextureVertexColorFragmentShader() );
        grid.material.textures[0] = Texture.fromBitmap( new CheckerBMP(), false );
        addChild(grid);

can you please help me out?

greetings,

Rogier de Leeuw

[jonathanrpace]

Hmmm . . . looks like you're doing everything right. I'll look into this later today.

[jonathanrpace]

I think I've spotted the problem. The first two parameters of the constructor are the width/height of the plane in pixels. In your example you're setting this to 1,1, which is very small. Could you try something a bit bigger and let me know if you still have problems?

I like your idea for using a sub-divided plane as a basis for warping. Though you may be able to get per-pixel accurate results with a 1x1 plane and an appropriate pixel shader.

[vjroger]

Thanx, I will increase its size tomorrow. The reason I want to use it as warp is because I cant use shaders when i want to compile to ios

greetings,

Rogier

On Sat, Nov 3, 2012 at 8:14 PM, Jonathan Pace notifications@github.comwrote:

I think I've spotted the problem. The first two parameters of the constructor are the width/height of the plane in pixels. In your example you're setting this to 1,1, which is very small. Could you try something a bit bigger and let me know if you still have problems?

I like your idea for using a sub-divided plane as a basis for warping. Though you may be able to get per-pixel accurate results with a 1x1 plane and an appropriate pixel shader.

— Reply to this email directly or view it on GitHubhttps://github.com/unwrong/Starling-Extension-Graphics/issues/17#issuecomment-10042998.

[vjroger]

Hey Jonathan,

you were right! But i think there is still a problem with the calculation of the indices:

// Generate indices indices = new Vector.(); var numQuads:int = (_numVerticesX-1) * (_numVerticesY-1); for ( i = 0; i <numQuads; i++ ) { indices.push( i, i+1, i+_numVerticesX+1, i+_numVerticesX+1, i+_numVerticesX, i ); }

i guess the var "numQuads" generates too few vertices. I got it to work by the following hack:

// Generate indices indices = new Vector.(); var numIndices:int = (_numVerticesX) * (_numVerticesY-1)-1; for ( i = 0; i <numIndices; i++ ) { indices.push( i, i+1, i+_numVerticesX+1, i+_numVerticesX+1, i+_numVerticesX, i ); }

Anyway, i think working with these grids seems to me to be an good alternative for the existing 9scale and 25scale. The existing ones make use of render-to-texture so i think using meshes is a better way to achieve the same.

greetings,

Rogier

On Sun, Nov 4, 2012 at 2:44 AM, Rogier de Leeuw vjroger@gmail.com wrote:

Thanx, I will increase its size tomorrow. The reason I want to use it as warp is because I cant use shaders when i want to compile to ios

greetings,

Rogier

On Sat, Nov 3, 2012 at 8:14 PM, Jonathan Pace notifications@github.comwrote:

I think I've spotted the problem. The first two parameters of the constructor are the width/height of the plane in pixels. In your example you're setting this to 1,1, which is very small. Could you try something a bit bigger and let me know if you still have problems?

I like your idea for using a sub-divided plane as a basis for warping. Though you may be able to get per-pixel accurate results with a 1x1 plane and an appropriate pixel shader.

— Reply to this email directly or view it on GitHubhttps://github.com/unwrong/Starling-Extension-Graphics/issues/17#issuecomment-10042998.

[vjroger]

Hi Jonathan,

Forgive me if i'm wrong but i have altered the validate() function:

    public function validate():void
    {
        if (vertexBuffer)
        {
            vertexBuffer.dispose();
            indexBuffer.dispose();
        }

        // Generate vertices
        var numVertices:int = _numVerticesX * _numVerticesY;
        vertices = new Vector.<Number>();

        for (var j:int = 0; j < _numVerticesY; j++){
        for (var i:int = 0; i < _numVerticesX; i++){

            var u:Number = i / (_numVerticesX - 1);
            var v:Number = j / (_numVerticesY - 1);
            var x:Number =  _width*u
            var y:Number = _height*v

            vertices.push( x, y, 0, 1, 1, 1, 1, u, v );
        }}

        // Generate indices
        indices = new Vector.<uint>();
        var qn:int = 0; //quad number
        for (var n:int = 0; n <_numVerticesX-1; n++) //create quads out of the vertices
        {               
            for (var m:int = 0; m <_numVerticesY - 1; m++)
            {

              indices.push(qn, qn + 1, qn + _numVerticesX ); //upper face
              indices.push(qn + _numVerticesX, qn + _numVerticesX  + 1, qn+1); //lower face

              qn++; //jumps to next quad
            }
            qn++; // jumps to next row
        }

        // Upload vertex/index buffers.
        vertexBuffer = Starling.context.createVertexBuffer(numVertices,VERTEX_STRIDE);
        vertexBuffer.uploadFromVector( vertices, 0, numVertices );
        indexBuffer = Starling.context.createIndexBuffer(indices.length);
        indexBuffer.uploadFromVector( indices, 0, indices.length );
    }

it would be nice to add some features like setTexCoords and setCoords.

greetings,

Rogier

[jonathanrpace]

Hey Rogier,

You're absolutely right. The index generation code was broken - I've merged your fix into the trunk https://github.com/unwrong/Starling-Extension-Graphics/commit/6d13265bd6e529b1ffc2d0287eb4f4c5ad6fe238

Thanks for the fix!

You'll also notice I've added a 'vertexFunction' property on plane. This is a reference to a function that is called when generating the data for each vertex. You can override this with your own implementation

var plane:Plane = new Plane(100,100,4,4)
plane.vertexFunction = myCustomVertexFunction
...
function myCustomVertexFunction( column:int, row:int, width:Number, height:Number, numVerticesX:int, numVerticesY:int, output:Vector.<Number>, uvMatrix:Matrix = null ):void
{
    ...
    output.push( x, y, z, r, g, b, a, u, v );
}

The default behaviour has been moved into 'defaultVertexFunction()' - if you use this as a reference, you should be able to build your plane's vertices however you want.