mirror of
https://github.com/nicbarker/clay.git
synced 2025-12-24 10:01:06 +00:00
- **Initialize Window**: - Successfully created a GLFW window with dimensions 1280x720. - Set up window hints for OpenGL version and core profile, enabling multisampling, and enabling depth testing. - **Setup Renderer**: - Initialized the Clay rendering context with a memory arena and dimensions. - Set up the measure text and render text functions using stb_image.h and stb_truetype.h. - Initialized the GLES3 renderer with 4096 texture units. - Loaded a Roboto-Regular font atlas and set it as the default font for rendering. - **Main Loop**: - Called `Clay_UpdateScrollContainers` to handle scroll events. - Set the layout dimensions and cleared the color buffer and depth buffer. - Render the Clay video demo layout. - Swapped the window buffers to display the rendered video. - **Cleanup**: - Cleaned up the GLFW window and renderer resources when the application is closed. This setup provides a basic framework for rendering videos in GLES3 with GLFW, leveraging stb_image.h for asset loading and Clay for the rendering engine. - Configure GLFW and SDL2 in the main files - Fix the video bugs in the main file 🪝 Stb dependency to be managed with cmake in examples 💀 Allow clients to configure headers, also expose Gles3_Renderer through header-only mode 🧹 Quality of life: automatically set screen dimensions to renderer Before users had to set them manually 📚 **🎨 Renderers/GLES3:** Improve round-rectangle clipping with uniform border thickness Implemented improvements to the renderer for GLES3, ensuring better handling of rounded rectangles with borders, making the layout more visually appealing. - Added two new functions `RenderHeaderButton1`, `RenderHeaderButton2`, and `RenderHeaderButton3` for creating header buttons with different styles. - Updated the `CreateLayout` function to include these new buttons in the right panel. - Added a TODO note for handling the outer radius calculation, as it seems to be incorrect in the current implementation. - Replace `bl_i + B` and `br_i + B` with `bl` and `br` respectively to simplify the code. - Simplify the logic for checking pixel inside the inner rounded rect by directly using `innerLocal`. 📥 Change borders to be inset - Fixed incorrect border calculation in the shader. - Added support for inset borders by adjusting the boundary calculations based on `CLAY_BORDERS_ARE_INSET`. This change also gives the renderer more choice in handling different border styles. 🏗️ CMake builds for GLES3 renderer examples
58 lines
1.4 KiB
Markdown
58 lines
1.4 KiB
Markdown
GLES3 Renderer Scrolling Container (Using SDL2)
|
|
===============================================
|
|
|
|
This directory contains a complete example thatn can me used to test all different draw commands
|
|
using work-in-progress GLES3 renderer.
|
|
While it still needs refinement, the renderer is already functional and demonstrates the core rendering pipeline.
|
|
|
|
The images used as resources in this example, namely:
|
|
|
|
- millbank.jpeg a window with a panoramic city view;
|
|
- and profile-picture.png showing objects aligned in a circle;
|
|
|
|
are taken with my phone camera and are dedicated to the Public Domain.
|
|
|
|
How to build it with CMake?
|
|
---------------------------
|
|
|
|
Cmake build is the easiest way to build it:
|
|
|
|
mkdir build
|
|
cmake -S . -B ./build
|
|
|
|
How to build and run on Emscripten:
|
|
----------------------------------
|
|
|
|
For Emscripten the build is a bit custom,
|
|
but it depends on CMakeBuild to install header-stb dependency.
|
|
So you still need to build it with CMake first.
|
|
|
|
And then you have to source the Emscripten SDK:
|
|
|
|
source /path/to/emscripten/emsdk/emsdk_env.sh
|
|
|
|
Then build it with hand-crafted Makefile.emscripten:
|
|
|
|
make -f Makefile.emscripten test
|
|
|
|
and then navigate to http://localhost:8080
|
|
|
|
How to build and run on Mac:
|
|
----------------------------
|
|
|
|
Requires SDL2:
|
|
|
|
brew install sdl2
|
|
|
|
Requires STB:
|
|
|
|
cmake -B build
|
|
|
|
Build it with:
|
|
|
|
make -f Makefile.macos
|
|
|
|
And run with:
|
|
|
|
./macos-sidebar-scrolling-container-sdl2
|