OpenGL Moderne

Tutoriel 1 : ouvrir une fenêtre

Bienvenue dans le premier tutoriel !

Avant de s'attaquer à OpenGL, vous allez d'abord apprendre à compiler le code accompagnant chaque tutoriel, apprendre à l'exécuter, et plus important, apprendre avec le code.

19 commentaires Donner une note à l'article (5)

Article lu   fois.

Les deux auteur et traducteur

Site personnel

Traducteur : Profil ProSite personnel

Liens sociaux

Viadeo Twitter Facebook Share on Google+   

Navigation

   

Sommaire

 

Tutoriel suivant : le premier triangle

I. Introduction

Bienvenue dans le premier tutoriel !

Avant de s'attaquer à OpenGL, vous allez d'abord apprendre à compiler le code accompagnant chaque tutoriel, apprendre à l'exécuter, et plus important, apprendre avec le code.

II. Prérequis

Aucun prérequis n'est nécessaire pour suivre ces tutoriels. Une expérience avec n'importe quel langage de programmation (C, Java, Lisp, JavaScript, ou autre) est préférable pour comprendre le code, mais pas nécessaire ; il sera simplement plus difficile d'apprendre deux choses à la fois.

Tous les tutoriels sont écrits en « C++ simple » : beaucoup d'efforts ont été faits pour rendre le code aussi simple que possible. Pas de templates, pas de classes, pas de pointeurs. De cette façon, vous allez pouvoir tout comprendre même si vous ne connaissez que Java.

III. Oubliez tout

Vous n'avez rien besoin de connaître, mais vous devez oublier tout ce que vous connaissez sur OpenGL. Si vous connaissez quelque chose qui ressemble à glBegin(), oubliez-le. Ici vous allez apprendre l'OpenGL moderne (OpenGL 3 et 4), et la plupart des tutoriels en ligne apprennent le « vieux » OpenGL (OpenGL 1 et 2). Donc oubliez tout ce que vous pourriez savoir, avant que votre cerveau ne fonde face à ce mélange.

IV. Compiler les tutoriels

Tous les tutoriels peuvent être compilés sur Windows, Linux et Mac. Pour ces plates-formes, la procédure est grossièrement la même :

  1. mettez à jour vos pilotes !! Faites-le. Vous avez été prévenus ;
  2. télécharger un compilateur, si vous n'en avez pas encore ;
  3. installez CMake ;
  4. téléchargez le code source des tutoriels ;
  5. générez un projet avec CMake ;
  6. compilez le projet ;
  7. jouez avec les exemples.

IV-A. Compilation sous Windows

  1. La mise à jour de vos pilotes devrait être simple. Allez sur le site de NVIDIA ou AMD et téléchargez les pilotes. Si vous n'êtes pas sûr de connaître votre carte graphique : Panneau de configuration → Système et Sécurité → Système → Gestionnaire de périphériques → Cartes graphiques. Si vous avez un GPU intégré Intel, les pilotes sont généralement fournis par votre OEM (Dell, HP…).
  2. On suggère d'utiliser Visual Studio 2010 Express comme compilateur. Vous pouvez le télécharger gratuitement ici. Si vous préférez utiliser MinGW, on recommande d'utiliser Qt Creator. Installez celui que vous voulez. Les étapes suivantes seront expliquées pour Visual Studio mais devraient être similaires pour tout autre EDI.
  3. Téléchargez CMake et installez-le.
  4. Téléchargez le code source et décompressez-le, par exemple dans C:\Users\XYZ\Projects\OpenGLTutorials\.
  5. Démarrez CMake. Dans la première ligne, naviguez jusqu'au dossier décompressé. Si vous n'êtes pas sûr, choisissez le dossier contenant le fichier CMakeLists.txt. Dans la seconde ligne, entrez le chemin où vous souhaitez que les fichiers spécifiques au compilateur figurent. Par exemple, vous pouvez choisir C:\Users\XYZ\Projects\OpenGLTutorials-build-Visual2010-32bits\, ou C:\Users\XYZ\Projects\OpenGLTutorials\build\Visual2010-32bits\. Notez que cela peut être n'importe où et pas nécessairement dans le même dossier.CMake
  6. Cliquez sur le bouton « Configurer » (« Configure »). Comme c'est la première fois que vous configurez le projet, CMake vous demandera quel compilateur vous désirez utiliser. Choisissez-le suivant la première étape. Si vous avez un Windows 64 bits, vous pouvez choisir 64 bits ; si vous ne savez pas, choisissez 32 bits.
  7. Cliquez sur « Configurer » (« Configure ») jusqu'à ce que les lignes rouges disparaissent. Cliquez sur « Générer » (« Generate »). Votre projet Visual Studio est maintenant créé. Vous pouvez oublier CMake ; désinstallez-le si vous le souhaitez.
  8. Ouvrez C:\Users\XYZ\Projects\OpenGLTutorials-build-Visual2010-32bits\. Vous allez voir un fichier Tutorials.sln : ouvrez-le avec Visual Studio.Répertoire du projet
    Dans le menu « Générer » (« Build »), cliquez sur « Tout générer » (« Build All »). Tous les tutoriels et les dépendances vont être compilés. Chaque exécutable sera aussi copié dans C:\Users\XYZ\Projects\OpenGLTutorials\. Avec un peu de chance, aucune erreur n'apparaît.Visual Studio 2010 et les tutoriels
  9. Ouvrez C:\Users\XYZ\Projects\OpenGLTutorials\playground et démarrez playground.exe. Une fenêtre noire devrait apparaître.Fenêtre vide

