Table of Contents

Laboratoire 01

Introduction

L'infographie est un vaste sujet utilisé dans un nombre croissant de domaines. Dans ce laboratoire seront présentés les concepts généraux des graphiques ainsi que l'utilisation du processeur graphique à cette fin. Le domaine de l’infographie requiert diverses connaissances: mathématiques, physique, algorithmes, graphismes numériques 2D et 3D, conception d’expérience utilisateur, etc.

Framework de laboratoire

Comme écrire une application OpenGL simple ne peut pas être facilement réalisé dans un court laps de temps, mais aussi pour pouvoir présenter les concepts de base de l’infographie moderne de manière plus simple, nous allons travailler dans les laboratoires sur un cadre offrant de nombreuses fonctionnalités prédéfinies. Le framework utilisé offre toutes les fonctionnalités de base d'un moteur graphique minimal, telles que:

De plus, en plus des fonctionnalités de base, le framework implémente un modèle générique pour l'écriture d'applications OpenGL. Ainsi, les aspects suivants sont offerts:

La fonctionnalité du framework est offerte à travers plusieurs bibliothèques (libraries):

Structure du framework

Les application graphique (OpenGL)

Toute application doit garantir la fonctionnalité sur une certaine période. En fonction des besoins, cette période peut être:

Les applications graphiques prenant en charge la visualisation en temps réel (par exemple, les jeux ou ce que nous ferons par exemple chez Infographie) se trouvent dans le second modèle et sont basées sur une boucle de traitement. Dans le framework, cette boucle consiste en une série d'étapes (voir World::LoopUpdate () ):

  1. Les événements de la fenêtre OpenGL sont interrogés (entrée, redimensionnement, etc.)
    • Les événements sont sauvegardés pour un traitement ultérieur
  2. Le temps d'exécution de l'itération en cours est estimé (le temps d'exécution de l'itération précédente)
  3. Les événements précédemment enregistrés sont traités
  4. La trame actuelle est traitée (il est conseillé de prendre en compte le temps d'exécution dans les modifications pour fournir une mise à jour inépendante du temps)
  5. Facultatif : en cas de double ou de triple tamponnage, les tampons d'image sont échangés
  6. Aller à l'image suivante (revenir à la première étape)

Le modèle d'application OpenGL le plus simple gérera les événements d'entrée (souris, clavier) au moment de leur production. Ce modèle n'est pas indiqué car il présente de nombreux inconvénients:

  • n'offre pas la possibilité de gérer des combinaisons de touches (Exemple: l'utilisateur appuie sur W et A pour déplacer le caractère en diagonale)
  • ne fournit pas d'informations concernant l'état continu d'un événement
    • Exemple : un personnage dans une partie doit avancer tant que l'utilisateur appuie sur la touche W .
    • Pour gérer correctement cette logique, il est nécessaire de conserver le statut de la touche W . Lorsque le caractère est déplacé, il est directement proportionnel au temps écoulé depuis le dernier traitement de la trame.
    • La même chose s'applique aux boutons de la souris

En outre, un modèle de mise en mémoire tampon des événements d'entrée permet d'interroger le statut des entrées à tout moment d'une image. Il offre donc une plus grande flexibilité globale pour la mise en œuvre de nouveaux comportements / logiques. La classe WindowObject prend en charge la mise en mémoire tampon, mais également le traitement ultérieur d'événements à travers des objets de type InputController .

Nous vous recommandons de lire la documentation de GLFW sur la gestion des événements d'entrée pour mieux comprendre les concepts présentés: http://www.glfw.org/docs/latest/input_guide.html

Multi-buffering

En général, les applications graphiques utilisent plusieurs tampons d'image pour éviter l'apparition d'artefacts graphiques en modifiant directement l'image affichée à l'écran. Ainsi, l'image affichée à l'heure T a été traitée à l'heure T-1 ou T-2 (en fonction de la taille du tampon). Des informations supplémentaires sur cette technique de mise en mémoire tampon multiple peuvent être obtenues à partir du wiki:

Le modèle de fonctionnement de l'application de laboratoire

Dans lelaboratoire, le modèle d'application graphique présenté ci-dessus est mis en oeuvre par la classe World. L'étape 2 est gérée par les instances de InputController, tandis que l'étape 4 est fournie par les variables FrameStart () , Update (float deltaTime) et FrameEnd () héritées de la classe World . La classe World étend déjà InputController pour faciliter le travail en laboratoire.
Tous les laboratoires seront mis en œuvre sur la base de “SimpleScene” qui offre les fonctionnalités suivantes:

Étapes de l'exécution de l'application

  1. Les propriétés de la fenêtre de travail sont définies (Main.cpp)
  2. Le moteur est donc initialisé - Engine::Init()
    1. L'API OpenGL est initialisée (glfwInit())
    2. La fenêtre de travail est créée avec un contexte OpenGL 3.3+
      1. Attacher des événements de fenêtre via WindowsCallbacks.cpp
    3. Le gestionnaire de texture est initialisé
  3. Une nouvelle scène de travail 3D est créée et initialisée sur la base du modèle de mise à jour présenté ci-dessus. (Main.cpp)
  4. La scène chargée commence à courir (LoopUpdate())

Le standard OpenGL

OpenGL est un standard (API) que nous pouvons utiliser pour créer des applications graphiques en temps réel. Il est presque identique à Direct3D, qui ont tous deux une influence mutuelle au fil des ans.

Si vous ne savez pas quoi faire pour une commande particulière ou quels sont les paramètres de la fonction, il est conseillé de consulter la documentation: https://www.opengl.org/sdk/docs/man/

La version actuelle de cette norme est la 4.6. Pour le cours EGC, nous utiliserons la norme 3.0 / 3.3, qui est en même temps la version actuelle de la version mobile d’OpenGL, appelée OpenGL ES https://fr.wikipedia.org/wiki/OpenGL_ES.

