Graphics

Graphics

All graphical assets live under Graphics/<screen>/<element>/. Each element folder contains one or more PNG files and an optional texture.json that controls positioning and other properties.

texture.json

texture.json maps element names to their on-screen position and optional display settings. It is placed inside the element's folder.

Basic positioning

{
    "background": {
        "x": 0,
        "y": 360
    },
    "overlay": {
        "x": 0,
        "y": 360
    }
}

Each key matches a PNG filename (without extension) inside the same folder.

Multiple instances

An element can be drawn at more than one position by using a JSON array:

{
    "lamps": [
        { "x": 690, "y": 490 },
        { "x": 470, "y": 490 }
    ]
}

x2 / y2

x2 and y2 define a second anchor. How these are used depends on the specific element, although it is generally used as the width and height of the texture.

{
    "background": {
        "x": 0,
        "y": 360,
        "x2": 1280
    }
}

frame_order

For animated elements (frame directories), frame_order remaps the playback sequence. The default order is [0, 1, 2, ...]. See the skin_viewer for more information.

{
    "explosion": {
        "x": 100,
        "y": 200,
        "frame_order": [3, 1, 0, 2]
    }
}

crop

crop restricts the visible region of a texture. Each entry is [x, y, width, height]. Multiple crop regions can be supplied as an array.

{
    "panel": {
        "x": 0,
        "y": 0,
        "crop": [[0, 0, 256, 128]]
    }
}

Animated Elements

An animated element is a subdirectory whose frames are numbered PNGs starting at 0.png:

background/bg_normal/bg_3/turtle/
    0.png
    1.png
    2.png
    ...

The engine loads all numbered frames in order. Use frame_order in texture.json to change the playback sequence without renaming files.

animation.json

Animations are defined in animation.json inside the screen folder (e.g. Graphics/background/animation.json). This file is a JSON array of animation definitions. See the Animations page for full details.

Background Screen Structure

The background screen has a specific expected layout:

Graphics/background/
├── animation.json
├── skin_config.json          (only at the Graphics/ root)
├── bg_normal/
│   ├── bg_0/ … bg_4/         (5 normal backgrounds, chosen randomly)
├── bg_fever/
│   ├── bg_fever_0/ … bg_fever_3/   (4 fever backgrounds)
└── chibi/
    ├── chibi_0/ … chibi_N/   (animated chibi characters)
        ├── 0/                (animation state 0 frames)
        └── 1/                (animation state 1 frames)