Skip to content

Implement 3D logo and refactor StencilTestingScene #3

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
zoozooll merged 1 commit into from
May 30, 2026
Merged

Implement 3D logo and refactor StencilTestingScene #3

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion tutorial/src/main/assets/shaders/depth_testing/depth_testing.frag
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
#version 320 es
precision mediump float;
precision highp float;

out vec4 FragColor;

Expand Down
0 ...encil_testing/2.stencil_single_color.frag → ...stencil_testing/stencil_single_color.frag
View file
Open in desktop
File renamed without changes.
2 changes: 1 addition & 1 deletion ...rs/stencil_testing/2.stencil_testing.frag → ...ders/stencil_testing/stencil_testing.frag
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
#version 320 es
precision mediump float;
precision highp float;
out vec4 FragColor;

in vec2 TexCoords;
Expand Down
0 ...rs/stencil_testing/2.stencil_testing.vert → ...ders/stencil_testing/stencil_testing.vert
View file
Open in desktop
File renamed without changes.
39 changes: 24 additions & 15 deletions tutorial/src/main/cpp/basic/StencilTestingScene.cpp
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,9 @@ StencilTestingScene::StencilTestingScene() {

void StencilTestingScene::init() {
m_camera = new TargetCamera;
// configure global opengl state
// configure global opengl state
// -----------------------------
glEnable(GL_CULL_FACE);
glEnable(GL_DEPTH_TEST);
glDepthFunc(GL_LESS);
glEnable(GL_STENCIL_TEST);
Expand All @@ -23,10 +24,10 @@ void StencilTestingScene::init() {

// build and compile our shader zprogram
// ------------------------------------
m_pShader = new Shader("shaders/stencil_testing/2.stencil_testing.vert",
"shaders/stencil_testing/2.stencil_testing.frag");
m_pShaderSingleColor = new Shader("shaders/stencil_testing/2.stencil_testing.vert",
"shaders/stencil_testing/2.stencil_single_color.frag");
m_pShader = new Shader("shaders/stencil_testing/stencil_testing.vert",
"shaders/stencil_testing/stencil_testing.frag");
m_pShaderSingleColor = new Shader("shaders/stencil_testing/stencil_testing.vert",
"shaders/stencil_testing/stencil_single_color.frag");

// set up vertex data (and buffer(s)) and configure vertex attributes
// ------------------------------------------------------------------
Expand Down Expand Up @@ -128,10 +129,11 @@ void StencilTestingScene::resize(int width, int height) {

void StencilTestingScene::draw() {
m_camera->update();
// render
// render
// ------
glClearColor(0.1f, 0.1f, 0.1f, 1.0f);
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT | GL_STENCIL_BUFFER_BIT); // don't forget to clear the stencil buffer!
glClearColor(0.65f, 0.65f, 0.65f, 1.0f);
// don't forget to clear the stencil buffer!
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT | GL_STENCIL_BUFFER_BIT);

// set uniforms
glm::mat4 view = m_camera->getViewMatrix();
Expand All @@ -151,7 +153,9 @@ void StencilTestingScene::draw() {
m_pShader->setMat4("projection", projection);
}

// draw floor as normal, but don't write the floor to the stencil buffer, we only care about the containers. We set its mask to 0x00 to not write to the stencil buffer.
// draw floor as normal, but don't write the floor to the stencil buffer,
// we only care about the containers.
// We set its mask to 0x00 to not write to the stencil buffer.
glStencilMask(0x00);
// floor
glBindVertexArray(m_planeVAO);
Expand Down Expand Up @@ -180,10 +184,12 @@ void StencilTestingScene::draw() {
m_pShader->setMat4("model", model);
glDrawArrays(GL_TRIANGLES, 0, 36);

// 2nd. render pass: now draw slightly scaled versions of the objects, this time disabling stencil writing.
// Because the stencil buffer is now filled with several 1s. The parts of the buffer that are 1 are not drawn, thus only drawing
// 2nd. render pass: now draw slightly scaled versions of the objects,
// this time disabling stencil writing.
// Because the stencil buffer is now filled with several 1s.
// The parts of the buffer that are 1 are not drawn, thus only drawing
// the objects' size differences, making it look like borders.
// -----------------------------------------------------------------------------------------------------------------------------
// ------------------------------------------------------------------------------
glStencilFunc(GL_NOTEQUAL, 1, 0xFF);
glStencilMask(0x00);
glDisable(GL_DEPTH_TEST);
Expand Down Expand Up @@ -252,7 +258,8 @@ void StencilTestingScene::parseTargetCameraEvent(std::map<std::string, std::any>
if (it->second.type() == typeid(std::vector<float>)) {
const auto& val = std::any_cast<const std::vector<float>&>(it->second);
if (val.size() >= 4) {
targetCamera->onSingleTouching(glm::vec2(val[0], val[1]), glm::vec2(val[2], val[3]));
targetCamera->onSingleTouching(glm::vec2(val[0], val[1]),
glm::vec2(val[2], val[3]));
}
}
}
Expand All @@ -261,8 +268,10 @@ void StencilTestingScene::parseTargetCameraEvent(std::map<std::string, std::any>
if (it->second.type() == typeid(std::vector<float>)) {
const auto& val = std::any_cast<const std::vector<float>&>(it->second);
if (val.size() >= 8) {
targetCamera->onDoubleTouching(glm::vec2(val[0], val[1]), glm::vec2(val[2], val[3]),
glm::vec2(val[4], val[5]), glm::vec2(val[6], val[7]));
targetCamera->onDoubleTouching(glm::vec2(val[0], val[1]),
glm::vec2(val[2], val[3]),
glm::vec2(val[4], val[5]),
glm::vec2(val[6], val[7]));
}
}
}
Expand Down
116 changes: 116 additions & 0 deletions tutorial/src/main/java/com/minininja/learngles/ui/Logo.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,116 @@
package com.minininja.learngles.ui

import androidx.compose.foundation.Canvas
import androidx.compose.foundation.layout.aspectRatio
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.geometry.Offset
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.Path
import androidx.compose.ui.graphics.drawscope.Stroke
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp

@Composable
fun LearnGLESLogo(modifier: Modifier = Modifier) {
Canvas(
modifier = modifier
.aspectRatio(1f)
.padding(16.dp)
) {
val width = size.width
val height = size.height

// Define points based on the vector coordinates (normalized to size)
val center = Offset(width * 0.5f, height * 0.5f)
val top = Offset(width * 0.5f, height * 0.23f)
val bottom = Offset(width * 0.5f, height * 0.78f)
val left = Offset(width * 0.22f, height * 0.37f)
val right = Offset(width * 0.78f, height * 0.37f)
val bottomLeft = Offset(width * 0.22f, height * 0.65f)
val bottomRight = Offset(width * 0.78f, height * 0.65f)
val innerCenter = Offset(width * 0.5f, height * 0.51f)

// Right Face (Blue)
val rightFace = Path().apply {
moveTo(top.x, top.y)
lineTo(right.x, right.y)
lineTo(bottomRight.x, bottomRight.y)
lineTo(bottom.x, bottom.y)
close()
}
drawPath(
path = rightFace,
brush = Brush.linearGradient(
colors = listOf(Color(0xFF007FFF), Color(0xFF003366)),
start = top,
end = bottomRight
),
alpha = 0.8f
)

// Left Face (Green)
val leftFace = Path().apply {
moveTo(top.x, top.y)
lineTo(left.x, left.y)
lineTo(bottomLeft.x, bottomLeft.y)
lineTo(bottom.x, bottom.y)
close()
}
drawPath(
path = leftFace,
brush = Brush.linearGradient(
colors = listOf(Color(0xFF00FF7F), Color(0xFF006633)),
start = top,
end = bottomLeft
),
alpha = 0.9f
)

// Top Face (Red)
val topFace = Path().apply {
moveTo(top.x, top.y)
lineTo(right.x, right.y)
lineTo(innerCenter.x, innerCenter.y)
lineTo(left.x, left.y)
close()
}
drawPath(
path = topFace,
brush = Brush.linearGradient(
colors = listOf(Color(0xFFFF4D4D), Color(0xFF990000)),
start = top,
end = innerCenter
)
)

// Wireframe Highlights
drawLine(
color = Color.White.copy(alpha = 0.3f),
start = top,
end = innerCenter,
strokeWidth = 2f
)
drawLine(
color = Color.White.copy(alpha = 0.3f),
start = innerCenter,
end = left,
strokeWidth = 2f
)
drawLine(
color = Color.White.copy(alpha = 0.3f),
start = innerCenter,
end = right,
strokeWidth = 2f
)
}
}

@Preview(showBackground = true, backgroundColor = 0xFF1A1A1A)
@Composable
fun PreviewLogo() {
LearnGLESLogo(Modifier.padding(50.dp))
}
164 changes: 2 additions & 162 deletions tutorial/src/main/res/drawable/ic_launcher_background.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,166 +5,6 @@
android:viewportWidth="108"
android:viewportHeight="108">
<path
android:fillColor="#3DDC84"
android:fillColor="#1A1A1A"
android:pathData="M0,0h108v108h-108z" />
<path
android:fillColor="#00000000"
android:pathData="M9,0L9,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,0L19,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M29,0L29,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M39,0L39,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M49,0L49,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M59,0L59,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M69,0L69,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M79,0L79,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M89,0L89,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M99,0L99,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,9L108,9"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,19L108,19"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,29L108,29"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,39L108,39"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,49L108,49"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,59L108,59"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,69L108,69"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,79L108,79"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,89L108,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,99L108,99"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,29L89,29"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,39L89,39"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,49L89,49"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,59L89,59"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,69L89,69"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,79L89,79"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M29,19L29,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M39,19L39,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M49,19L49,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M59,19L59,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M69,19L69,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M79,19L79,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
</vector>
</vector>
Loading