Libs3D Mesh

Supported platforms:

I am 3D

First and foremost, for 3D, we set our application as such. There are many ways to tell our application be 3D:

• application configureFrustum
• Matrix orthographicProjection
• Matrix perspectiveProjection
• Viewport setProjection

Let's see some of those making our first steps in Gideros 3D.

A Triangle

As seen above, first we set our application 3D.

Then, the Mesh class is used to create and display custom constructed set of triangles (triangle meshes).

A triangle is:

• an array of 3 vertices with an x and y position: setVertexArray
• those 3 vertices connect to make a face (ClockWise): setIndexArray
• optionally coloring each vertex (color and alpha): setColorArray

The code:

application:setBackgroundColor(0x323232)

-- Configures the field of view (fov) and far clipping plane for 3D projection
application:configureFrustum(45, -100) -- (fov, farplane)

local mesh = Mesh.new()
stage:addChild(mesh)

mesh:setVertexArray(
	50, 0, -- 1. vertex position
	100, 100, -- 2. vertex position
	0, 100 -- 3. vertex position
)
mesh:setIndexArray(
	1,2,3 -- 1. triangle from 1, 2 and 3 vertex
)
mesh:setColorArray(
	0xff0000,0.5, -- 1. vertex color and alpha
	0x00ff00,0.7, -- 2. vertex color and alpha
	0x0000ff,1.0 -- 3. vertex color and alpha
)

mesh:setPosition(12*16, 8*16, -1*16)
mesh:addEventListener(Event.ENTER_FRAME, function(e)
	mesh:setRotationX(mesh:getRotationX()+1)
	mesh:setRotationY(mesh:getRotationY()+1)
	mesh:setRotation(mesh:getRotation()+1)
end)

A Rectangle

Take the triangle code above, add one vertex and you have two triangles that make a rectangle.

application:setBackgroundColor(0x323232)

-- Configures the field of view (fov) and far clipping plane for 3D projection
application:configureFrustum(45, -100) -- (fov, farplane)

local mesh = Mesh.new()
stage:addChild(mesh)

mesh:setVertexArray(
	0, 0, -- 1. vertex position
	100, 0, -- 2. vertex position
	100, 150, -- 3. vertex position
	0, 150 -- -- 4. vertex position
)
mesh:setIndexArray(
	1,2,3, -- 1. triangle from 1, 2 and 3 vertex
	1,3,4 -- 2. triangle from 1, 3 and 4 vertex
)
mesh:setColorArray(
	0xff0000,0.5, -- 1. vertex color and alpha
	0x00ff00,0.7, -- 2. vertex color and alpha
	0x0000ff,1.0, -- 3. vertex color and alpha
	0xffff00,0 -- 4. vertex color and alpha
)

mesh:setPosition(12*16, 8*16, -1*16)
mesh:addEventListener(Event.ENTER_FRAME, function(e)
	mesh:setRotationX(mesh:getRotationX()+1)
	mesh:setRotationY(mesh:getRotationY()+1)
	mesh:setRotation(mesh:getRotation()+1)
end)

A Cube

In Gideros, a simple Sprite can be cube:

• we set the application 3D
• we create a local function to make the faces for our cube using Shape
• we add six faces (with appropriate rotation) to a Sprite
• we are cube ;-)

application:setBackgroundColor(0x323232)

-- configure the field of view for 3D projection
application:configureFrustum(45) -- (fov, farplane)

-- create faces for a cube
local function face(color, rx, ry)
	local s = Shape.new()
	s:setFillStyle(Shape.SOLID, color, 0.7) -- translucent color
	s:beginPath()
	s:moveTo(-1,-1)
	s:lineTo(-1,1)
	s:lineTo(1,1)
	s:lineTo(1,-1)
	s:lineTo(-1,-1)
	s:endPath()
	-- orientation
	s:setRotationX(rx)
	s:setRotationY(ry)
	-- offset position -1 along its local Z axis
	s:setPosition(s:getMatrix():transformPoint(0, 0, -1))

	return s
end

-- a cube with 6 faces
cube = Sprite.new()
cube:addChild(face(0xFF8080, 0,0)) -- color, rx, ry
cube:addChild(face(0xFFFF00, 90,0)) -- color, rx, ry
cube:addChild(face(0xFF00FF, -90,0)) -- color, rx, ry
cube:addChild(face(0x80FF80, 180,0)) -- color, rx, ry
cube:addChild(face(0x00FFFF, 0,90)) -- color, rx, ry
cube:addChild(face(0x8080FF, 0,-90)) -- color, rx, ry

-- enable depth sorting for translucency
cube:setAutoSort(true)
cube:setScale(2*16, 2*16, 2*16)
cube:setPosition(12*16, 8*16, 1*16)

stage:addChild(cube)

-- Rotate our cube
cube:addEventListener(Event.ENTER_FRAME,function(e)
	cube:setRotationX(cube:getRotationX()+1)
	cube:setRotation(cube:getRotation()+1.3)
end)

---

Libs3D

---

• Main Page
• Lua API
• Main API
• Plugins