Picture/Image masking plugin, simple graphic effect.

Joined
Jun 30, 2017
Messages
40
Reaction score
30
First Language
spanish
Primarily Uses
RMMV
This is:
A simple plugin, allows to use a picture image as a graphic mask of another picture image.

image mask?? Using a picture Mask on a Object makes the areas with white pixels on the Mask visible on Object, and areas with black pixels invisible.


1.jpeg

This allows to create a lot of interesting animated things like portals with moving stars inside, monitors with rotataing images, screens with scrolling text, windows with a moving landscape... and you can do it only with normal rpg maker pictures.

Demo Video:
Here a video showing a simple usage case:


Another example:


Video

Howto:

Download MaskPlugin.js to you js/plugins folder.
Enable the plugin on tools>plugin manager

Plugin Commands:

SETMASK object_picture_id mask_picture_id

REMOVEMASK object_picture_id

License:
This is a simple plugin, allowed on comercial or not comercial games. Free to share, modify, adapt, copy, resell... Credit not required.

Known Issues (mainly android)

This plugin requires WebGL, on desktop webgl is usually used by default, on android rpg maker mv uses Canvas mode. There are ways to force WebGL into android devices, but at the cost of stability.

Running WebGL on Android is tricky and can work on some devices while crashing on other devices.


More Issues?

Write a comment.
 

Attachments

Last edited:

MushroomCake28

KAMO Studio
Global Mod
Joined
Nov 18, 2015
Messages
2,923
Reaction score
3,952
First Language
English
Primarily Uses
RMMV
Very nice.

Could you please give a bit more details on the license? Free to use in any form, that's clear enough, but is credits required? Repost allowed? Edits allowed? Please add this information to your post. Thank you.
 

Hisao Shou

Veteran
Veteran
Joined
Jan 8, 2015
Messages
133
Reaction score
16
Primarily Uses
Is this plugin working only with pixijs?
I'm asking because so far have been issues with Pixi effects on Android devices (since it runs mainly Canvas not Webgl)
 
Joined
Jun 30, 2017
Messages
40
Reaction score
30
First Language
spanish
Primarily Uses
RMMV
Is this plugin working only with pixijs?
I'm asking because so far have been issues with Pixi effects on Android devices (since it runs mainly Canvas not Webgl)
PixiJs is always used, but as you pointed, lot of effects are WebGL-only,
and masking is not an exception :(

Just run a test forcing canvas mode, and the mask is not applied.

Post edited to add a warning about this plugin not running on canvas mode.

Unfortunately, i think a canvas alternative is not viable.
 

ShadowDragon

Veteran
Veteran
Joined
Oct 8, 2018
Messages
1,705
Reaction score
562
First Language
Dutch
Primarily Uses
RMMV
idk if its possible, but can you also move the pixture around?
like it has ground, and light goes on, some sighns are shown that will be inside that?

if so, it will defenitly come in hadny in a mechanic I went on eventing, but this will make
it much easier :D
 
Joined
Jun 30, 2017
Messages
40
Reaction score
30
First Language
spanish
Primarily Uses
RMMV
idk if its possible, but can you also move the pixture around?
like it has ground, and light goes on, some sighns are shown that will be inside that?

if so, it will defenitly come in hadny in a mechanic I went on eventing, but this will make
it much easier :D
I am not sure about what you want to do with "like it has ground, and light goes on".
You can move pictures around like normal pictures, rotate them, apply blending modes...
Pictures with a mask attached will be visible only when their pixels are over the mask white pixels.

You can set the same mask to many pictures also.

Maybe you are trying to do something like this?


Note: You can do this as a 'trick', but this is not a 'ray-casting' plugin. If you need complex light processing this is not the way to go. This plugin is more suited to things like monitors, televisors, cinema screens, portals... with moving/scrolling images inside of them.

If you provide a more detailed example of what you need, or a concept image I will try my best to help :)
 
Last edited:

ShadowDragon

Veteran
Veteran
Joined
Oct 8, 2018
Messages
1,705
Reaction score
562
First Language
Dutch
Primarily Uses
RMMV
more, you are in a dark area or a very light area, so all walls are visible,
when you have a lens, see it as Golden Sun's Ivan's skill "Reveal", everything
in that area is visible, which is not shown in normal view, while "reveal" is only
around the character, I want to use the mouse or arrows to move the picture around,
which can show hidden items/symbols when its hover over it.
 
