MV - "showPicture" anchor z change ??

● ARCHIVED · READ-ONLY
Started by dopan 7 posts View original ↗
  1. dopan
    #1 Source
    Hi^^
    i try to build a plugin and i have problems to manipulate the "anchor z" of pictures..
    (i mean pictures that are used with "show picture" )

    i tried to read other plugins to see how they solved it, but they seem to build their own img loading functions..

    All i want to archieve is to be able to display pictures above tiles but below Player/Event ect

    best would be to have the switch/script option to decide the z anchor, or to decide if "normal"-anchor or "below player/events anchor"..


    I am looking for the most simple solutions, i dont want to build a whole bitmap loading system..

    thx
    --------
    edit
    sideNote:
    i am loading these imgs on regions, so i cant use solutions that require "chars" like events/player/follower ect
  2. caethyril
    #2 Source
    The z property is a custom sort mechanism used by the _compareChildOrder method of Tilemap (rmmz_core.js). By default the tilemap contains tiles, characters, airship shadow, balloons, animations, and the destination sprite. Pictures are contained in a separate sprite, added after the tilemap, which is why they display on top of all of these.

    So you could simply change the picture container's parent and assign it a z-value, e.g.
    plugin code
    JavaScript:
    /*:
 * @target MZ
 * @plugindesc Change the z-layer for pictures.
 * @help Free to use and/or modify for any project, no credit required.
 */
void (alias => {
  Spriteset_Map.prototype.createPictures = function() {
    alias.apply(this, arguments);
    const p = this._pictureContainer;
    this.removeChild(p);
    this._tilemap.addChild(p);
    p.z = 0.5;
  };
})(Spriteset_Map.prototype.createPictures);
    Note that this will affect all pictures. If you want different z-values for different pictures, you'll need some extra structure.

    For reference, here are the default z-values, from Tilemap#_createLayers (rmmz_core.js):
    default tilemap child z values
    0 : Lower tiles 1 : Lower characters 3 : Normal characters 4 : Upper tiles 5 : Upper characters 6 : Airship shadow 7 : Balloon 8 : Animation 9 : Destination
  3. dopan
    #3 Source
    caethyril said:
    The z property is a custom sort mechanism used by the _compareChildOrder method of Tilemap (rmmz_core.js). By default the tilemap contains tiles, characters, airship shadow, balloons, animations, and the destination sprite. Pictures are contained in a separate sprite, added after the tilemap, which is why they display on top of all of these.

    So you could simply change the picture container's parent and assign it a z-value, e.g.
    plugin code
    JavaScript:
    /*:
 * @target MZ
 * @plugindesc Change the z-layer for pictures.
 * @help Free to use and/or modify for any project, no credit required.
 */
void (alias => {
  Spriteset_Map.prototype.createPictures = function() {
    alias.apply(this, arguments);
    const p = this._pictureContainer;
    this.removeChild(p);
    this._tilemap.addChild(p);
    p.z = 0.5;
  };
})(Spriteset_Map.prototype.createPictures);
    Note that this will affect all pictures. If you want different z-values for different pictures, you'll need some extra structure.

    For reference, here are the default z-values, from Tilemap#_createLayers (rmmz_core.js):
    default tilemap child z values
    0 : Lower tiles 1 : Lower characters 3 : Normal characters 4 : Upper tiles 5 : Upper characters 6 : Airship shadow 7 : Balloon 8 : Animation 9 : Destination
    i assume that this is the same in rpg MV ??
    ( my question was about mv but you mentioned mz )

    - i allready thought about manipulating shadow sprites, or to use their sprite functions as rolemodel for a custom function..

    But i think your solution is better and i should be able to build extra structure that checks, if i wanna use the default function or my edited version^^

    edit 1
    in mv i could not find any function that is called:
    "Spriteset_Map.prototype.createPicture"

    rpg_sprites.js v1.6.1 (community-1.3b)
    -not sure if i am allowed to add the default plugin to this post if thats required to read it yourself


    edit 2 @ caethyril

    by tracking $gameScreen.maxPictures(), which obviously must be part of the function,.. i found this:

    SideNote for others that might want to use the MZ solution above:
    i looked into both MZ and MV and it seems its in both cases Spriteset_Base and not Spriteset_Map.
    in spoiler i add the default MZ function just to show it)
    default MZ function
    JavaScript:
    Spriteset_Base.prototype.createPictures = function() {
    const rect = this.pictureContainerRect();
    this._pictureContainer = new Sprite();
    this._pictureContainer.setFrame(rect.x, rect.y, rect.width, rect.height);
    for (let i = 1; i <= $gameScreen.maxPictures(); i++) {
        this._pictureContainer.addChild(new Sprite_Picture(i));
    }
    this.addChild(this._pictureContainer);
};

    So caethyrils mz solution would look like this:

    JavaScript:
    void (alias => {
  Spriteset_Base.prototype.createPictures = function() {
    alias.apply(this, arguments);
    const p = this._pictureContainer;
    this.removeChild(p);
    this._tilemap.addChild(p);
    p.z = 0.5;
  };
})(Spriteset_Base.prototype.createPictures);


    Default MV function:
    JavaScript:
    Spriteset_Base.prototype.createPictures = function() {

    var width = Graphics.boxWidth;

    var height = Graphics.boxHeight;

    var x = (Graphics.width - width) / 2;

    var y = (Graphics.height - height) / 2;

    this._pictureContainer = new Sprite();

    this._pictureContainer.setFrame(x, y, width, height);

    for (var i = 1; i <= $gameScreen.maxPictures(); i++) {

        this._pictureContainer.addChild(new Sprite_Picture(i));

    }

    this.addChild(this._pictureContainer);

};

    could you help me out how the MV equivalent to your mz code above would be in this case?

    edit3
    another question:
    why removing the child? if i dont run the default function, i should not require to remove it?
    - did your solution trigger after the default solution was used?
    (there is some mz code that i dont understand but i guess what you did was adding code behind the default function, to not overwright the default function)
  4. caethyril
    #4 Source
    Oops. Luckily, RMMV and RMMZ have an identical design here: the plugin code I provided works as-is in the latest version of RMMV.

    If you are using an older version of RMMV, you may need to use ES5 syntax instead, e.g.
    plugin code (ES5)
    JavaScript:
    /*:
 * @target MV MZ
 * @plugindesc Change the z-layer for pictures.
 * @help Free to use and/or modify for any project, no credit required.
 */
