Tag Reference (V6)

[l] Click Wait

• Message & Text

The game will wait for the player to click at this tag's position.

Explanation Tutorial

• Sample Code

Display text[l]
Display text[l][r]

[p] Click Wait + Page Break

• Message & Text

The game will wait for the player to click.
When the player clicks, the page will be refreshed.

Explanation Tutorial

• Sample Code

Display text[p]
Display text[p][r]

[graph] Inline Image Display

• Message & Text

Displays any image within the message. This can be useful for emojis or special characters.
The image to be displayed should be placed in the data/image folder.
For frequently used symbols, setting up a macro can be convenient.

Explanation Tutorial

• Sample Code

; heart.png is an image of a heart symbol
[macro name="heart"]
[graph storage="heart.png"]
[endmacro]

; From now on, you can use the [heart] tag to display the heart symbol
I love you [heart][p]

[r] Line Break

• Message & Text

Inserts a line break.

Explanation Tutorial

• Sample Code

Text display[l]
Line break here[l][r]
Another line break[l][r]

[er] Clear Message Layer Text

• Message & Text

Clears the text from the currently active message layer.

To switch the active message layer, use the [current] tag.

Explanation Tutorial

• Sample Code

Click to clear the message[l][er]
Message cleared[l]

[cm] Clear All Message Layers

• Message & Text

Clears text from all message layers. [button] [glink] [html] tags and other displayed elements will also be removed.

The font style will revert to its default settings.

[ct] Unlike the [ct] tag, this tag does not switch the active message layer to message0. The active message layer remains the same after execution.

Explanation Tutorial

• Sample Code

Display text[l]
Clear screen[l][cm]
Clear screen again[l][cm]

[ct] Reset Message Layer

• Message & Text

Clears text from all message layers.

Font styles will revert to their default settings, and the active message layer will switch to the front page of message0.

Explanation Tutorial

• Sample Code

Display text[l]
Reset the screen[l][ct]
Reset the screen again[l][ct]

[current] Specify the Target Message Layer

• Message & Text

Specifies the message layer to be targeted. After this, text attributes specified using the [font] tag, waiting for a click using the [l] tag, and other interactions will apply to this layer.

The message0 layer is visible by default, but message1 will not be displayed unless the [layopt] tag is used, so be aware of this.

Explanation Tutorial

• Sample Code

[current layer="message0"]
Displayed on message0 layer[l]
[current layer="message1"]
Displayed on message1 layer[l]

[fuki_start] Convert Message Layer into Speech Bubble

• Message & Text

The message layer can be displayed in a comic-style speech bubble format.

Before enabling speech bubble display with this tag, you must configure settings using the [fuki_chara] tag.

The design of the speech bubble inherits settings from the [position] tag, but you can customize it individually using the [fuki_chara] tag.

• Sample Code

; Set the design for a regular message layer to be used as a speech bubble
[font color="black"]
[position layer="message0" page=fore radius=15 visible=true color="white" opacity=255 border_size="3" border_color="black" ]

; Set the speech bubble display position for each character
[fuki_chara name="akane" left=200 top=270 sippo_left=30 sippo_top=30 sippo="top" max_width=300 radius=15]
[fuki_chara name="yamato" left=350 top=280 sippo_left=30 sippo_top=30 sippo="top" ]

; Speech bubble settings when there are no characters on screen (name=others)
[fuki_chara name="others" left=250 top=500 max_width=700 fix_width=700 radius=0 ]

; Start speech bubble display
[fuki_start]

#akane
Display speech bubble at Akane's position[p]

#yamato
Display speech bubble at Yamato's position[p]

#
Display speech bubble at the position set for "others"[p]

[fuki_stop] Disable Speech Bubble Mode for Message Layer

• Message & Text

Stops the speech bubble display.

The message layer's style will revert to its state before the [fuki_start] tag was applied.

[fuki_chara] Register Character Speech Bubble

• Message & Text

You can set speech bubble designs for each character.

