Minimal example of integration

[steadysupply]

Hello,

I'm trying to get an example together that does the bare minimum to demonstrate how to use the Glyphy library and the SDF shader that is bundled. In broad strokes, I'd like to write a small program that simply:

1. Loads a face using Freetype
2. Uses Glyphy's callbacks for decomposing Bézier outlines into circle arc data
3. Upload circle arc data to GL buffer
4. Make a call to Glyphy's SDF fragment shader

I've got some of the way there in this PR, but have got a bit stuck reading the demo code to figure out what to do next. I've got 1. & 2. running nicely, but don't understand what's going on in this code

glyphy/demo/demo-shader.cc

Lines 78 to 88 in 77bd0c2

	#define ENCODE_CORNER(_cx, _cy) \
	do { \
	double _vx = p.x + font_size * ((1-_cx) * gi->extents.min_x + _cx * gi->extents.max_x); \
	double _vy = p.y - font_size * ((1-_cy) * gi->extents.min_y + _cy * gi->extents.max_y); \
	glyph_vertex_encode (_vx, _vy, _cx, _cy, gi, &v[_cx * 2 + _cy]); \
	} while (0)
	ENCODE_CORNER (0, 0);
	ENCODE_CORNER (0, 1);
	ENCODE_CORNER (1, 0);
	ENCODE_CORNER (1, 1);
	#undef ENCODE_CORNER

I'm not a C expert, but I'm guessing it has to do with rendering the extents in the main demo to visualise Glyphy's optimisations, which the general user wouldn't use just to render the glyph?

In any case, I would love some feedback on what I have here and what I should write next to get 3. and 4. working!

Cheers,

Ben

[alexzielenski]

The included code creates there four corners of the bounding box that the glyph is going to render into - it is very essential. The macro ENCODE_CORNER creates the position of a corner point given _cx and _cy which describe which corner to consider. The glyph_vertex_encode function packs the vertex position, path atlas position, and path grid size into a vertex to send to the demo vertex shader. (check out the transpose function).

This bit of code accomplishes the task of telling the shaders which glyph to draw and where. You could accomplish this same task without the complicated packing (albeit with higher bandwidth) simply by using a uniform buffer object with struct encoded std140 layout and a simple quad. The shaders at a minimum just require the atlas position to know where to look up the path in the atlas texture, and the nominal grid size of the path.

[behdad]

Thanks both. To me, what's in demo/ is the simplest working demo. But sure, if you can provide something that is easier to understand for others, I'll merge that.

[steadysupply]

Thanks for the info @alexzielenski, I'll have another read of the ENCODE_CORNER macro to see if I can make any sense of it. Reading your post above, I think I missed something about the role of the atlas in Glyphy. I initially understood it to be the responsibility of the user to decide how to arc data for the shader to access on the GPU-side, but what you've written above suggests to me that there is a mandated way of doing it?

@behdad, with utmost respect I think you've misread my intention. I'm not trying to write another demo of Glyphy's capabilities (as you mention the code in demo does a nice job of that) or even write something that "works". I would like to write a program that gives an example of how to use Glyphy to generate circle arc data from a font and send that data to the bundled shader. In other words, a minimal example of integration.

The point of this for me would be, on the first hand, to figure out how I can use Glyphy and on the second to act as documentation for other programmers who are interested in experimenting with the project.

I've updated the title of the PR to be more representative of what's inside!

[chergert]

This is obviously a 4 year old issue, and probably not of much use anymore to you, but in case others come by and want to see an example of integration, we did integrate Glyphy into GTK 4 on a branch a few months back which might serve as an example.

https://gitlab.gnome.org/GNOME/gtk/-/tree/glyphy2

gsk/gl/gskglrenderjob.c contains gsk_gl_render_job_visit_text_node_glyphy() which converts text render nodes into shader uniforms/etc.