Depuis 2016, l'API Vulkan a été lancée. Elle offre un accès bas niveau avancé aux capacités graphiques modernes des processeurs graphiques. La norme Vulkan est orientée vers le développement d’applications hautes performances et sa complexité dépasse de loin les aspects fondamentaux qui seront présentés dans les points suivants: laboratoire / point de rebroussement.

Utiliser l'API

Pendant les travaux pratiques (mais également pendant le cours), vous passerez par toutes les étapes importantes qui sont à la base du rendu graphique. Cela enseignera des concepts tels que:

Conditions générales de laboratoire

C++

Le framework est écrit en C ++, et sera utilisé dans tous les laboratoires. Les concepts utilisés en laboratoire et qui doivent être connus sont:

Pour ceux qui sont moins familiers avec C ++, nous vous recommandons de suivre des tutoriels: Learn C++

Visual Studio 2017

Ceux qui n’ont pas utilisé Visual Studio pour écrire des applications C ++ sont invités à lire le fichier Toturial Getting Started with C++ in Visual Studio

GLM

Dans les graphiques, les mathématiques sont utilisées partout, des simples matrices de rotation aux intégrales infiniment dimensionnelles des algorithmes utilisés dans l'industrie cinématographique. C'est pourquoi nous souhaitons disposer d'un support mathématique robuste, bien documenté et aussi proche de Format OpenGL. Au lieu d'écrire une bibliothèque mathématique, nous utiliserons la bibliothèque GLM. GLM nous fournit des rotations, des translations, des vecteurs de taille 2/3/4, des matrices et de nombreuses autres fonctionnalités avancées (par exemple, des modèles de bruit). Nous n'utiliserons que les fonctionnalités les plus simples dans les laboratoires de ce sujet.

glm::mat4 identity = glm::mat4 (1, 0, 0, 0, 
                                0, 1, 0, 0,
                                0, 0, 1, 0,
                                0, 0, 0, 1); 
glm::mat4 identity2 = glm::mat4(1); // short form for writing identity matrices           
glm::vec3 culoare = glm::vec3(1, 0.5, 1);
glm::vec2 directie = glm::vec3(-1, 1);
glm::vec3 pozitie = glm::vec3(100, 10, -20);
pozitie.x = 2; // you can select components like so: .x .y .z .t .r .g. b. a

Laboratoire 1

Framework

Le cadre de laboratoire peut être trouvé sur Github

Vous pouvez télécharger l'archive directement en y accédant ce lien

Informations de laboratoire

Les sources sous-jacentes à chaque laboratoire figurent dans le dossier: /Source/Laboratoare/LaboratorN/, N représentant le numéro de laboratoire.

Dans le laboratoire 1, vous pouvez télécharger des modèles 3D sur la scène et demander l’affichage de la scène à l’aide de la fonction

RenderMesh(Mesh * mesh, glm::vec3 position, glm::vec3 scale)

Les couleurs de pixel par lesquelles la scène est représentée sont stockées dans une mémoire tampon appelée Framebuffer. Le contexte défini fournit automatiquement un tel tampon et est configuré pour fonctionner avec une double mise en mémoire tampon.

L'API OpenGL utilisée dans le laboratoire:

// définit un espace de dessin dans l'espace de la fenêtre
// x, y représente les coordonnées du coin inférieur gauche
// width, height représente la taille de l'espace de dessin.
void glViewport(GLint x,  GLint y,  GLsizei width,  GLsizei height); 
 
// Définit la couleur avec laquelle tout l'écran sera coloré lors de l'effacement
void glClearColor(float r, float g, float b, float a);
 
 // met en œuvre l'opération d'effacement
void glClear(GL_COLOR_BUFFER_BIT);

Les couleurs dans OpenGL sont spécifiées en tant que float dans la plage 0 - 1

Le tampon de couleur utilisé (à la fois dans le laboratoire et généralement en raison de limitations imposées par l'affichage sur le moniteur) est au format RGBA32. Chaque composant (rouge, vert, bleu, alpha) occupe 8 bits, donc la plage 0 - 255. Ainsi:

  • le rouge (255, 0, 0) est représenté par (1, 0, 0) sur le processeur graphique
  • le jaune est (1, 1, 0) et ainsi de suite

Contrôle d'application

Le programme en cours offre la possibilité de visualiser la scène créée par une caméra prédéfinie.

Touches de contrôle pour la caméra

  • W, A, S, D, Q, E - avant, gauche, arrière, droite, bas, haut
  • MOUSE RIGHT + MOUSE MOVE - roatation de caméra

Exigences de laboratoire

  1. Téléchargez le framework, compilez et exécutez le projet
    • Vous devez ouvrir le projet Framework_EGC.sln (dossier /Visual Studio) avec Visual Studio IDE
  2. Téléchargez un autre modèle 3D et affichez-le dans une position différente de celle des deux cubes.
    • /Resources/Models contient un certain nombre de modèles 3D pouvant être téléchargés
    • Dans Laborator1::Init() découvrez comment vous pouvez déclarer (et télécharger) un nouvel objet de type Mesh
  3. Appuyer sur une touche change la couleur de la gomme à l'écran
  4. Lorsque vous appuyez sur une touche, modifiez l'objet affiché (rendu) en une position (pour parcourir 3 objets, par exemple un cube, une théière, une sphère - cube, teapot, sphere)
  5. Pour déplacer un objet dans l'espace en appuyant sur les touches W, A, S, D, E et Q (positif et négatif sur les 3 axes)

Veuillez lire attentivement la documentation des événements saisis dans le fichier InputController.h comme vous les utiliserez dans chaque laboratoire