Vous pouvez aussi démarrer n'importe quel tutoriel à partir de Visual Studio. Faites un clic droit sur Playground et choisissez « Définir comme projet de démarrage » (« Choose as startup project »). Vous pouvez maintenant déboguer le code en appuyant sur F5.

Répertoire de travail des tutoriels
Projet de démarrage de Visual Studio

IV-B. Compilation sous Linux

Il y a tellement de variantes disponibles de Linux qu'il est impossible de lister toutes les plates-formes possibles. Adaptez les instructions si possible et n'hésitez pas à lire la documentation de votre distribution.

  1. Installez les derniers pilotes. On recommande chaudement les pilotes binaires propriétaires. Ce n'est pas GNU ou autre, mais au moins ils fonctionnent. Si votre distribution ne fournit pas d'installation automatique, essayez le guide d'Ubuntu.
  2. Installez tous les compilateurs, outils et bibliothèques nécessaires. La liste complète est : cmake make g++ libx11-dev libgl1-mesa-dev libglu1-mesa-dev libxrandr-dev libxext-dev. Utilisez sudo apt-get install ***** ou su && yum install ******.
  3. Téléchargez le code source et décompressez-le, par exemple dans ~/Projects/OpenGLTutorials/.
  4. cd dans ~/Projects/OpenGLTutorials/ et entrez les commandes suivantes :

    1. mkdir build
      cd build
      cmake ..
  5. Un makefile a été créé dans le répertoire build/.
  6. Tapez « make all ». Chaque tutoriel et dépendance sera compilé. Chaque exécutable sera aussi copié dans ~/Projects/OpenGLTutorials/. Avec un peu de chance, aucune erreur n'apparaît.
  7. Ouvrez ~/Projects/OpenGLTutorials/playground et lancez ./playground. Une fenêtre noire devrait apparaître.

Notez que vous devriez vraiment utiliser un IDE comme Qt Creator. En particulier, celui-ci supporte les projets CMake nativement et fournira une meilleure expérience au débogage. Voici les instructions pour Qt Creator :

  1. Dans Qt Creator, allez dans « Fichier » (« File ») → « Outils » (« Tools ») → « Options » → « Compilation et exécution » (« Compile&Execute) → CMake ;
  2. Définissez le chemin vers CMake. Celui-ci est probablement /usr/bin/cmake ;
  3. « Fichier » (« File ») → « Ouvrir projet » (« Open Project ») ; Sélectionnez tutorials/CMakeLists.txt ;
  4. Sélectionnez un répertoire de compilation, si possible en dehors du répertoire des tutoriels ;
  5. Définissez optionnellement -DCMAKE_BUILD_TYPE=Debug dans la boite des paramètres. Validez ;
  6. Cliquez sur le marteau en bas. Les tutoriels peuvent maintenant être lancés à partir du répertoire tutorials/ ;
  7. Pour exécuter les tutoriels dans Qt Creator, cliquez sur « Projets » (« Projects ») → « Paramètres d'exécution » (« Execution parameters ») → « Répertoire de travail » (« Working Directory ») et sélectionnez le répertoire où les shaders, textures et modèles sont. Par exemple, pour le second tutoriel : ~/opengl-tutorial/tutorial02_red_triangle/.

IV-C. Compilation sur Mac

