Browse Source

Add gltf example (#83)

Artsiom Trubchyk 3 tháng trước cách đây
mục cha
commit
0acb32518d

+ 18 - 0
model/gltf/all.texture_profiles

@@ -0,0 +1,18 @@
+path_settings {
+  path: "**"
+  profile: "Default"
+}
+profiles {
+  name: "Default"
+  platforms {
+    os: OS_ID_GENERIC
+    formats {
+      format: TEXTURE_FORMAT_RGBA
+      compression_level: BEST
+      compression_type: COMPRESSION_TYPE_DEFAULT
+    }
+    mipmaps: false
+    max_texture_size: 0
+    premultiply_alpha: true
+  }
+}

+ 19 - 0
model/gltf/assets/materials/unlit.fp

@@ -0,0 +1,19 @@
+#version 140
+
+// Inputs should match the vertex shader's outputs.
+in vec2 var_texcoord0;
+
+// The texture to sample.
+uniform lowp sampler2D texture0;
+
+// The final color of the fragment.
+out lowp vec4 final_color;
+
+void main()
+{
+    // Sample the texture at the fragment's texture coordinates.
+    vec4 color = texture(texture0, var_texcoord0.xy);
+
+    // Output the sampled color.
+    final_color = color;
+}

+ 25 - 0
model/gltf/assets/materials/unlit.material

@@ -0,0 +1,25 @@
+name: "unlit"
+tags: "model"
+vertex_program: "/assets/materials/unlit.vp"
+fragment_program: "/assets/materials/unlit.fp"
+vertex_space: VERTEX_SPACE_LOCAL
+vertex_constants {
+  name: "mtx_world"
+  type: CONSTANT_TYPE_WORLD
+}
+vertex_constants {
+  name: "mtx_view"
+  type: CONSTANT_TYPE_VIEW
+}
+vertex_constants {
+  name: "mtx_proj"
+  type: CONSTANT_TYPE_PROJECTION
+}
+samplers {
+  name: "texture0"
+  wrap_u: WRAP_MODE_CLAMP_TO_EDGE
+  wrap_v: WRAP_MODE_CLAMP_TO_EDGE
+  filter_min: FILTER_MODE_MIN_LINEAR
+  filter_mag: FILTER_MODE_MAG_LINEAR
+  max_anisotropy: 0.0
+}

+ 26 - 0
model/gltf/assets/materials/unlit.vp

@@ -0,0 +1,26 @@
+#version 140
+
+// The model's vertex position and texture coordinates.
+in vec4 position;
+in vec2 texcoord0;
+
+// The projection, view and world matrices.
+uniform general_vp
+{
+    mat4 mtx_world;
+    mat4 mtx_view;
+    mat4 mtx_proj;
+};
+
+// The output of a vertex shader are passed to the fragment shader.
+// The texture coordinates of the vertex.
+out vec2 var_texcoord0;
+
+void main()
+{
+    // Pass the texture coordinates to the fragment shader.
+    var_texcoord0 = texcoord0;
+
+    // Transform the vertex position to clip space.
+    gl_Position = mtx_proj * mtx_view * mtx_world * vec4(position.xyz, 1.0);
+}

BIN
model/gltf/assets/models/colormap.png


BIN
model/gltf/assets/models/gate.glb


BIN
model/gltf/assets/models/track-road-wide-straight.glb


BIN
model/gltf/assets/models/vehicle-racer.glb


+ 10 - 0
model/gltf/example.md

@@ -0,0 +1,10 @@
+---
+tags: material
+title: GLTF
+brief: This example demonstrates how to use a glTF model.
+scripts: gltf.script
+---
+
+This example demonstrates how to use glTF models to add a toy car on the scene with a track and animates environment around the car.
+
+The models used in this example are from Kenney's [Toy Car Kit](https://kenney.nl/assets/toy-car-kit), licensed under CC0.

+ 209 - 0
model/gltf/example/gltf.collection

@@ -0,0 +1,209 @@
+name: "gltf"
+scale_along_z: 1
+embedded_instances {
+  id: "car"
+  data: "embedded_components {\n"
+  "  id: \"model\"\n"
+  "  type: \"model\"\n"
+  "  data: \"mesh: \\\"/assets/models/vehicle-racer.glb\\\"\\n"
+  "name: \\\"{{NAME}}\\\"\\n"
+  "materials {\\n"
+  "  name: \\\"colormap\\\"\\n"
+  "  material: \\\"/assets/materials/unlit.material\\\"\\n"
+  "  textures {\\n"
+  "    sampler: \\\"texture0\\\"\\n"
+  "    texture: \\\"/assets/models/colormap.png\\\"\\n"
+  "  }\\n"
+  "}\\n"
+  "\"\n"
+  "}\n"
+  ""
+}
+embedded_instances {
+  id: "camera"
+  data: "embedded_components {\n"
+  "  id: \"camera\"\n"
+  "  type: \"camera\"\n"
+  "  data: \"aspect_ratio: 1.0\\n"
+  "fov: 0.7854\\n"
+  "near_z: 0.1\\n"
+  "far_z: 1000.0\\n"
+  "auto_aspect_ratio: 1\\n"
+  "\"\n"
+  "}\n"
+  ""
+  position {
+    x: 1.6733184
+    y: 0.87541014
+    z: -2.2133834
+  }
+  rotation {
+    x: -0.021368599
+    y: 0.9459346
+    z: 0.063699536
+    w: 0.31732246
+  }
+}
+embedded_instances {
+  id: "track"
+  data: "embedded_components {\n"
+  "  id: \"road0\"\n"
+  "  type: \"model\"\n"
+  "  data: \"mesh: \\\"/assets/models/track-road-wide-straight.glb\\\"\\n"
+  "name: \\\"{{NAME}}\\\"\\n"
+  "materials {\\n"
+  "  name: \\\"colormap\\\"\\n"
+  "  material: \\\"/assets/materials/unlit.material\\\"\\n"
+  "  textures {\\n"
+  "    sampler: \\\"texture0\\\"\\n"
+  "    texture: \\\"/assets/models/colormap.png\\\"\\n"
+  "  }\\n"
+  "}\\n"
+  "\"\n"
+  "  position {\n"
+  "    y: -0.1\n"
+  "    z: 4.0\n"
+  "  }\n"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"road1\"\n"
+  "  type: \"model\"\n"
+  "  data: \"mesh: \\\"/assets/models/track-road-wide-straight.glb\\\"\\n"
+  "name: \\\"{{NAME}}\\\"\\n"
+  "materials {\\n"
+  "  name: \\\"colormap\\\"\\n"
+  "  material: \\\"/assets/materials/unlit.material\\\"\\n"
+  "  textures {\\n"
+  "    sampler: \\\"texture0\\\"\\n"
+  "    texture: \\\"/assets/models/colormap.png\\\"\\n"
+  "  }\\n"
+  "}\\n"
+  "\"\n"
+  "  position {\n"
+  "    y: -0.1\n"
+  "  }\n"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"road2\"\n"
+  "  type: \"model\"\n"
+  "  data: \"mesh: \\\"/assets/models/track-road-wide-straight.glb\\\"\\n"
+  "name: \\\"{{NAME}}\\\"\\n"
+  "materials {\\n"
+  "  name: \\\"colormap\\\"\\n"
+  "  material: \\\"/assets/materials/unlit.material\\\"\\n"
+  "  textures {\\n"
+  "    sampler: \\\"texture0\\\"\\n"
+  "    texture: \\\"/assets/models/colormap.png\\\"\\n"
+  "  }\\n"
+  "}\\n"
+  "\"\n"
+  "  position {\n"
+  "    y: -0.1\n"
+  "    z: -4.0\n"
+  "  }\n"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"road3\"\n"
+  "  type: \"model\"\n"
+  "  data: \"mesh: \\\"/assets/models/track-road-wide-straight.glb\\\"\\n"
+  "name: \\\"{{NAME}}\\\"\\n"
+  "materials {\\n"
+  "  name: \\\"colormap\\\"\\n"
+  "  material: \\\"/assets/materials/unlit.material\\\"\\n"
+  "  textures {\\n"
+  "    sampler: \\\"texture0\\\"\\n"
+  "    texture: \\\"/assets/models/colormap.png\\\"\\n"
+  "  }\\n"
+  "}\\n"
+  "\"\n"
+  "  position {\n"
+  "    y: -0.1\n"
+  "    z: -8.0\n"
+  "  }\n"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"road4\"\n"
+  "  type: \"model\"\n"
+  "  data: \"mesh: \\\"/assets/models/track-road-wide-straight.glb\\\"\\n"
+  "name: \\\"{{NAME}}\\\"\\n"
+  "materials {\\n"
+  "  name: \\\"colormap\\\"\\n"
+  "  material: \\\"/assets/materials/unlit.material\\\"\\n"
+  "  textures {\\n"
+  "    sampler: \\\"texture0\\\"\\n"
+  "    texture: \\\"/assets/models/colormap.png\\\"\\n"
+  "  }\\n"
+  "}\\n"
+  "\"\n"
+  "  position {\n"
+  "    y: -0.1\n"
+  "    z: -12.0\n"
+  "  }\n"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"road5\"\n"
+  "  type: \"model\"\n"
+  "  data: \"mesh: \\\"/assets/models/track-road-wide-straight.glb\\\"\\n"
+  "name: \\\"{{NAME}}\\\"\\n"
+  "materials {\\n"
+  "  name: \\\"colormap\\\"\\n"
+  "  material: \\\"/assets/materials/unlit.material\\\"\\n"
+  "  textures {\\n"
+  "    sampler: \\\"texture0\\\"\\n"
+  "    texture: \\\"/assets/models/colormap.png\\\"\\n"
+  "  }\\n"
+  "}\\n"
+  "\"\n"
+  "  position {\n"
+  "    y: -0.1\n"
+  "    z: -16.0\n"
+  "  }\n"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"road6\"\n"
+  "  type: \"model\"\n"
+  "  data: \"mesh: \\\"/assets/models/track-road-wide-straight.glb\\\"\\n"
+  "name: \\\"{{NAME}}\\\"\\n"
+  "materials {\\n"
+  "  name: \\\"colormap\\\"\\n"
+  "  material: \\\"/assets/materials/unlit.material\\\"\\n"
+  "  textures {\\n"
+  "    sampler: \\\"texture0\\\"\\n"
+  "    texture: \\\"/assets/models/colormap.png\\\"\\n"
+  "  }\\n"
+  "}\\n"
+  "\"\n"
+  "  position {\n"
+  "    y: -0.1\n"
+  "    z: -20.0\n"
+  "  }\n"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"gate\"\n"
+  "  type: \"model\"\n"
+  "  data: \"mesh: \\\"/assets/models/gate.glb\\\"\\n"
+  "name: \\\"{{NAME}}\\\"\\n"
+  "materials {\\n"
+  "  name: \\\"colormap\\\"\\n"
+  "  material: \\\"/assets/materials/unlit.material\\\"\\n"
+  "  textures {\\n"
+  "    sampler: \\\"texture0\\\"\\n"
+  "    texture: \\\"/assets/models/colormap.png\\\"\\n"
+  "  }\\n"
+  "}\\n"
+  "\"\n"
+  "  position {\n"
+  "    y: -0.1\n"
+  "    z: -7.0\n"
+  "  }\n"
+  "}\n"
+  ""
+}
+embedded_instances {
+  id: "main"
+  data: "components {\n"
+  "  id: \"gltf\"\n"
+  "  component: \"/example/gltf.script\"\n"
+  "}\n"
+  ""
+}

+ 25 - 0
model/gltf/example/gltf.script

@@ -0,0 +1,25 @@
+-- This script controls the movement of track parts to create an infinite scrolling effect
+-- i.e. we don't move the car, we move the track.
+
+function init(self)
+	local count = 6       -- Total number of track parts
+	local part_size = 4   -- Size of each track part
+
+	self.current_z = 0    -- Current z position of the track
+	self.loop_at_z = part_size * (count - 2)  -- Point at which to loop the track
+
+	self.speed = 5        -- Movement speed of the track
+end
+
+function update(self, dt)
+	-- Move the track forward based on speed and delta time
+	self.current_z = self.current_z + self.speed * dt
+
+	-- Loop the track position when it reaches the loop point
+	if self.current_z > self.loop_at_z then
+		self.current_z = self.current_z - self.loop_at_z
+	end
+
+	-- Update the position of the track game object
+	go.set("/track", "position.z", self.current_z)
+end

+ 51 - 0
model/gltf/game.project

@@ -0,0 +1,51 @@
+[project]
+title = model_gltf
+version = 1.0.0
+
+[bootstrap]
+main_collection = /example/gltf.collectionc
+
+[input]
+game_binding = /builtins/input/all.input_bindingc
+repeat_interval = 0.05
+
+[display]
+width = 720
+height = 720
+high_dpi = 1
+
+[script]
+shared_state = 1
+
+[label]
+subpixels = 1
+
+[sprite]
+subpixels = 1
+
+[windows]
+iap_provider = 
+
+[android]
+package = com.defold.examples
+
+[ios]
+bundle_identifier = com.defold.examples
+
+[osx]
+bundle_identifier = com.defold.examples
+
+[html5]
+show_fullscreen_button = 0
+show_made_with_defold = 0
+scale_mode = no_scale
+heap_size = 64
+
+[graphics]
+texture_profiles = /all.texture_profiles
+
+[render]
+clear_color_blue = 0.9
+clear_color_green = 0.9
+clear_color_red = 0.9
+