If you specify others as the name attribute, you can set the design for when no characters are on the screen.

• Sample Code

; Set speech bubble positions for each character
[fuki_chara name="akane" left=200 top=270 sippo_left=30 sippo_top=30 sippo="top" max_width=300 radius=15]
[fuki_chara name="yamato" left=350 top=280 sippo_left=30 sippo_top=30 sippo="top"]

; Set speech bubble settings for when no character is on the screen (name=others)
[fuki_chara name="others" left=250 top=500 max_width=700 fix_width=700 radius=0 ]

[ptext] Display Text on a Layer

• Message & Text

Displays text on the foreground layer. This can be used to display text separately from the message window.

To remove the text, use the [freeimage] tag, or use the name attribute specified in this tag with the [free] tag.

By default, the layer itself is hidden, so adding text using the [ptext] tag will not display it. First, use the [layopt] tag to make the layer visible.

Tutorial Explanation

• Sample Code

[backlay]
[ptext page=back text="Sample Text" size=30 x=200 y=300 color=red vertical=true]
[trans time=2000]
[wt]
[l]
Removing the displayed text
[freeimage layer=0]

[mtext] Effect Text

• Message & Text

Displays text with various animation effects on the screen.

Refer to http://tyrano.jp/mtext/ for available animation effects.

By default, the layer itself is hidden, so adding text with the [mtext] tag will not display it. First, use the [layopt] tag to make the layer visible.

Tutorial Explanation

• Sample Code

; Make layer 0 visible
[layopt layer=0 visible=true]
; Display effect text
[mtext text="Effect Text" x=100 y=100 in_effect="fadeIn" out_effect="fadeOut"]

[ruby] Add Ruby (Furigana)

• Message & Text

Specifies ruby (furigana) for the next character.
If you want to display ruby, you must specify it each time.
For multiple characters, ruby must be specified for each character individually.

Tutorial Explanation

• Sample Code

[ruby text="kan"]漢[ruby text="ji"]字

[mark] Text Marker

• Message & Text

Applies a highlighter-like effect to text.
Color and size can also be specified.

Tutorial Explanation

• Sample Code

This part is not highlighted. [mark]This part is highlighted.[endmark] This part is not highlighted.

[mark color="0xff7f50" size=70]You can also specify the color and size of the marker.[endmark]

[endmark] End Text Marker

• Message & Text

[mark] Ends a text marker started with the [mark] tag.

Tutorial Explanation

• Sample Code

This part is normal. [mark]This part is highlighted.[endmark] This part is not.

[mark color="0xff7f50" size=70]You can specify the marker color and size as well.[endmark]

[config_record_label] Read Status Settings

• Message-related Settings

Allows changing the read status settings.

[position] Modify Message Window Attributes

• Message-related Settings

Specifies various attributes for the message window.
If omitted, the setting remains unchanged.

Tutorial Explanation

• Sample Code

; Change the position and size of the message window
[position width=400 height=300 top=100 left=20]
; Change the color and opacity of the message window
[position color=blue opacity=100]

[hidemessage] Temporarily Hide Message Layer

• Message-related Settings

Temporarily hides the message layer and waits for a click. The text is not erased. This behaves the same as selecting "Hide Message" from the menu.

The message layer will be displayed again when clicked.

[font] Change Text Style

• Message-related Settings

Changes the text style. Styles can be set individually for each message layer.

If a parameter is omitted, the setting remains unchanged. Specifying default resets the value to the default (as set in Config.tjs or with the [deffont] tag).

Styles changed with this tag are reset to default when tags such as [resetfont], [ct], [cm], and [er] are executed. To change the default values permanently, edit Config.tjs or use the [deffont] tag.

Tutorial Explanation

• Sample Code

[font size=40 bold=true]
This text is large and bold.
[resetfont]
The text has returned to its original size.

[deffont] Default Text Style Settings

• Message-related Settings

Specifies the default text style for the currently active message layer.

The style set here is applied when passing through the [resetfont] tag. Simply using the [deffont] tag does not immediately change the actual style.

