Differences
This shows you the differences between two versions of the page.
|
egc:laboratoare:bonusrendertext [2019/11/25 17:46] victor.asavei [Redarea unei linii de text] |
egc:laboratoare:bonusrendertext [2019/12/03 07:56] (current) alexandru.gradinaru |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | ===== Laborator bonus ===== | + | ===== Resurse bonus ===== |
| ==== Redare text în OpenGL ==== | ==== Redare text în OpenGL ==== | ||
| Line 18: | Line 18: | ||
| Cea de-a doua variantă (și cea care este folosită și pentru implementare în continuarea laboratorului) este ca pentru fiecare caracter/simbol să se creeze câte o textură individuală ce va avea dimensiunea (lătime/înălțime) caracterului/simbolului. Această metodă permite o mai bună flexibilitate în manipularea fiecărui caracter/simbol în parte pentru poziționarea/scalarea acestuia. | Cea de-a doua variantă (și cea care este folosită și pentru implementare în continuarea laboratorului) este ca pentru fiecare caracter/simbol să se creeze câte o textură individuală ce va avea dimensiunea (lătime/înălțime) caracterului/simbolului. Această metodă permite o mai bună flexibilitate în manipularea fiecărui caracter/simbol în parte pentru poziționarea/scalarea acestuia. | ||
| - | Pentru a obtine textura pentru fiecare caracter/simbol necesar dintr-un font dat, a fost folosită biblioteca //FreeType//. | + | Pentru a obtine imaginea (bitmapul) pentru fiecare caracter/simbol necesar dintr-un font dat, a fost folosită biblioteca //FreeType//. |
| ==== Utilizare FreeType ==== | ==== Utilizare FreeType ==== | ||
| Line 87: | Line 87: | ||
| * Vertex shader | * Vertex shader | ||
| <code glsl> | <code glsl> | ||
| - | layout(location = 0) in vec4 vertex; // <vec2 pos, vec2 tex> | + | layout(location = 0) in vec4 vertex; // <x,y,u,v> |
| out vec2 TexCoords; | out vec2 TexCoords; | ||
| Line 137: | Line 137: | ||
| </code> | </code> | ||
| - | ==== Redarea unei linii de text ==== | + | ==== Redarea textului ==== |
| Pentru redarea unei linii de text se va folosi functia | Pentru redarea unei linii de text se va folosi functia | ||
| Line 212: | Line 212: | ||
| * Se crează quad-ul de dimensiunea lățimea și înălțimea texturii asociate caracterului | * Se crează quad-ul de dimensiunea lățimea și înălțimea texturii asociate caracterului | ||
| * Quad-ul va fi desenat folosind două triunghiuri: 6 vertecși (câte 3 pentru fiecare triunghi) fiecare cu 4 valori: | * Quad-ul va fi desenat folosind două triunghiuri: 6 vertecși (câte 3 pentru fiecare triunghi) fiecare cu 4 valori: | ||
| - | * x,y: coodonatele vârfului (după cum s-a explicat mai sus z va fi zero deoarece se desenează folosind o proiecție ortografică în planul Z = 0 al volumului vizual canonic) | + | * x,y: coodonatele vârfului (după cum s-a explicat mai sus z va fi zero deoarece se desenează folosind o proiecție ortografică în planul Z = 0 al volumului vizual canonic) |
| - | * z,w: coordonatele de textură asociate vârfului | + | * z,w: coordonatele de textură asociate vârfului |
| - | * Se desenează quad-ul format din cele două triunghiuri cu textura corespunzătoare caracterului (//glBindTexture(GL_TEXTURE_2D, ch.TextureID);//) și cu mecanismul de blending activat pentru a nu desena decât pixelii caracterului si a ignora restul quad-ului care este transparent | + | * Se desenează quad-ul format din cele două triunghiuri cu textura corespunzătoare caracterului (//glBindTexture(GL_TEXTURE_2D, ch.TextureID)//) și cu mecanismul de blending activat pentru a nu desena decât pixelii caracterului și a ignora restul quad-ului care este transparent |
| + | |||
| + | ==== Utilizare ==== | ||
| + | |||
| + | - Descărcați [[https://github.com/UPB-Graphics/Framework-EGC/archive/withrendertext.zip|framework-ul de laborator]] ce are implementat redarea textului | ||
| + | - Rulați exemplul de redare a textului: clasa ''Laborator_BonusTextRenderer'' | ||
| + | - Dacă doriți să vedeți în detaliu implementarea redării textului examinați: | ||
| + | * Clasa ''TextRenderer'' din /TextRenderer | ||
| + | * Shaderele ''VertexShaderText.glsl'' și ''FragmentShaderText.glsl'' din /TextRenderer/Shaders | ||
