MAKO
Documentation menu

Advanced Features

Embedding MakoUI

MakoUI can render directly inside a Mako3D/Mako2D window instead of opening a second one — a real in-game toolbar, not a separate app.

New to coding?

Copy the examples exactly first. Run them. Then change one number or word and run them again. You are not expected to memorize the command lists.

1

Attaching instead of opening a window

Try this code
Mako3D.init(1280, 720, "My Game");
MakoUI.attach();   // attach to the window Mako3D opened
MakoUI.theme_mako();
2

Frame order matters

Draw the 3D scene first, then the UI on top, closing with the renderer's own end() — that swaps the buffer once for the whole combined frame.

Try this code
Mako3D.begin();
Mako3D.clear(Mako3D.BLACK);
Mako3D.begin_3d(cam); Mako3D.draw_scene(); Mako3D.end_3d();

MakoUI.begin();
MakoUI.begin_window("Toolbar");
MakoUI.fps_counter();
MakoUI.end_window();
MakoUI.end();

Mako3D.end();
3

A real toolbar widget

Pinned to the top of the viewport, full width, no title bar or resize handles — a genuine toolbar, not a floating panel.

Try this code
MakoUI.begin_toolbar("main_toolbar", 48);
if MakoUI.button("Play") { ... }
MakoUI.same_line(); MakoUI.separator(); MakoUI.same_line();
MakoUI.fps_counter();
MakoUI.end_window();
4

Avoiding click-through

Guard your own 3D picking so a click on a UI panel doesn't also select an object underneath it.

Try this code
if Inputs.mouse_pressed("left") and not MakoUI.wants_mouse() {
    selected = Mako3D.pick_object(cam);
}
5

A clipped 3D preview inside a window

Render a small Mako3D scene into a preview, then place it with MakoUI.preview. It behaves like a normal UI widget, so the window clips it and later controls stay below it.

Try this code
preview = Mako3D.create_preview(256, 256);

# Draw the little 3D scene
Mako3D.begin_preview(preview, preview_camera, Mako3D.BLACK);
Mako3D.sphere(0, 0, 0, 1, Mako3D.PINK);
Mako3D.end_preview();

# Put it safely inside the ImGui window
MakoUI.begin_window("Spawn");
MakoUI.preview(preview, 256, 200);
MakoUI.button("Spawn");
MakoUI.end_window();
6

Color picker wheel

A real hue ring + saturation/value square, not flat sliders.

Try this code
col = MakoUI.color_picker("##color", col[0], col[1], col[2]);
See all Advanced Features topics
← PreviousThe Scene SystemNext →Game Development Patterns