Tutorial Explanation

[message_config] Message Configuration

• Message-related Settings

Available from TyranoScript V515.
Allows detailed configuration of message-related settings.
Omitted attributes remain unchanged.

• Sample Code

; Do not change text display speed upon click
[message_config ch_speed_in_click="default" effect_speed_in_click="default"]

; Instantly display remaining text upon click
[message_config ch_speed_in_click="0" effect_speed_in_click="0ms"]

; Shift the opening speech bracket left to prevent text wrapping underneath
[message_config speech_bracket_float="true"]

; Prevent word breaking for "――"
[message_config add_word_nobreak="――"]

; Increase line and letter spacing significantly
[message_config line_spacing="50" letter_spacing="30"]

; Adjust kerning for dashes
@macro name="――"
  [message_config letter_spacing="-4"]―[message_config letter_spacing="0"]―
@endmacro
――Do you seek power?[l][r]
[――]Do you seek power?[l][r]

[delay] Set Text Display Speed

• Message-related Settings

Specifies the text display speed.
To display text without waiting, you can also use the [nowait] tag.

Tutorial Explanation

[resetdelay] Reset Text Display Speed to Default

• Message-related Settings

Resets the text display speed to the default speed.

[configdelay] Set Default Text Display Speed

• Message-related Settings

Specifies the default text display speed.
This determines the speed to which text display reverts when using the [resetdelay] tag.
Use this tag if you want to change the text speed for the entire game, such as from a configuration screen.

★Note
If you only want to temporarily change the text speed for effect purposes, use the [delay] tag instead of [configdelay].

[nowait] Enable Instant Text Display Mode

• Message-related Settings

Enables instant text display mode. In this mode, all text is displayed instantly, without the normal per-character rendering process.

To return to normal mode, use the [endnowait] tag.

[endnowait] Disable Instant Text Display Mode

• Message-related Settings

Stops the instant text display mode enabled by [nowait].
The text display speed returns to the state it was in before using the [nowait] tag.

[resetfont] Reset Text Style

• Message-related Settings

Resets the text style to the default as specified by [deffont].

It can be used to temporarily change the text style with [font] and then restore it with [resetfont].

Text styles can be set individually for each message layer.

• Sample Code

[deffont size=30]
Default text size[p]

[font size=55 bold=true]
Uooooooo!!![p]

[resetfont]
W-What was that all of a sudden!?
[font size=20] (That scared me...)[p]

[resetfont]

[skipstart] Enable Skip Mode

• Message-related Settings

Enables skip mode, causing text to be displayed instantly.

[skipstop] Disable Skip Mode

• Message-related Settings

Disables skip mode. Functions the same as [cancelskip].

[cancelskip] Cancel Skip Mode

• Message-related Settings

Disables skip mode. Functions the same as [skipstop].

[autostart] Enable Auto Mode

• Message-related Settings

Enables auto mode. The system will automatically proceed past click-wait points based on the elapsed time, which is determined by the number of characters displayed.

The speed of auto mode is defined in Config.tjs under autoSpeed or can be configured using the [autoconfig] tag.

[autostop] Disable Auto Mode

• Message-related Settings

Disables auto mode.

[autoconfig] Auto Mode Configuration

• Message-related Settings

Configures settings related to auto mode.

[position_filter] Apply Filter Effect Behind the Message Window

• Message-related Settings

Applies a filter effect behind the message window.
This can be used to create a frosted glass effect for the message window.

• Sample Code

Applying a filter[p]
[position_filter blur="5"]
Frosted glass effect[p]
[position_filter invert="100"]
Inverted colors[p]
[position_filter grayscale="100"]
Grayscale mode[p]

[nolog] Temporarily Pause Backlog Recording

• Message-related Settings

When this tag is reached, text will no longer be recorded in the backlog.

Backlog recording resumes when the [endnolog] tag is reached.

Tutorial Explanation

• Sample Code

