Skip to content

Tutorial [EN]

Jump to bottom
rarula edited this page Apr 7, 2023 · 3 revisions

日本語 | English

Overview

What is Sketch?

Sketch is an mcfunction framework for easily building inventory menus. Inventory menus can be built from APIs and events provided by Sketch.

Preparation

To begin, let's prepare to create a menu.

#> menu:init

execute in minecraft:overworld run function sketch:api/setup

sketch:api/setup is a function that sets up Sketch to work properly in the dimension of the execution point.

Create a menu

Now that the setup is complete, let's create a simple menu.

#> menu:main/

item replace block 10000 0 10000 container.0 with minecraft:gray_stained_glass_pane{display:{Name:'""'}}
data modify storage sketch: in.key set value "f"
function sketch:api/register_item/button

data modify storage sketch: in.contents append value [f, f, f, f, f, f, f, f, f]
data modify storage sketch: in.contents append value [f, -, -, -, -, -, -, -, f]
data modify storage sketch: in.contents append value [f, f, f, f, f, f, f, f, f]

data modify storage sketch: in.id set value "main"
function sketch:api/build/auto

sketch:api/register_item/button is a function that registers an item as a button. In this case, the item is minecraft:gray_stained_glass_pane and the item key is "f".

sketch:api/build/auto is a function that creates a menu in the executor player's open Minecart with Chest or Ender Chest. In this case, "main" is specified as the menu id.

When specifying the contents of a menu, Sketch provides a visual representation of the chest by means of an array. Here, the key "f" registered earlier and the unregistered key "-" are specified.

Global Item

The menu is incomplete as it is, so let's register the unregistered keys. Update #> menu:init with the following

#> menu:init

execute in minecraft:overworld run function sketch:api/setup

item replace block 10000 0 10000 container.0 with minecraft:air
data modify storage sketch: in.key set value "-"
data modify storage sketch: in.isGlobal set value true
function sketch:api/register_item/normal

sketch:api/register_item/normal is a function that registers items as normal.
In this case, the item is minecraft:air and the item key is "-".

Generic items, such as those used to create all menus, can be referenced from any location by specifying in.isGlobal. Here, in.isGlobal is set to true.

Reconfigure the menu

As it is, the menu will not be reassigned even if changes are made to the menu. Let's try to make the menu reconfigure itself.

// #> #sketch:set_menu/chest_minecart
{
    "values": [
        "menu_manager:set_menu"
    ]
}
// #> #sketch:set_menu/ender_chest
{
    "values": [
        "menu_manager:set_menu"
    ]
}

#sketch:set_menu/chest_minecart is the event called when the menu is reconfigured for Minecart with Chest.
#sketch:set_menu/ender_chest is the event called when the menu is reconfigured for Ender Chest.

#> menu_manager:set_menu

execute if data storage sketch: callback{id:"main"} run function menu:main/

The event returns the id of the menu to be reconfigured. By creating a menu with the same id, it will be reconfigured when the menu is changed.

Display the menu

Finally, let's try to make the menu we created appear when the chest is opened.

Minecart with Chest must be registered in advance to display the menu on Minecart with Chest.

execute summon minecraft:chest_minecart run function sketch:api/register_chest_minecart

sketch:api/register_chest_minecart is a function that registers the executor Minecart with Chest.

// #> #sketch:handler/on_open/chest_minecart
{
    "values": [
        "menu_manager:handler/on_open"
    ]
}
// #> #sketch:handler/on_open/ender_chest
{
    "values": [
        "menu_manager:handler/on_open"
    ]
}

#sketch:handler/on_open/chest_minecart is an event called when a player opens a registered Minecart with Chest.
#sketch:handler/on_open/ender_chest is an event called when the player opens the Ender Chest.

#> menu_manager:handler/on_open

function menu:main/

By creating a menu when a chest is opened, the menu will appear in the chest that is opened.

Adding functions to the menu

Now that we have created the basic behavior of the menu, this menu still has no functionality. If you want to create an interactive menu, you will need to add functionality to the menu from here.

Create interactive buttons

Let's make sure that "select" is displayed when a button is selected. First, update #> menu:main/ as follows

#> menu:main/

item replace block 10000 0 10000 container.0 with minecraft:gray_stained_glass_pane{display:{Name:'""'}}
data modify storage sketch: in.key set value "f"
data modify storage sketch: in.listener set value "frame"
function sketch:api/register_item/button

data modify storage sketch: in.contents append value [f, f, f, f, f, f, f, f, f]
data modify storage sketch: in.contents append value [f, -, -, -, -, -, -, -, f]
data modify storage sketch: in.contents append value [f, f, f, f, f, f, f, f, f]

data modify storage sketch: in.id set value "main"
function sketch:api/build/auto

