[Tutorial] How to render shapes [World Renderer]

The event trigger "Graphics - Render shapes" allows you to render triangles, quads, etc.

Shape rendering is complex. Some procedure templates are available.

First, in order to render shapes, you will need to create a shape using a procedure "Create shape".

There are procedures for shapes in a procedure list "Graphics - Shape."

Next, In the statement, add the vertices of a shape using a procedure "Add vertex".

Moreover, you should consider about the order of vertices. Shapes have a front face and a back face, which depend on the order of vertices. Normally, the back face is not rendered.

If the order is counterclockwise, the face will be front one and rendered. Also, if the vertices are not in the right order, nothing is rendered.

Lastly, you will need to set a render target to "SKY" or "WORLD", and render a shape with a procedure "Render shape." It can set a position, angles, scales and color.

Shape Types

Here is a list of shape types and orders of vertices.

• DEBUG_LINES: It is required to render lines. It needs 2 vertices.

• DEBUG_LINE_STRIP: The type can render lines continuously. It needs 2 or more vertices.

• TRIANGLES: It is required to render triangles. It needs 3 vertices.

• TRINAGLE_STRIP: The type can render triangles continuously. It needs 3 or more vertices.

• TRIANGLE_FAN: The type can render triangles with a first vertex as an origin.

• QUDAS: It is required to render quads. It needs 4 vertices.

Creating a Shape

The procedure allows you to create a shape.

• Immediate Update: If it is false, a shape will not be updated unless that is cleared using a procedure "Clear shape". If shape creating needs a lot of calculations, it is possible to improve performance of rendering.

Vertex Addition

The procedures allow you to add vertices. See "Shape Type" above about the number of vertices required and the order of ones.

• X/Y/Z: They are the position of a vertex.
• U/V: They are the UV coordinates of a vertex.
• Color: It is a vertex color.

Here is an example for defining a square.

A position (0, 0) is an origin. It is also used as an origin when a shape is rotated and scaled with a procedure "Render shape".

Morevoer, each of vertices can have a color. For the image above, the colors will gradate as follows.

Rendering Shapes

In order to render created shapes, you will need to use the procedures.

• X/Y/Z: They are the position of a shape.
• Yaw/Pitch/Roll: They are shape angles.
• X/Y/Z Scale: They are the scales of a shape along each axis.
• Color: It is a shape color.

Moreover, you will need to set the procedure in the statement of a procedure "Set render target" shown below, otherwise shapes will not be rendered.

Render Targets

The procedure allows you to set a render target.

If the value is "WORLD", shapes are rendered in the world, and if it is "SKY", those are rendered in the sky.

Coordinate Systems

The procedure allows you to set a coordinate system for rendering shapes with a procedure "Render Shape."

If the value is "WORLD", the origin of shape positions will be a world position (0, 0, 0), and If it is "LOCAL", the origin will be a camera position.

Rendering Textures

In order to render textures, you will need to set a shape type to "TEXTURE." It needs 4 vertices, and the order of vertices is the same as "QUDAS."

Next, add vertices and set UV coordinates. The order of UV coordinates is the same as that of vertices.

Lastly, you will need to set and render a texture.

There is the procedure "Set texture" in a procedure list "Graphics procedures - Others."

UV coordinates

UV coordinates are required to trim a texture.

The coordinates always take the top left of a texture as an origin (0.0, 0.0). A right direction is a positive U, and a downward direction is a positive V.

Moreover, the coordinates (1.0, 1.0) are always bottom right of a texture.