This will be recorded in the log[p]
[nolog]
This will NOT be recorded in the log[p]
This will also NOT be recorded in the log[p]
[endnolog]
Backlog recording resumes from here[p]

[endnolog] Resume Backlog Recording

• Message-related Settings

Resumes backlog recording that was temporarily paused by the [nolog] tag.

Tutorial Explanation

• Sample Code

This will be recorded in the log[p]
[nolog]
This will NOT be recorded in the log[p]
This will also NOT be recorded in the log[p]
[endnolog]
Backlog recording resumes from here[p]

[pushlog] Add Text to Backlog

• Message-related Settings

Allows you to add custom text to the backlog.

For example, text displayed using [mtext] is not recorded in the backlog by default.
However, by using [pushlog] together with [mtext], you can record animated text content in the backlog.

Tutorial Explanation

• Sample Code

[pushlog text="You can insert any log text here."]

[jump] Scenario Jump

• Label & Jump Operations

Moves to a specified label in a designated scenario file.

Unlike the [call] tag, the movement using [jump] is not stored in the call stack. This means it is a one-way transition, and you cannot return using [return].

Tutorial Explanation

• Sample Code

; Moves to the *start label in the scenario file "second.ks"
[jump storage=second.ks target=*start]

[link] Hyperlink (Choice) Start

• Label & Jump Operations

Encloses text within [link] and [endlink] to make it a clickable link. This can be used for displaying choices.

Linked text can be selected using the mouse or keyboard. When clicked or selected via key input, it will jump to a specific scenario file or label.

Links cannot span across multiple pages (but they can span across lines).

After displaying choices, you must place an [s] tag to pause the flow.

Tutorial Explanation

• Sample Code

Displaying choices[l][r][r]

[link target=*select1]【1】Choice One[endlink][r]
[link target=*select2]【2】Choice Two[endlink][r]

[s]

*select1
[cm]
"Choice One" was selected[l]
@jump target=*common

*select2
[cm]
"Choice Two" was selected[l]
@jump target=*common

*common
[cm]

This is the common route.

[endlink] Hyperlink (Choice) End

• Label & Jump Operations

Used in combination with the [link] tag. Ends hyperlink formatting.

Tutorial Explanation

• Sample Code

[link target=*select1]【1】Choice One[endlink][r]
[link target=*select2]【2】Choice Two[endlink][r]

[button] Display Graphical Button

• Label & Jump Operations

Displays a graphical button. [link] is the text-based version of this tag.

While a graphical button is displayed, scenario progression is forcibly halted. Be sure to specify a jump destination. After the jump, you must use the [cm] tag to remove the button.

The position of the graphical button follows the location set by the previous [locate] tag. However, if x or y attributes are specified, they take precedence.

【For standard choice buttons (fix=false)】 When jumping with this button, it does not leave a call stack, similar to using [jump]. That means you cannot return using the [return] tag.

【For fixed buttons (fix=true)】 Similar to using [call], it leaves a call stack. This means you must use [return] to return from the call.

Tutorial Explanation

• Sample Code

[locate x=20 y=100]
[button graphic="oda.png" target=*oda]

[locate x=300 y=100]
[button graphic="toyo.png" target=*toyo]

[glink_config] Graphical Link Configuration

• Label & Jump Operations

Available from V515 onwards.

[glink] (Graphical Link) automatic placement settings can be configured. When auto-placement is enabled (enabled by default), any [glink] without x and y specified will be subject to automatic placement. These auto-placed [glink] will not appear immediately but will be displayed when reaching the [s] tag.

If parameters are omitted, their settings will not be changed.

• Sample Code

[glink_config auto_place="true" show_time="300"]
[position left="160" top="500" width="1000" height="200" visible="true"]
[position margint="45" marginl="50" marginr="70" marginb="60"]
Are you interested in TyranoScript? [l]
[glink color="btn_13_red" text="Yes, I'm interested" target="*selectinterest"]
[glink color="btn_13_red" text="I'm very interested!" target="*selectinterest"]
[glink color="btn_13_red" text="I'm somewhat interested" target="*selectinterest"]
[s]