Joined
Jun 30, 2017
Messages
40
Reaction score
30
First Language
spanish
Primarily Uses
RMMV
more, you are in a dark area or a very light area, so all walls are visible,
when you have a lens, see it as Golden Sun's Ivan's skill "Reveal", everything
in that area is visible, which is not shown in normal view, while "reveal" is only
around the character, I want to use the mouse or arrows to move the picture around,
which can show hidden items/symbols when its hover over it.
Yes, this is doable.

example.jpg

^ here, "mask" is a white sphere image, you can make that image 'attached' to the player via a paralell event.

A,B & C are pictures with mask set to "MASK" sphere. So only visible when the player approaches and the white sphere covers A,B or C.

Because the white sphere is used as a mask of another image, the white sphere is not visible. Their only purpose is to show/hide the objects its masking.

You can use a gradient sphere too, to make objects more visible as they approach the center of the sphere.

In this example A is not visible, B is visible and C is only half-visible.
 

ShadowDragon

Veteran
Veteran
Joined
Oct 8, 2018
Messages
1,705
Reaction score
562
First Language
Dutch
Primarily Uses
RMMV
the idea is more player cant move, move can move picture around to find object,
if that is not possible, a flashlight or that one on the pictuer is a nice alternate,

are you able to make a tiny demo of it (remove sounds, tilesets, and stuff not needed)
so its around 5-10mb, I learn better from testing than from text (personally though).

But it come very handy if I get it the work I like :), saves me a bounch of vars and switches :p
 
Joined
Jun 30, 2017
Messages
40
Reaction score
30
First Language
spanish
Primarily Uses
RMMV
the idea is more player cant move, move can move picture around to find object,
if that is not possible, a flashlight or that one on the pictuer is a nice alternate,

are you able to make a tiny demo of it (remove sounds, tilesets, and stuff not needed)
so its around 5-10mb, I learn better from testing than from text (personally though).

But it come very handy if I get it the work I like :), saves me a bounch of vars and switches :p
For the flashlight alternative: use a image like this as a mask, check on a parallel event for player position and facing direction to reposition/rotate the flashlight.

lanternmask.png


For the 'spell' alternative:

When the spell is fired put some flashlight-switch to ON to allow a parallel event to run.

On that parallel event:

Code:
stop player movement
move sphere to a starting position (player, or screen center, or... )

LOOP while cancel not pressed
   if up pressed: move mask sphere x pixels up
   if down pressed: move mask sphere x pixels down
   ...and so on...
END LOOP

put sphere outside screen (-1000px,-1000px for example)
allow player movement
switch of
Note: Move the mask sphere outside of screen instead of removing the mask.
If you erase the mask image then the other images are unmasked and become visible.

Demo:
In a few days, I will try to make a demo project showing how to apply some of these effects, and I will also add an extra examples for that two magic effects (lantern/reveal skill) :)
 

ShadowDragon

Veteran
Veteran
Joined
Oct 8, 2018
Messages
1,705
Reaction score
562
First Language
Dutch
Primarily Uses
RMMV
when the demo is there, I will download it :) and see if I can make something work with moving
the picture using the mouse. but its a lovely plugin, small but effective. There are many possibilities,
specially for those using title menu's than can give some nice effect to it like the video and DEMO text.
 

Users Who Are Viewing This Thread (Users: 0, Guests: 1)

Latest Threads

Latest Posts

Latest Profile Posts

Managed to find a way to hang a bed cover over my window. So no more being toasted alive in the afternoon!:kaoswt2:
So, uh, has anyone tried buying any resources from KokoroReflections? Because I've been looking for a 'buy' button on the site for like 10 minutes now and can't find one.
Any also thought it's too cringy to put the word "and you" in your credit as a special thanks?
Cause that's what I thought...
Everyone in the US right now: Please stay safe.
Symphony Celestia: Prophecy of the Falling Stars RPG Maker music pack WIP. Symphony Celestia is a new series that focuses on symphonic and orchestrated music to tell a story. Each story will include compositions that make up that story from beginning to end. Themes include: Battles, adventures, character themes, etc. Below is a video preview to the first story.

Forum statistics

Threads
97,982
Messages
948,350
Members
129,248
Latest member
connoruption
Top