[MV] Bitmap.blt?

[Ellie]

<div class="javascript" id="{CB}" style="font-family: monospace;"><ol>      bmp = new Bitmap(936, 864);

      hair_bitmap = this.loadBitmap('img/hair/', hair, hue, false);

      body_bitmap = this.loadBitmap('img/bases/', body, hue, false);

      bmp.blt(body_bitmap, 0, 0, 936, 864, 0, 0, 936, 864);

      bmp.blt(hair_bitmap, 0, 0, 936, 864, 0, 0, 936, 864);

      return bmp;

Am I using this right? I'm just getting a blank image.

bmp.blt(source, sx, sy, sw, sh, dx, dy, dw, dh);

So I resume that sw and sh are source width and height, and dw dh are destination width and height. That's fine.

But sx sy, dx dy, I presume are the x,y I am drawing at. Am I right to set these at 0?

I am trying to layer several bitmaps on top of one another.

 

[Xilef]

MV Source apparently;

/**

 * Performs a block transfer.

 *

 * @method blt

 * @param {Bitmap} source The bitmap to draw

 * @param {Number} sx The x coordinate in the source

 * @param {Number} sy The y coordinate in the source

 * @param {Number} sw The width of the source image

 * @param {Number} sh The height of the source image

 * @param {Number} dx The x coordinate in the destination

 * @param {Number} dy The y coordinate in the destination

 * @param {Number} [dw=sw] The width to draw the image in the destination

 * @param {Number} [dh=sh] The height to draw the image in the destination

 */

Bitmap.prototype.blt = function(source, sx, sy, sw, sh, dx, dy, dw, dh) {

    dw = dw || sw;

    dh = dh || sh;

    if (sx >= 0 && sy >= 0 && sw > 0 && sh > 0 && dw > 0 && dh > 0 &&

            sx + sw <= source.width && sy + sh <= source.height) {

        this._context.globalCompositeOperation = 'source-over';

        this._context.drawImage(source._canvas, sx, sy, sw, sh, dx, dy, dw, dh);

        this._setDirty();

    }

};

Line 19 looks interesting with "sx + sw <= source.width && sy + sh <= source.height"; indicates the blit will fail if it goes over the edge of the source bitmap. You need to make sure you're not going over the edge (if your source width/source height is larger than the image's dimensions).

Width and height are properties so I guess this should work;

bmp.blt( body_bitmap, 0, 0, body_bitmap.width, body_bitmap.height, 0, 0 );

If that sure-fire bounds checking fails then can you confirm that load bitmap is working? Try returning one of the loaded bitmaps to see what happens.

I would guess dw/dh controls stretching.

EDIT: Interesting, looks like bitmaps contain draw contexts as well as the draw-surface (canvas). Should be quite easy to attack a bitmap with advanced effects.

Unrelated to your post, could you try this on a bitmap to see what happens?

var gl = my_bitmap._canvas.getContext( "webgl" ) || my_bitmap._canvas.getContext( "experimental-webgl" );

gl.clearColor( 1.0, 0.0, 1.0, 1.0 );

gl.clear( gl.COLOR_BUFFER_BIT );

my_bitmap._setDirty();

If my_bitmap goes pink then that means WebGL can be used directly on an MV bitmap object.

 

[Ellie]

If I return either hair_bitmap or body_bitmap it works. But blt doesn't seem to do anything on either of them if I return them either. Returning bmp gives me a blank image.


As for your code, I get "gl is null".

RPG Maker MV has really, really bad error reporting though (i.e. basically none).

 

[Xilef]

Looking deeper into the source, check if the new bitmap is ready with bmp.isReady(), it could be doing that thing canvas does when everything requires to be performed in onReady() or whatever they want to call it.

There's also isError() that you can try.

Also, try calling bmp.clear() then bmp.fillRect( ... ) on the bitmap to see if you can modify the contents of it (Fill it green to see if you can get a green bitmap returned).

As for my snippet, yeah the context is initialised as 2d by default for bitmaps, so I guess that snippet wouldn't have worked unless you change the constructor for Bitmap. Pretty awesome though as webgl is scattered all over the MV javascript.