*selectinterest
Really!? That's great! [p]

[glink] Graphical Link

• Label & Jump Operations

You can display a graphical link (text button). No image is required.

When a graphical link is displayed, scenario progression is forcibly paused, so you must specify a jump destination.

The display position of the graphical link follows the position specified by the preceding[locate] tag. However, if thex and y attributes are specified, they take precedence.

When using this button to navigate the scenario, it functions similarly to the[jump] tag, meaning it does not remain in the call stack. In other words, you cannot return using the[return] tag.

After jumping, the[cm] tag is automatically executed, and the button is removed.

Starting from version V501c, a significant number of design variations have been added to glink. Please check out the samples at the following URL.
https://tyrano.jp/sample2/code/siryou/1

Explanation Tutorial

• Sample Code

[glink target="j1" text="Choice 1" size=20  width="500" y=300]
[glink target="j2" text="Choice 2" size=30  width="500" y=400]
[glink target="j3" text="Choice 3" size=30  width="500" y=400]

[s]

[clickable] Setting Clickable Areas

• Label & Jump Operations

You can define a transparent clickable area.

When a clickable area is displayed, scenario progression is forcibly paused, so you must specify a jump destination.

When using this button to navigate the scenario, it functions similarly to the[jump] tag, meaning it does not remain in the call stack. In other words, you cannot return using the[return] tag.

[s] The clickable area will not be active until the [s] tag is reached. Make sure to pause the game with the [s] tag.

Explanation Tutorial

• Sample Code

[locate x=20 y=100]
[clickable width=200 height=300 target=*oda]

[locate x=300 y=100]
[clickable width=100 height=100 border="10px:dotted:red" target=*oda]

[s]

[chara_ptext] Displaying Character Names and Changing Expressions

• Character Operations

This tag is used to display a character's name. The main purpose is to show the name of the speaking character at the top of the message window.face attribute can be specified to change the character's expression while displaying their name.

It overwrites the character's name in a text area that was previously created using [ptext]. Before using [chara_ptext], prior setup with [ptext] and [chara_config] is required. Refer to the sample code for detailed steps.

This tag can be written in a shorthand format. In shorthand notation, place # at the beginning of the line, followed by the value to be assigned to the name attribute. To change the expression, append : followed by the value for the face attribute.

For example, #akane:gekioko and [chara_ptext name=akane face=gekioko] perform the same function.

• Sample Code

; Show layer 0
[layopt layer="0" visible="true"]

; Create a text area in layer 0
[ptext layer="0" name="name_space" x="100" y="200" text="Character name appears here"]

; Declare the created text area (name_space) as the character name display area
[chara_config ptext="name_space"]

; Define characters
[chara_new name="akane" storage="chara/akane/normal.png" jname="Akane"]
[chara_new name="yamato" storage="chara/yamato/normal.png" jname="Yamato"]

; Display character name!
[chara_ptext name="akane"]
This is Akane[p]