void (function(alias) {
  Spriteset_Map.prototype.createPictures = function() {
    alias.apply(this, arguments);
    var p = this._pictureContainer;
    this.removeChild(p);
    this._tilemap.addChild(p);
    p.z = 0.5;
  };
})(Spriteset_Map.prototype.createPictures);
    Basically, this just adds some code to the map scene's createPictures method. The current definition of the Spriteset_Map.prototype.createPictures function is stored in a local variable, alias. Then Spriteset_Map.prototype.createPictures is redefined so that it calls alias and does some extra things afterwards. This is for optimal compatibility, and to avoid rewriting code that's already been written.

    By default the child is added directly to the spriteset. If we didn't remove it, then I believe it would be displayed twice: once on the spriteset, and once on the tilemap.

    Spriteset_Map inherits from Spriteset_Base. By default Spriteset_Map has no specific override for the createPictures method, so it uses the definition from Spriteset_Base. You can find more details on JavaScript's inheritance model here:
  5. dopan
    #5 Source
    caethyril said:
    Oops. Luckily, RMMV and RMMZ have an identical design here: the plugin code I provided works as-is in the latest version of RMMV.

    If you are using an older version of RMMV, you may need to use ES5 syntax instead, e.g.
    plugin code (ES5)
    JavaScript:
    /*:
 * @target MV MZ
 * @plugindesc Change the z-layer for pictures.
 * @help Free to use and/or modify for any project, no credit required.
 */
void (function(alias) {
  Spriteset_Map.prototype.createPictures = function() {
    alias.apply(this, arguments);
    var p = this._pictureContainer;
    this.removeChild(p);
    this._tilemap.addChild(p);
    p.z = 0.5;
  };
})(Spriteset_Map.prototype.createPictures);
    Basically, this just adds some code to the map scene's createPictures method. The current definition of the Spriteset_Map.prototype.createPictures function is stored in a local variable, alias. Then Spriteset_Map.prototype.createPictures is redefined so that it calls alias and does some extra things afterwards. This is for optimal compatibility, and to avoid rewriting code that's already been written.

    By default the child is added directly to the spriteset. If we didn't remove it, then I believe it would be displayed twice: once on the spriteset, and once on the tilemap.

    Spriteset_Map inherits from Spriteset_Base. By default Spriteset_Map has no specific override for the createPictures method, so it uses the definition from Spriteset_Base. You can find more details on JavaScript's inheritance model here:
    well i am using rpg maker v1.6.1
    and "var" makes more sence to me than "const"..
    so i guess i should use the second solution..

    I am not sure how i see if i use ES5 syntax or not^^
    Ok so if i understood correctly, you did not make a mistake on Sprite_base/Sprite_map ect..
    it was just me not understanding that the system builds the Sprite_map equivalent function out of Sprite_base^^

    ---
    so thank you very much for all the infos     caethyril , its amazing how often you know the solutions to things were i allready am close to giving up on it^^

    edit

    by the way what does "void" mean ?
  6. caethyril
    #6 Source
    1.6.1 is the latest RMMV version: it uses ES6 for playtest and standalone deployments. ES(number) is just the version of JavaScript that the browser uses to compile the game's code when you play.

    Yes, Spriteset_Map has all the methods from Spriteset_Base due to inheritance.

    My use of void is just a style choice. It's easy to accidentally write something like this:
    JavaScript:
    var a = something.sign
(() => {
  /* stuff */
})();
    Because there's no semi-colon at the end of the first line, that will be interpreted as:
    JavaScript:
    var a = something.sign(() => { /* stuff */ })();
    But something.sign is probably not a function, so this would throw a confusing error! I could just use a semi-colon in front of the IIFE instead, e.g.
    JavaScript:
    ;(() => { /* stuff */ })();
    ...but void makes the distinction look much more deliberate. :kaophew:

    You're welcome, happy scripting! :kaohi:
  7. dopan
    #7 Source
    edit.

    solved thx