Mac OS ne supporte pas OpenGL 3.3. Les récents Mac avec MacOS 10.7 Lion et les GPU compatibles peuvent exécuter OpenGL 3.2, mais pas 3.3. Utilisez le portage OpenGL 2.1 des tutoriels à la place. À part ce point, la procédure est très similaire à celle de Windows (les Makefiles sont aussi supportés, mais on ne l'expliquera pas ici) :

  1. installez XCode à partir du Mac App Store ;
  2. téléchargez CMake et installez le fichier .dmg. Vous n'avez pas besoin d'installer les outils en ligne de commande ;
  3. téléchargez le code source (version 2.1!!) et décompressez-le, par exemple dans ~/Projects/OpenGLTutorials/.
  4. Lancez CMake (Applications → CMake). Dans la première ligne, naviguez jusqu'au dossier décompressé. Si vous n'êtes pas sûr, choisissez le dossier contenant le fichier CMakeLists.txt. Dans la seconde ligne, entrez l'emplacement où vous souhaitez mettre tous les fichiers spécifiques au compilateur. Par exemple, vous pouvez choisir ~/Projects/OpenGLTutorials_bin_XCode/. Notez que cela peut être n'importe où et pas nécessairement dans le même dossier.
  5. Cliquez sur le bouton « Configurer » (« Configure »). Comme c'est la première fois que vous configurez le projet, CMake vous demandera quel est le compilateur à utiliser. Choisissez XCode.
  6. Cliquez sur « Configurer » (« Configure ») jusqu'à ce que les lignes rouges disparaissent. Cliquez sur « Générer » (« Generate »). Votre projet XCode est maintenant créé. Vous pouvez oublier CMake ; désinstallez-le si vous le souhaitez.
  7. Ouvrez ~/Projects/OpenGLTutorials_bin_XCode/. Vous allez voir un fichier Tutorials.xcodeproj : Ouvrez-le.
  8. Sélectionnez le tutoriel dans le panneau de projet que vous souhaitez lancer et utilisez le bouton « Lancer » (« Run ») pour compiler et exécuter :Lancement projet sous XCode

IV-D. Notes pour Code::Blocks

À cause de deux bogues (un dans Code::Blocks, un dans CMake), vous devez éditer la ligne de commande dans Projet (« Project ») → « Options de compilation » (« Build Options ») → « Commandes Make » (« Make commands »), comme suit :

Configuration Code::Blocks et CMake

Vous devez aussi configurer le répertoire de travail vous-même : « Projet » (« Project ») → « Propriétés » (« Properties ») → « Cibles de compilation » (« Build targets ») → tutorial N → « Répertoire d'exécution » (« execution working dir ») (c'est src_dir/tutorial_N/).

V. Exécuter les tutoriels

Vous devez exécuter les tutoriels directement à partir du bon répertoire : simplement en double cliquant sur l'exécutable. Si vous préférez la ligne de commande, cd vers le bon répertoire.

Si vous souhaitez exécuter les tutoriels à partir de l'IDE, n'oubliez pas de lire les instructions ci-dessus pour définir le bon répertoire de travail.

VI. Comment suivre ces tutoriels

Chaque tutoriel est fourni avec son code source et ses données, qui se trouvent dans tutorialXX/. Par contre, vous ne devez jamais modifier ces projets : ils ne servent que de référence. Ouvrez playground/playground.cpp et modifiez ce fichier à la place. Torturez-le comme vous le souhaitez. Si vous êtes perdu, copiez n'importe quel tutoriel dans celui-ci et tout devrait revenir à la normale.

On va fournir des morceaux de code tout au long des tutoriels. N'hésitez pas à les copier/coller dans votre bac à sable durant la lecture : l'expérimentation est une bonne chose. Évitez de vous limiter à lire le code fini : vous n'allez pas apprendre grand-chose comme cela. Même avec un simple copier/coller, vous allez avoir votre lot de problèmes.

VII. Ouvrir une fenêtre

Finalement ! Du code OpenGL !

Enfin, pas vraiment. Tous les tutoriels vous montrent la façon « bas niveau » de faire les choses afin que vous puissiez voir qu'il n'y a pas de magie. Mais cette partie est actuellement très ennuyeuse et inutile, donc on va utiliser GLFW, une bibliothèque externe qui fera cela à notre place. Si vous le souhaitez vraiment, vous pouvez utiliser la Win32 API sous Windows, la X11 API sous Linux et Cocoa sur Mac ; ou utilisez une autre bibliothèque comme SFML, FreeGLUT, SDL, … regardez la page des liens.