; There is also a shorthand notation (start a line with # and write the character's name)
; In practice, this shorthand notation is mostly used
#yamato
This is Yamato[p]

; Name can also be cleared
#
Narration text here[p]

; Works even if the character is not registered
#???
Hello[p]

[chara_config] Basic Settings for Character Operation Tags

• Character Operations

Allows you to change the basic settings for character operation tags.

Explanation Tutorial

[chara_new] Character Definition

• Character Operations

Defines the information for the characters that appear.

By defining a character with this tag, you can use the [chara_show] tag to display that character, or the [chara_mod] tag to change the character's expression.

The name parameter specified here is used in character operation tags like [chara_show]. You can also use this name in tags like [anim] or [kanim], enabling you to freely animate the character.

Explanation Tutorial

• Sample Code

[chara_new name=yuko storage=yuko.png jname=ゆうこ]

[chara_show] Character Appearance

• Character Operations

Displays a defined character on the screen.

Explanation Tutorial

• Sample Code

[chara_show name="yuko" ]

[chara_hide] Character Exit

• Character Operations

[chara_show] Tag will remove the character displayed by the [chara_show] tag.

Explanation Tutorial

• Sample Code

[chara_hide name="yuko"]

[chara_hide_all] Remove All Characters

• Character Operations

[chara_show] Tag removes all characters displayed by the [chara_show] tag.

• Sample Code

[chara_hide_all time=1000 wait=true]

[chara_delete] Delete Character Information

• Character Operations

Deletes the character definition information.

If you want to remove the character's standing image from the screen, please use [chara_hide] instead of this tag.

• Sample Code

[chara_delete="yuko" ]

[chara_mod] Change Character Image

• Character Operations

Changes the character's image. This can be used for changing expressions.

Explanation Tutorial

• Sample Code

[chara_mod name="yuko" storage="newface.png"]

[chara_move] Change Character Position

• Character Operations

Changes the character's position and size. You can also animate the change over a specified time.

• Sample Code

[chara_move name="yuko" time=100 left=20 top=100 ]

[chara_face] Character Expression Registration

• Character Operations

Register character expression images.

• Sample Code

;Register expression
[chara_face name="yuko" face="angry" storage="newface.png"]

;Apply expression
[chara_mod name="yuko" face="angry"]

;Also change the speaker's name simultaneously
[chara_ptext name="yuko" face="angry"]

;Can be written in shorthand. This also has the same meaning
#yuko:angry

;The image registered with chara_new can be referred to as "default"
#yuko:default

[chara_layer] Character Parts Difference Definition

• Character Operations

Define the character's expression difference parts.
The default part will be the first one registered.

• Sample Code

[chara_layer name="yuko" part=mouse id=egao storage="image/egao.png" ]

[chara_layer_mod] Modify Character's Difference Definition

• Character Operations

[chara_layer] tag settings can be modified.

• Sample Code

[chara_layer_mod name="yuko" part=mouse zindex=20 ]

[chara_part] Change Character's Difference Parts

• Character Operations

[chara_layer] tag switches the actual display of the defined parts difference.

The parameter specification method for this tag is special.[chara_layer] tag'spart andid combinations can be freely specified as parameters.

[chara_part name=yuko eye=happy]

You can also change multipleparts at the same time.
Without registering theid, you can directly specify the difference image file. In this case, specifyallow_storage=true.
You can also change thezindex of a specific part by specifying a numeric value for a parameter namedpart_name_zindex.

[chara_part name=yuko eye=happy eye_zindex=10]

• Sample Code

[chara_part name=yuko mouse=happy eye=happy]

[chara_part_reset] Reset Character's Difference Parts to Default

• Character Operations

[chara_part] tag allows you to revert the changed difference parts back to the default expression.
If the character is displayed, it will immediately revert to the default.

• Sample Code

[chara_part_reset name=yuko]

[image] Display Image

• Image, Background, and Layer Operations

Displays an image on the specified layer. This can be used for character displays, background changes, and more.

Initially, the layer is set to invisible, so even if you add an image using the [image] tag, it won't appear on the screen. First, you need to make the layer visible using the [layopt] tag.

Tutorial

• Sample Code

; Make layer 1 visible
[layopt layer="1" visible="true"]
; Add cat.png to layer 1
[image layer="1" x="150" y="150" storage="cat.png"]
[l]

; Delete image
[freeimage layer="1"]

[freeimage] Clear Layer

• Image, Background, and Layer Operations

Deletes all images and other content on the specified layer.

Tutorial

• Sample Code

; Place an image
[image layer="0" page="fore" visible="true" top="100" left="300"  storage="chara.png"]

; Clear the layer
[freeimage layer="0"]

; Place an image with a name
[image name="myimg" layer="0" visible="true" top="100" left="300"  storage="myimg.png"]

; Delete one specific image by its name
[free name="myimg" layer="0"]

[free] Release Object

• Image, Background, and Layer Operations

Deletes all elements specified by the name on the layer.name specification is required.

Tutorial

• Sample Code

[backlay]
; Display character
[image name="myimage" layer=0 page=back visible=true top=100 left=300  storage = chara.png]
[trans time=2000]
@wt

; Hide character
[free name="myimage" layer=0 ]

[backlay] Copy Layer Information from Front Page to Back Page

• Image, Background, and Layer Operations

Copies the information from the specified layer (or all layers) from the front page to the back page.

This tag is used in combination with the [trans] tag. First, use the [backlay] tag to copy the image from the front page to the back page, make changes to the image on the back page, and then bring the back page's image to the front using the [trans] tag. This way, there is no concern about showing the image change process on the game screen.

Tutorial

• Sample Code

; Perform background change with transition
@layopt layer=message0 visible=false
[backlay]
[image layer=base page=back storage=rouka.jpg]
[trans time=2000]
[wt]

[wt] Wait for Transition to End

• Image, Background, and Layer Operations

Waits until the transition is complete.

Tutorial

• Sample Code

[backlay]
[image layer=base page=back storage=rouka.jpg]
[trans time=2000]
Transitioning...
[wt]

[cm]
The transition is complete[p]

[layopt] Layer Attribute Settings

• Image, Background, and Layer Operations

Specifies the attributes of the layer.

Tutorial

• Sample Code

;Clear the message layer
@layopt layer=message0 visible=false
[backlay]
[image layer=0 page=back visible=true top=100 left=50  storage = miku1.png]
[trans time=2000]
@wt
;Then show the layer
@layopt layer=message0 visible=true

[locate] Specify Display Position

• Image, Background, and Layer Operations

Specifies the display position of graphic buttons.
Text is not supported.

• Sample Code

[locate x=20 y=100]
[button graphic="oda.png" target=*oda]

[locate x=300 y=100]
[button graphic="toyo.png" target=*toyo]

[trans] Layer Transition

• Image, Background, and Layer Operations

Performs a transition on the specified layer.

It moves the contents of the back page to the front page for the specified layer. After the transition, the content (images, position, size, visibility, etc.) on the front page will be the same as that on the back page.

Do not change the layer attributes during the transition.

Tutorial

• Sample Code

[backlay]
[image storage=fg0 layer=0 page=back]
[trans time=1500 ]
[wt]

[bg] Background Switch

• Image, Background, and Layer Operations

Allows for an easy background switch.
It always switches the layer designated asfore.

Tutorial

• Sample Code

[bg storage=fg0.png time=1500 wait=true]

[bg2] Background Switch

• Image, Background, and Layer Operations

Allows for a simple background switch.
It always performs the switch on thefore layer.

• Sample Code

[bg storage=fg0.png time=1500 wait=true]

[clearfix] Clear the fix layer

• Image, Background, and Layer Operations

Clears the elements in the fix layer. You can also specify thename attribute to clear only specific elements.

The fix layer is a special layer at the front of the game screen, typically used to place fixed buttons like save and load buttons.

• Sample Code

; Add to fix layer
[ptext name="sample" layer=fix page=fore text="Text Text" size=30 x=200 y=100 color=red ]

; Clear fix layer
[clearfix name="sample"]

[quake] Shake the screen

• Effects, Effects, and Video

Shakes the screen for the specified number of milliseconds.
By setting thevmax attribute to0, it will shake horizontally, and by setting thehmax attribute to0, it will shake vertically.

Explanation tutorial

• Sample Code

[quake count=5 time=300 hmax=20]

[quake2] Shake the screen

• Effects, Effects, and Video

Shakes the screen for the specified number of milliseconds.

• Sample Code

Shaking the screen.[l][s]

[quake2 time="1000"]

[cm]It shook.[p]

[quake2 time="1000" wait="false"]

Continuing to the next tag while shaking.[p]

[quake2 time="3000" wait="false"]

Continuing to the next tag while shaking, and waiting for the shake to finish... [wa]Done.[p]

[vibrate] Mobile/Pad vibration

• Effects, Effects, and Video

You can make the player's mobile device or gamepad vibrate.

If the specified vibration time is too long, it may stop vibrating, so be cautious. Depending on the environment, it's recommended to keep the vibration time below 5000 milliseconds as a general rule.

• Sample Code

[vibrate time=1000 power=100]
Vibrate for 1 second[p]

[vibrate time="800,200" power="50" count="3"]
Repeat pattern vibration 3 times[p]

[vibrate time="5000" power="50" count="3"]
Vibration stops midway...
[wait time="1000"]
[vibrate_stop]
Stopped the vibration.[p]

[vibrate_stop] Stop Mobile/Pad Vibration

• Effects, Effects, and Video

[vibrate] You can stop the vibration of the mobile device or gamepad that was started with the [vibrate] tag.

[layermode] Layer Mode

• Effects, Effects, and Video

You can composite images on the game screen. You can choose from composite methods like multiplication, screen, overlay, etc.

It may not work on some older browsers like IE, so be cautious if you are releasing it as a browser game. It is recommended to use it in games output as PC applications.

Tutorial Explanation

• Sample Code

[layermode graphic=fg0.png time=1500 mode=overlay]

[layermode_movie] Layer Mode (Video)

• Effects, Effects, and Video

You can composite a video layer on the game screen. Please note that it may not work in older browsers like IE, so be cautious if you are releasing it as a browser game.

To remove a composited video, use the [free_layermode] tag.

mp4 format is recommended. ogv and webm formats are also supported.

When exporting as a browser game, be aware that some video formats may not be supported by certain browsers. Specifically, webm format does not work on Safari.

Also, mp4 format does not work on Firefox and Opera. In this case, if a webm file with the same name exists in the same location as the mp4 file, it will automatically choose the webm file.

Tutorial Explanation

• Sample Code

[layermode_movie video=test.webm time=1500 wait=true]

[free_layermode] Remove Composite Layer

• Effects, Effects, and Video

Removes the composite layer.

Tutorial Explanation

• Sample Code

[free_layermode name="test"]

[movie] Play Video

• Effects, Effects, and Video

Play a video on the game screen. The video file should be placed in the data/video folder.

mp4 format recommended.ogv and webm formats are also supported.

If you publish the game as a browser game, be aware that some browsers may not support certain video formats. In particular, webm does not work in Safari.

Also, mp4 format does not work in FireFox or Opera. In this case, if there is a webm file with the same name in the same location as the mp4 file, it will automatically select that one.

• Sample Code

; Count the number of times the video has been played using the game variable f.watch_count
[eval exp="f.watch_count = 0"]

*loop
Play the video[p]

; If the video has not been played yet, skipping is not allowed
; If the video has been played at least once, skipping is allowed
; Set this in the temporary variable tf.skip
[iscript]
if (f.watch_count === 0) {
  tf.skip = "false";
} else {
  tf.skip = "true";
}
[endscript]

; Play data/video/cat.mp4
[movie storage="cat.mp4" skip=&tf.skip]

The video has finished playing[p]

; Increase the count of videos played
[eval exp="f.watch_count += 1"]
[jump target="loop"]

[bgmovie] Play Background Movie

• Effects, Effects, and Video

You can use a video as the background in the game screen. The video file should be placed in the data/video folder.

[stop_bgmovie] Tag will stop the video once it finishes playing.
[bgmovie] can be layered by using another [bgmovie] during a loop, allowing the next video to play after the current one finishes.

mp4 format recommended.ogv and webm formats are also supported.

If you publish the game as a browser game, be aware that some browsers may not support certain video formats. In particular, webm does not work in Safari.

Also, mp4 format does not work in FireFox or Opera. In this case, if there is a webm file with the same name in the same location as the mp4 file, it will automatically select that one.

★Note
This tag is PC-only. It cannot be used on mobile devices.

• Sample Code

[bgmovie storage=cat.mp4]

[wait_bgmovie] Wait for Background Movie to Finish

• Effects, Effects, and Video

Waits for the currently playing background movie to finish.