Difference between revisions of "Libs3D Mesh"

From GiderosMobile
Line 58: Line 58:
 
3D is all about triangles. You combine triangles to build other 3D shapes like cubes, spheres, cones, ...
 
3D is all about triangles. You combine triangles to build other 3D shapes like cubes, spheres, cones, ...
  
=== You said Cubes? ===
+
=== A Rectangle ===
 +
Take the triangle code above, add one vertex and you have two triangles that make a rectangle.
 +
<syntaxhighlight lang="lua">
 +
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)
 +
</syntaxhighlight>
  
 
=== WIP ===
 
=== WIP ===

Revision as of 19:37, 23 January 2026

Supported platforms: Platform android.pngPlatform ios.pngPlatform mac.pngPlatform pc.pngPlatform html5.pngPlatform winrt.pngPlatform win32.pngPlatform linux.png

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)

3d triangle.png

3D is all about triangles. You combine triangles to build other 3D shapes like cubes, spheres, cones, ...

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)

WIP


Libs3D