Skip to content

Commit dc369a1

Browse files
domesticmousedomesticmouse
authored
intro_flutter_gpu: Simplify cube vertex generation (#2285)
1 parent f3c7a12 commit dc369a1

File tree

8 files changed

+387
-298
lines changed

8 files changed

+387
-298
lines changed

‎intro_flutter_gpu/codelab_rebuild.yaml‎

Lines changed: 118 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -873,70 +873,22 @@ steps:
873873
patch-u: |
874874
--- b/intro_flutter_gpu/step_09/lib/main.dart
875875
+++ a/intro_flutter_gpu/step_09/lib/main.dart
876-
@@ -95,22 +95,63 @@ class TrianglePainter extends CustomPainter {
876+
@@ -95,22 +95,13 @@ class TrianglePainter extends CustomPainter {
877877
878878
final pipeline = gpu.gpuContext.createRenderPipeline(vert, frag);
879879
880880
- const floatsPerVertex = 4;
881-
+ const floatsPerVertex = 6; // 3 for position + 3 for color
882-
final vertices = Float32List.fromList([
881+
- final vertices = Float32List.fromList([
883882
- // Format: x, y, u, v
884883
- -0.8, -0.8, -1.0, -1.0,
885884
- 0.8, -0.8, 1.0, -1.0,
886885
- -0.8, 0.8, -1.0, 1.0,
887886
- 0.8, -0.8, 1.0, -1.0,
888887
- 0.8, 0.8, 1.0, 1.0,
889888
- -0.8, 0.8, -1.0, 1.0,
890-
+ // Format: x, y, z, r, g, b
891-
+
892-
+ // Back Face
893-
+ -0.5, -0.5, -0.5, 1.0, 0.0, 0.0,
894-
+ 0.5, -0.5, -0.5, 0.0, 1.0, 0.0,
895-
+ 0.5, 0.5, -0.5, 0.0, 0.0, 1.0,
896-
+ 0.5, 0.5, -0.5, 0.0, 0.0, 1.0,
897-
+ -0.5, 0.5, -0.5, 1.0, 1.0, 0.0,
898-
+ -0.5, -0.5, -0.5, 1.0, 0.0, 0.0,
899-
+
900-
+ // Front Face
901-
+ -0.5, -0.5, 0.5, 1.0, 0.0, 0.0,
902-
+ 0.5, 0.5, 0.5, 0.0, 0.0, 1.0,
903-
+ 0.5, -0.5, 0.5, 0.0, 1.0, 0.0,
904-
+ 0.5, 0.5, 0.5, 0.0, 0.0, 1.0,
905-
+ -0.5, -0.5, 0.5, 1.0, 0.0, 0.0,
906-
+ -0.5, 0.5, 0.5, 1.0, 1.0, 0.0,
907-
+
908-
+ // Left Face
909-
+ -0.5, 0.5, 0.5, 1.0, 0.0, 0.0,
910-
+ -0.5, -0.5, -0.5, 0.0, 0.0, 1.0,
911-
+ -0.5, 0.5, -0.5, 0.0, 1.0, 0.0,
912-
+ -0.5, -0.5, -0.5, 0.0, 0.0, 1.0,
913-
+ -0.5, 0.5, 0.5, 1.0, 0.0, 0.0,
914-
+ -0.5, -0.5, 0.5, 1.0, 1.0, 0.0,
915-
+
916-
+ // Right Face
917-
+ 0.5, 0.5, 0.5, 1.0, 0.0, 0.0,
918-
+ 0.5, 0.5, -0.5, 0.0, 1.0, 0.0,
919-
+ 0.5, -0.5, -0.5, 0.0, 0.0, 1.0,
920-
+ 0.5, -0.5, -0.5, 0.0, 0.0, 1.0,
921-
+ 0.5, -0.5, 0.5, 1.0, 1.0, 0.0,
922-
+ 0.5, 0.5, 0.5, 1.0, 0.0, 0.0,
923-
+
924-
+ // Bottom Face
925-
+ 0.5, -0.5, -0.5, 0.0, 1.0, 0.0,
926-
+ -0.5, -0.5, -0.5, 1.0, 0.0, 0.0,
927-
+ 0.5, -0.5, 0.5, 0.0, 0.0, 1.0,
928-
+ -0.5, -0.5, 0.5, 1.0, 1.0, 0.0,
929-
+ 0.5, -0.5, 0.5, 0.0, 0.0, 1.0,
930-
+ -0.5, -0.5, -0.5, 1.0, 0.0, 0.0,
931-
+
932-
+ // Top Face
933-
+ -0.5, 0.5, -0.5, 1.0, 0.0, 0.0,
934-
+ 0.5, 0.5, -0.5, 0.0, 1.0, 0.0,
935-
+ 0.5, 0.5, 0.5, 0.0, 0.0, 1.0,
936-
+ 0.5, 0.5, 0.5, 0.0, 0.0, 1.0,
937-
+ -0.5, 0.5, 0.5, 1.0, 1.0, 0.0,
938-
+ -0.5, 0.5, -0.5, 1.0, 0.0, 0.0,
939-
]);
889+
- ]);
890+
+ const floatsPerVertex = 6;
891+
+ final vertices = cubeVertices;
940892
941893
final verticesDeviceBuffer = gpu.gpuContext.createDeviceBufferWithCopy(
942894
ByteData.sublistView(vertices),
@@ -946,14 +898,57 @@ steps:
946898
final model = vm.Matrix4.rotationY(angle);
947899
final view = vm.Matrix4.translation(vm.Vector3(0.0, 0.0, -2.0));
948900
final projection = vm.makePerspectiveMatrix(
949-
@@ -120,7 +161,6 @@ class TrianglePainter extends CustomPainter {
901+
@@ -120,7 +111,6 @@ class TrianglePainter extends CustomPainter {
950902
100.0,
951903
);
952904
953905
- // Pack matrices into uniform buffer
954906
final vertUniforms = [model, view, projection];
955907
956908
final vertUniformsDeviceBuffer = gpu.gpuContext.createDeviceBufferWithCopy(
909+
@@ -158,4 +148,42 @@ class TrianglePainter extends CustomPainter {
910+
911+
@override
912+
bool shouldRepaint(covariant CustomPainter oldDelegate) => true;
913+
+
914+
+ static const List<List<double>> vertices = [
915+
+ // Vertex format: [x, y, z, u, v, w]
916+
+
917+
+ // Front face of cube
918+
+ [-0.5, -0.5, 0.5, 0.0, 0.0, 1.0],
919+
+ [0.5, -0.5, 0.5, 1.0, 0.0, 1.0],
920+
+ [0.5, 0.5, 0.5, 1.0, 1.0, 1.0],
921+
+ [-0.5, 0.5, 0.5, 0.0, 1.0, 1.0],
922+
+
923+
+ // Back face of cube
924+
+ [-0.5, -0.5, -0.5, 0.0, 0.0, 0.0],
925+
+ [0.5, -0.5, -0.5, 1.0, 0.0, 0.0],
926+
+ [0.5, 0.5, -0.5, 1.0, 1.0, 0.0],
927+
+ [-0.5, 0.5, -0.5, 0.0, 1.0, 0.0],
928+
+ ];
929+
+
930+
+ // Define indices for triangles (counter-clockwise winding)
931+
+ static const List<int> indices = [
932+
+ // Front face
933+
+ 0, 2, 1, 0, 3, 2,
934+
+ // Back face
935+
+ 4, 5, 6, 4, 6, 7,
936+
+ // Left face
937+
+ 0, 4, 7, 0, 7, 3,
938+
+ // Right face
939+
+ 1, 2, 6, 1, 6, 5,
940+
+ // Bottom face
941+
+ 0, 1, 5, 0, 5, 4,
942+
+ // Top face
943+
+ 3, 7, 6, 3, 6, 2,
944+
+ ];
945+
+
946+
+ /// Flattened vertex data ready for insertion in graphics buffer.
947+
+ /// The vertex format is `[x, y, z, u, v, w]`.
948+
+ static final Float32List cubeVertices = Float32List.fromList([
949+
+ for (final index in indices) ...vertices[index],
950+
+ ]);
951+
}
957952
- name: Patch shaders/simple.frag
958953
path: intro_flutter_gpu/shaders/simple.frag
959954
patch-u: |
@@ -1034,16 +1029,7 @@ steps:
10341029
patch-u: |
10351030
--- b/intro_flutter_gpu/step_10/lib/main.dart
10361031
+++ a/intro_flutter_gpu/step_10/lib/main.dart
1037-
@@ -95,7 +95,7 @@ class TrianglePainter extends CustomPainter {
1038-
1039-
final pipeline = gpu.gpuContext.createRenderPipeline(vert, frag);
1040-
1041-
- const floatsPerVertex = 6; // 3 for position + 3 for color
1042-
+ const floatsPerVertex = 6;
1043-
final vertices = Float32List.fromList([
1044-
// Format: x, y, z, r, g, b
1045-
1046-
@@ -171,6 +171,9 @@ class TrianglePainter extends CustomPainter {
1032+
@@ -121,6 +121,9 @@ class TrianglePainter extends CustomPainter {
10471033
10481034
renderPass.bindPipeline(pipeline);
10491035
@@ -1081,7 +1067,7 @@ steps:
10811067
}
10821068
10831069
@override
1084-
@@ -152,8 +152,15 @@ class TrianglePainter extends CustomPainter {
1070+
@@ -102,8 +102,15 @@ class TrianglePainter extends CustomPainter {
10851071
ByteData.sublistView(vertices),
10861072
);
10871073
@@ -1099,14 +1085,78 @@ steps:
10991085
final projection = vm.makePerspectiveMatrix(
11001086
vm.radians(45),
11011087
size.aspectRatio,
1102-
@@ -171,7 +178,6 @@ class TrianglePainter extends CustomPainter {
1088+
@@ -121,7 +128,6 @@ class TrianglePainter extends CustomPainter {
11031089
11041090
renderPass.bindPipeline(pipeline);
11051091
11061092
- // Add back-face culling
11071093
renderPass.setCullMode(gpu.CullMode.backFace);
11081094
11091095
final verticesView = gpu.BufferView(
1096+
- name: Patch shaders/simple.frag
1097+
path: intro_flutter_gpu/shaders/simple.frag
1098+
patch-u: |
1099+
--- b/intro_flutter_gpu/step_11/shaders/simple.frag
1100+
+++ a/intro_flutter_gpu/step_11/shaders/simple.frag
1101+
@@ -4,9 +4,32 @@
1102+
1103+
#version 460 core
1104+
1105+
-in vec3 vertex_color;
1106+
+in vec3 vertex_uvw;
1107+
out vec4 frag_color;
1108+
1109+
+const vec4 red = vec4(1, 0, 0, 1);
1110+
+const vec4 green = vec4(0, 1, 0, 1);
1111+
+const vec4 blue = vec4(0, 0, 1, 1);
1112+
+const vec4 yellow = vec4(1, 1, 0, 1);
1113+
+const vec4 orange = vec4(1, 0.5, 0, 1);
1114+
+const vec4 pink = vec4(1, 0.75, 0.8, 1);
1115+
+const vec4 purple = vec4(0.5, 0, 0.5, 1);
1116+
+const vec4 cyan = vec4(0, 1, 1, 1);
1117+
+
1118+
void main() {
1119+
- frag_color = vec4(vertex_color, 1.0);
1120+
+ // Extract u, v, w coordinates for clarity
1121+
+ float u = vertex_uvw.x;
1122+
+ float v = vertex_uvw.y;
1123+
+ float w = vertex_uvw.z;
1124+
+
1125+
+ vec4 bottom_back = mix(red, green, u);
1126+
+ vec4 bottom_front = mix(purple, pink, u);
1127+
+
1128+
+ vec4 top_back = mix(blue, yellow, u);
1129+
+ vec4 top_front = mix(orange, cyan, u);
1130+
+
1131+
+ vec4 back = mix(bottom_back, top_back, v);
1132+
+ vec4 front = mix(bottom_front, top_front, v);
1133+
+
1134+
+ frag_color = mix(back, front, w);
1135+
}
1136+
- name: Patch shaders/simple.vert
1137+
path: intro_flutter_gpu/shaders/simple.vert
1138+
patch-u: |
1139+
--- b/intro_flutter_gpu/step_11/shaders/simple.vert
1140+
+++ a/intro_flutter_gpu/step_11/shaders/simple.vert
1141+
@@ -5,9 +5,9 @@
1142+
#version 460 core
1143+
1144+
in vec3 position;
1145+
-in vec3 color;
1146+
+in vec3 uvw;
1147+
1148+
-out vec3 vertex_color;
1149+
+out vec3 vertex_uvw;
1150+
1151+
uniform VertInfo {
1152+
mat4 model;
1153+
@@ -17,5 +17,5 @@ uniform VertInfo {
1154+
1155+
void main() {
1156+
gl_Position = projection * view * model * vec4(position, 1.0);
1157+
- vertex_color = color;
1158+
+ vertex_uvw = uvw;
1159+
}
11101160
- name: Copy step_11
11111161
copydir:
11121162
from: intro_flutter_gpu
@@ -2029,11 +2079,9 @@ steps:
20292079
+import 'package:flutter_scene_importer/build_hooks.dart';
20302080
import 'package:native_assets_cli/native_assets_cli.dart';
20312081
2032-
-void main(List<String> args) async {
2033-
- await build(args, (config, output) async {
2082+
void main(List<String> args) async {
2083+
await build(args, (config, output) async {
20342084
- await buildShaderBundleJson(
2035-
+void main(List<String> args) {
2036-
+ build(args, (config, output) async {
20372085
+ buildModels(
20382086
buildConfig: config,
20392087
- buildOutput: output,

0 commit comments

Comments
 (0)