Added in.listener argument to sketch:api/register_item/button. In in.listener, specify the event listener for the item to be registered. In this case, "frame" is specified as the event listener.

Next, set the file to be called when the button is selected.

// #> #sketch:handler/on_select/chest_minecart
{
    "values": [
        "menu_manager:handler/on_select"
    ]
}
// #> #sketch:handler/on_select/ender_chest
{
    "values": [
        "menu_manager:handler/on_select"
    ]
}

#sketch:handler/on_select/chest_minecart is the event called when the player selects a button in the Minecart with Chest menu.
#sketch:handler/on_select/ender_chest is an event called when the player selects a button in the Ender Chest menu.

#> menu_manager:handler/on_select

execute if data storage sketch: callback{id:"main"} if data storage sketch: callback{listener:"frame"} run say select

The event listener for the selected button is returned as the return value of the event, so you can create behavior for each button when it is selected.

Display another menu

Let's display another menu when a button is selected.

First, create a new menu.

#> menu:sub/

item replace block 10000 0 10000 container.0 with minecraft:light_blue_stained_glass_pane{display:{Name:'""'}}
data modify storage sketch: in.key set value "f"
function sketch:api/register_item/button

data modify storage sketch: in.contents append value [f, f, f, f, f, f, f, f, f]
data modify storage sketch: in.contents append value [f, -, -, -, -, -, -, -, f]
data modify storage sketch: in.contents append value [f, f, f, f, f, f, f, f, f]

data modify storage sketch: in.id set value "sub"
function sketch:api/build/auto
#> menu_manager:set_menu

execute if data storage sketch: callback{id:"main"} run function menu:main/
execute if data storage sketch: callback{id:"sub"} run function menu:sub/

Next, set the file to be called when the button is selected.

#> menu_manager:handler/on_select

execute if data storage sketch: callback{id:"main"} if data storage sketch: callback{listener:"frame"} run say select
execute if data storage sketch: callback{id:"main"} if data storage sketch: callback{listener:"frame"} run function menu:sub/

When the button you just created is selected, function menu:sub/ is executed. By creating a menu when the button is selected, the created menu will appear in the open chest.

Other

Temporary Item

If the items to be placed change according to conditions, items can be registered as temporary and replaced later.

Let's create a button for minecraft:light_blue_stained_glass_pane for creative mode and minecraft:red_stained_glass_pane otherwise. First, update #> menu:sub/ as follows

#> menu:sub/

data modify storage sketch: in.key set value "f"
function sketch:api/register_item/variable

data modify storage sketch: in.contents append value [f, f, f, f, f, f, f, f, f]
data modify storage sketch: in.contents append value [f, -, -, -, -, -, -, -, f]
data modify storage sketch: in.contents append value [f, f, f, f, f, f, f, f, f]

data modify storage sketch: in.id set value "sub"
function sketch:api/build/auto

sketch:api/register_item/variable is a function that registers an item as temporary. In this case, the item is not specified, only the key of the item.

Items registered as temporary must be replaced by an event called when the item is placed.

// #> #sketch:set_variable/chest_minecart
{
    "values": [
        "menu_manager:set_variable"
    ]
}
// #> #sketch:set_variable/ender_chest
{
    "values": [
        "menu_manager:set_variable"
    ]
}

#sketch:set_variable/chest_minecart は、is the event called when a temporary item is placed in the Minecart with Chest.
#sketch:set_variable/ender_chest is the event called when a temporary item is placed in the Ender Chest.

#> menu_manager:set_variable

execute if data storage sketch: callback{id:"sub"} run function menu:sub/variable
#> menu:sub/variable

execute if entity @a[gamemode=creative, tag=Sketch.Player] run item replace block 10000 0 10000 container.0 with minecraft:light_blue_stained_glass_pane{display:{Name:'""'}}
execute if entity @a[gamemode=creative, tag=Sketch.Player] run item modify block 10000 0 10000 container.0 sketch:register_item/button

execute if entity @a[gamemode=!creative, tag=Sketch.Player] run item replace block 10000 0 10000 container.0 with minecraft:red_stained_glass_pane{display:{Name:'""'}}
execute if entity @a[gamemode=!creative, tag=Sketch.Player] run item modify block 10000 0 10000 container.0 sketch:register_item/button

The Sketch.Player tag is set for the player who has the chest open as the return value of the event. Here, the item to be placed depends on the game mode of the player who has the chest open.

When placing a temporary item, one of the following item_modifiers must be applied to specify the item type

  • sketch:register_item/normal (Specified as a normal item)
  • sketch:register_item/button (Specified as a button)

Wrapping up

This tutorial has touched on the basic mechanics of building an inventory menu in Sketch.
For a complete description, including details on APIs, events, etc. not covered in the tutorial, see here.

Clone this wiki locally