Ok, allons-y. Premièrement, on doit gérer les dépendances : on a besoin de choses basiques pour afficher les messages dans la console :

 
Sélectionnez
// Inclure les entêtes standard
#include <stdio.h> 
#include <stdlib.h>

Premièrement, GLEW. Celle-ci est actuellement un peu magique, mais laissez-la pour plus tard.

 
Sélectionnez
// Inclure GLEW. Toujours l'inclure avant gl.h et glfw.h, car c'est un peu magique. 
#include <GL/glew.h>

On a décidé de laisser GLFW gérer la fenêtre et le clavier, donc incluez-la aussi :

 
Sélectionnez
// Inclure GLFW 
#include <GL/glfw3.h>

Pour l'instant, on n'a pas besoin de celle-ci, mais c'est la bibliothèque pour les opérations mathématiques liées à la 3D. Elle va se montrer rapidement très utile. Il n'y a pas de magie dans GLM, vous pouvez écrire votre propre bibliothèque si vous le souhaitez, c'est pratique. Le « using namespace » permet d'éviter de taper « glm::vec3 », au lieu de « vec3 ».

 
Sélectionnez
// Inclure GLM 
#include <glm/glm.hpp> 
using namespace glm;

Si vous copiez/collez toutes ces inclusions dans playground.cpp, le compilateur se plaindra, car il n'y a pas de fonction main(). Donc, créons-la :

 
Sélectionnez
int main() {

La première chose à faire est d'initialiser GLFW :

 
Sélectionnez
// Initialise GLFW 
if( !glfwInit() ) 
{ 
    fprintf( stderr, "Failed to initialize GLFW\n" ); 
    return -1; 
}

On peut maintenant créer notre premier fenêtre OpenGL !

 
Sélectionnez
glfwOpenWindowHint(GLFW_FSAA_SAMPLES, 4); // antialiasing 4x 
glfwOpenWindowHint(GLFW_OPENGL_VERSION_MAJOR, 3); // Nous voulons OpenGL 3.3 
glfwOpenWindowHint(GLFW_OPENGL_VERSION_MINOR, 3); 
glfwOpenWindowHint(GLFW_OPENGL_PROFILE, GLFW_OPENGL_CORE_PROFILE); // Nous ne voulons pas de support de l'ancien OpenGL
 
// Ouvre une fenêtre et crée son contexte OpenGL
GLFWwindow* window; // (Dans le code joint, cette variable est globale) 
window = glfwCreateWindow( 1024, 768, "Tutorial 01", NULL, NULL); 
if( window == NULL ){ 
    fprintf( stderr, "Failed to open GLFW window. If you have an Intel GPU, they are not 3.3 compatible. Try the 2.1 version of the tutorials.\n" ); 
    glfwTerminate(); 
    return -1; 
} 
glfwMakeContextCurrent(window); 
 
// Initialise GLEW 
glewExperimental=true; // Nécessaire pour le profil core
if (glewInit() != GLEW_OK) { 
    fprintf(stderr, "Failed to initialize GLEW\n"); 
    return -1; 
}

Compilez et exécutez ce code. Une fenêtre devrait apparaître et se fermer immédiatement. Évidemment ! On doit attendre que l'utilisateur appuie sur la touche Échap :

 
Sélectionnez
// S'assure que l'on puisse capturer la touche échap utilisée plus bas
glfwSetInputMode(window, GLFW_STICKY_KEYS, GL_TRUE);
 
do{ 
    // N'affiche rien, à bientôt dans le deuxième tutoriel !
 
    // Échange les tampons
    glfwSwapBuffers(); 
 
} // Vérifie si la touche échap a été appuyée ou si la fenêtre a été fermée
while( glfwGetKey(window, GLFW_KEY_ESCAPE ) != GLFW_PRESS && 
glfwWindowShouldClose(window) == 0 );

Et cela conclut notre premier tutoriel ! Dans le deuxième tutoriel, vous allez apprendre comment afficher un triangle.

VIII. Remerciements

Cet article est une traduction autorisée dont le texte original peut être trouvé sur opengl-tutorial.org.

Navigation

   

Sommaire

 

Tutoriel suivant : le premier triangle

Vous avez aimé ce tutoriel ? Alors partagez-le en cliquant sur les boutons suivants : Viadeo Twitter Facebook Share on Google+   

  

Les sources présentées sur cette page sont libres de droits et vous pouvez les utiliser à votre convenance. Par contre, la page de présentation constitue une œuvre intellectuelle protégée par les droits d'auteur. Copyright © 2014 opengl-tutorial.org. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.