Enseignant du Cours: DJAFER BADDOU (PhD)
Courriel: djafer.baddou@uqo.ca
Programmation 2D/3D:
INF 1483
1
Contenu
Introduction
Mathématiques
de l’infographie
Introduction à
l’Infographie
Effets Optiques et
Etat du Rendu
Techniques
d'animation et
simulation 2D/3D
2
Programmation 2D/3D:
INF 1483
Introduction à
OpenGL
IDE en OpenGL
IDE: Code::Blocks
IDE: Visual Studio
Visual Studio
3
Code::Blocks est gratuit, source
ouvert
Introduction
Programmation 2D/3D:
INF 1483
Environnement de Développement
Environnement de Développement Intégré (IDE)
Introduction
4
Programmation 2D/3D:
INF 1483
Autre IDE
Qt Creator: est gratuit, source ouvert mais utilise une
bibliothèque haut niveau QtGL pour que OpenGL
fonctionne.
webGL: bibliothèque OpenGL basée web ( web based )
Pas besoin de compilateur ni IDE.
Besoin:
1. une connaissance de javascript et
2. d’un navigateur qui support javascript.
IDE: Code::Blocks
Téléchargement
Rendez vous
sur http://www.codeblocks.org/
downloads
Télécharger le programme
d’installation pour Windows.
5
Code::Blocks est gratuit, source
ouvert C, C++, and Fortran
compilateur pour les plateforme
Windows, MacOS, and Linux.
C'est là que Code::Blocks se
distingue des autres EDI car il est
portable, ce qui signifie qu'il est
disponible sur au moins les systèmes
les plus utilisés et plus connus soit
Windows, Linux et Mac OS X.
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
Téléchargement Téléchargement
6
Il y a 2 versions disponibles avec
ou sans mingw.
Mingw, Il s’agit d’un
compilateur.
Si vous l’avez déjà installé,
prenez la version sans
compilateur mingw.
Si vous avez un doute prenez la
version avec le compilateur
mingw.
IDE: Code::Blocks
Environnement de Développement Intégré (IDE)
Programmation 2D/3D:
INF 1483
Environnement de Développement
Téléchargement Téléchargement
7
Il y a 2 versions disponibles
avec ou sans mingw.
Mingw, Il s’agit
d’un compilateur.
Si vous l’avez déjà
installé, prenez la version
sans compilateur mingw.
Si vous avez un doute prenez
la version avec le
compilateur mingw.
IDE: Code::Blocks
Environnement de Développement Intégré (IDE)
Programmation 2D/3D:
INF 1483
Environnement de Développement
Lancer l’installation Lancer
8
Après completer le téléchargement,
commencer l’installation.
Le fichier d’installation est localisé
dans le dossier “download” ou
Téléchargement
IDE: Code::Blocks
Environnement de Développement Intégré (IDE)
Programmation 2D/3D:
INF 1483
Environnement de Développement
Installation
Installation
9
lancez l’installation Voici les
différentes étapes :
Run the setup: Après le
lancement du fichier
d’installation le setup Wizard
s’affiche a l’écran.
Pour continuer cliquer sur le
bouton “next.
IDE: Code::Blocks
Environnement de Développement Intégré (IDE)
Programmation 2D/3D:
INF 1483
Environnement de Développement
Installation
Installation
10
lancez l’installation Voici les
différentes étapes :
1. Lire the Software Agreement.
Lire la licence et cliquer “I
Agree” si vous êtes d’accord
aux termes et vous voulez
installer Code::Blocs.
IDE: Code::Blocks
Environnement de Développement Intégré (IDE)
Programmation 2D/3D:
INF 1483
Environnement de Développement
Installation
Installation
11
lancez l’installation Voici les
différentes étapes :
2. Choix des composants: Être
sure de sélectionner
l’installation au complet.
Laissez bien MinGW sélectionné
si vous ne l’avez pas sur votre
PC.
cliquer "Next" pour continuez
l’installation
IDE: Code::Blocks
Environnement de Développement Intégré (IDE)
Programmation 2D/3D:
INF 1483
Environnement de Développement
Installation
Installation
12
lancez l’installation Voici les différentes
étapes :
3. Choix du chemin ou installer: Choisir
le chemin d’installation. Par défaut,
Code::Blocks sera installer dans:
C:\Program Files (x86)\CodeBlocks\.
Si accepter l’installation par défaut
cliquer "Install",
autrement cliquer le bouton "Browse"
pour sélectionner un autre chemin.
IDE: Code::Blocks
Environnement de Développement Intégré (IDE)
Programmation 2D/3D:
INF 1483
Environnement de Développement
Installation
Installation
13
lancez l’installation Voici les
différentes étapes :
4. Attendez pour Compléter
l’installation: L’installation
prend quelques minutes pour
completer et affiche son
progress.
IDE: Code::Blocks
Environnement de Développement Intégré (IDE)
Programmation 2D/3D:
INF 1483
Environnement de Développement
Installation
Installation
14
lancez l’installation Voici les
différentes étapes :
4. Attendez pour Compléter
l’installation:
Lors du lancement de Codeblocks
vous devriez voir GCC ( en fait il
s’agit de minGW) détecté. Sinon je
vous conseille de recommence
l’installation en vérifiant que
MinGW est sélectionné.
IDE: Code::Blocks
Environnement de Développement Intégré (IDE)
Programmation 2D/3D:
INF 1483
Environnement de Développement
Installation Installation
15
lancez l’installation Voici les
différentes étapes :
5. Finir l’installation:
When prompted, do not run
Code::Blocks. First, complete install
wizard. This is done by clicking the
"Next" button on the installer
screen, then clicking "Finish" on
the completion page.
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
Lancer Code::Blocks Lancer Code::Blocks
16
1. Lancer par un double click sur
l’icone Code::Blocks placer sur
le bureau. S’il n’y a pas une
raccourcie sur le bureau,
trouver Code::Blocks dans
Start--> All Programs --->
Code::Blocks --> CodeBlocks.exe
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
Completer Installation du Compilateur
17
Si demander, accept GNU GCC
Compiler as the default. Cliquer ou
sélectionner le compilateur GNU
GCC, puis cliquer "Set as Default".
Pour continuer, cliquer "OK".
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
Associations des Fichiers Associations des Fichiers
18
Si demander l’option de
sélectionner , select the option to
associate Code::Blocks with C and
C++ file types.
Si vous accepter cliquer "OK".
Dans ce cas si vous double cliquer
sur un ficher C /C++ Code::Blocks
sera lancer par defaut.
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
Créer un Nouveau Projet Créer un Nouveau Projet
19
Dans la page principale,
sélectionner le lien et cliquer sur le
projet.
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement Intégré (IDE)
Choisir le Type de Projet Choisir le Type de Projet
20
Sur le "New from Template"
fenêtre, sélectionner le "Files"
heading a gauche de la fenêtre.
puis, sélectionner l’option "C/C++
Source". Cliquer "Go" pour
continuer.
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
Empty File Wizard Empty File Wizard
21
Utiliser le Wizard pour créer et
configurer le fichier C ou C++. Pour
continuer, cliquer "Next".
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
Choisir le Type Fichier Choisir le Type Fichier
22
Sélectionner l’option de créer un
fichier "C" ou “C++”. Une fois
sélectionnée, cliquer le bouton
"Next" pour continue.
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
Chemin du Fichier Chemin du Fichier
23
Cliquer le bouton "..." sur le menu
setup pour ouvrir la fenêtre
explorateur du fichier pour créer le
fichier source C ou C++.
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
Sélectionner Nom de Fichier Sélectionner Nom de Fichier
24
1. Naviguer a la location désirée
pour enregistrer le fichier
source C ou C++. Choisir un
nom de fichier. Finalement,
cliquer "Save" pour enregistrer.
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
Terminer Wizard du Fichier
Terminer Wizard du Fichier
25
Confirmer la création du fichier C
ou C++, cliquer "Finish"
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
Entrer le Code Source
Entrer le Code Source
26
Simple C Program
Entrer le code source du programme
"Hello World“. Copier le code
dessous dans Code::Blocks.
#include <stdio.h>
#include <stdlib.h>
int main( ){
printf("Hello World.\n");
return 0;
}
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
Executer le Programme
Executer le Programme
27
Cliquer le Icon "Build" pour
compiler le programme ou "Build
and Run" Pour compiler et
exécuter le programme a la fois.
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
Visualiser le Programme Visualiser le Programme
28
Après l’exécution du programme
une fenêtre DOS s’affiche et
montre a message "Hello World."
le process retourne 0.
IDE: Code::Blocks
Programmation 2D/3D:
INF 1483
Environnement de Développement
http://msdn.microsoft.com/en-us/vstudio/cc136611
http://msdn.microsoft.com/library/60k1461a
MS Visual studio IDE
Visual C++ fournit un environnement de développement
puissant et flexible pour la création d’applications basées sur
Microsoft Windows et Microsoft. NET.
Visual C ++ se compose des éléments suivants:
- Un compilateur C/C++.
- Les librairies standard de C/C++: ATL, STL, MFC, etc .
- Un environnement de développement (IDE) de C++.
Visual C++ offre aussi la possibilité de développer des
applications Web (ex: smart-client Windows-based applications).
30
MS Visual studio IDE (suite)
Téléchargeable sur le site de Microsoft:
http://www.microsoft.com/visualstudio/en-us/products/2010-editions/visual-cpp-express
31
MS Visual studio IDE (suite)
Visual C++ permet de construire différents types de projets:
Ex: Console, MFC, ATL, etc.
Un projet console par exemple contiendra ce qui suit:
- Le nom du projet avec ses fichiers de spécifications.
- Un répertoire Debug qui contiendra les exécutables.
- Les fichiers sources (.h et .cpp).
Un projet doit être d’abord compilé avant d’être exécuté.
Lexécution d’un programme peut être en 3 modes différents:
1- mode avec debugger, 2- mode sans le debugger ou 3- mode
release.
32
MS Visual studio IDE (suite)
Lorsqu’on appuie sur la touche F5 (Start Debugging), Visual
studio lance l’application et lui attache le débogueur.
Le débogueur de Visual Studio est un outil puissant qui
permet d'observer le comportement d'exécution d’un
programme et de localiser les erreurs logiques.
Le débogueur permet de rompre ou de suspendre
l'exécution d’un programme afin d'examiner le code,
d'évaluer et de modifier des variables du programme, voir les
registres, voir les instructions créées à partir de du code
source et d'afficher l'espace mémoire utilisé par l’application.
33
MS Visual studio IDE (suite)
Lorsqu’on appuie sur la touche CTRL F5 (Start without
Debugging), Visual studio lance l’application sans lui attacher
le débogueur.
Sans le débogueur attaché, lorsque l'application s'exécute, il
ne sera pas possible de faire des points d'arrêt émettent des
messages de débogage.
Avec le mode release, les informations de débogage ne
seront pas affichées et l'exécution du code est optimisée,
contrairement aux modes précédents.
34
MS Visual studio IDE (suite)
Voici des liens utiles pour apprendre la construction
d’applications avec Microsoft Visual C++:
http://msdn.microsoft.com/en-us/vstudio/cc136611
Voir les rubriques à droite de la page:
1. Getting Started with Visual Studio
2. Projects and Solutions
3. Files and Folders
4. Finding your way around Visual Studio
5. Finding your way around your code
6. Basic Debugging
7. Working with Designers
IDE: Visual Studio
Avant d’effectuer l’installation
Vérifiez que votre ordinateur est
prêt à installer Visual Studio 2017.
Effectuer des mises à jour et faire
de la place !
Appliquez les dernières mises à
jour Windows
Vérifiez que votre espace disque
est suffisant
35
IDE; pour Windows, iOS, Android
web, and cloud.
IDE: Visual Studio
Programmation 2D/3D:
INF 1483
Environnement de Développement
Téléchargement Installation
Choisissez les composants que
vous souhaitez installer ou
« installation par défaut » pour
installer les outils les plus
courants.
36
téléchargement de Visual Studio
2017.
Téléchargez Visual Studio 2017
Le fichier sera télécharet vous
devriez « Enregistrer sous... » si
nécessaire
IDE: Visual Studio
Programmation 2D/3D:
INF 1483
Environnement de Développement
Lancement Lancement
.
37
Cest prêt ! Créer une application.
Redémarrez votre ordinateur, le
cas échéant
Lancez Visual Studio 2017
Identifiez-vous (en option)
Bienvenue !
IDE: Visual Studio
Programmation 2D/3D:
INF 1483
Environnement de Développement
Projet Console Vide
Projet Console Vide
38
lancer Visual Studio 2017.
Au menu bar, choisir File, New,
Project.
Dans la catégorie Visual C++
choisir Empty Project et donner
un nom au projet “HelloWorld”.
dans Solution Explorer, cliquer
droit Source Files choisir Add,
New Item.
IDE: Visual Studio
Programmation 2D/3D:
INF 1483
Environnement de Développement
Projet Console Vide
Projet Console Vide
39
Vous avez créée un projet console
vide pour C or C++ code.
Copier le code dessous dans un
nouveau fichier C++,
“HelloWorld.cpp” file, entrer le code
suivant:
#include <iostream>
int main()
{
std::cout << "Hello, World!" << std::endl;
return 0;
}
Appuyer sur CTRL-F5 pour build and run.
IDE: Visual Studio
Programmation 2D/3D:
INF 1483
Environnement de Développement
Projet Console Vide
Projet Console Vide
40
Exécuter le programme a partir de
ligne de command ( the command
line) .
Taper helloworld.
Cette capture d’écran montre les
fichiers avec Hello World.
Félicitation, l’environnement est
configuré.
IDE: Visual Studio
Programmation 2D/3D:
INF 1483
Environnement de Développement
main.cpp
Fichier source de C/C++ programme
#include <iostream> C/C++ préprocesseur, <….> le fichier est
dans le standard include.
using namespace std permet d'éviter juste des collisions entre les
noms provenant de librairies extérieures et ton code.
Il est donc nécessaire pour l'utiliser de placer l'injonction : « using
namespace std »; en début de programme, ou le préfixe
: « std:: » à chaque appel d'objet, classe ou fonction de celle-ci
« std::cout »
Tout programme de C++ doit avoir la fonction main() comme
point d’entré.
La fonction main() retourne un entier, peut accepter des
arguments entre parenthèses ( ), le corps de main( ), aussi toute
fonction, doit être entre accolades { }.
Le corps de chaque fonction() contient des instructions dont
chacune termine avec un point virgule ( ; )
41
#include <iostream>
using namespace std;
int main( )
(
cout << " Hello World
!" << endl;
return 0 ;
}
Application Programme
Programmation 2D/3D:
INF 1483
Environnement de Développement
main.cpp
Fichier source de C/C++ programme
Je compile et link helloWorld.cpp à ligne de
commande:
g++ -o helloWorld helloWorld.cpp
J’obtient le fichier exécutable et je l’exécute à la
ligne de commande:
helloWorld
à l exécution le système d’exploitation appelle la
fonction main() comme point dentré au programme.
42
#include <iostream>
using namespace std;
int main( )
(
cout << " Hello World !" <<
endl;
return 0 ;
}
Programmation Application
Programmation 2D/3D:
INF 1483
Environnement de Développement
helloWorld.cpp
Fichier source de C/C++ programme
à la fin du programme la fonction
main() doit retourner l’entier 0 au
système d’exploitation, indication de
son succès et affiche:
Si non une erreur devrait être traiter.
43
#include <iostream>
using namespace std;
int main( )
(
cout << " Hello World !"
<< endl;
return 0 ;
}
Programmation d’Applications
Programmation 2D/3D:
INF 1483
Hello World !
Environnement de Développement
Rappel
Abstraction
Permet la
distinction ent
re les objets et
par
conséquence
oriente
l’utilisation et
la
manipulation
d’objets.
44
Les langages
informatiques
modernes tendent a
créer des
programmes orien
objet (POO) dont la
particularité:
Abstraction
Encapsulation
Polymorphisme
Héritage
Réutilisation
Programmation d’Applications
Programmation 2D/3D:
INF 1483
Environnement de Développement
Class Point: ./header/point.h
Class Point:. /source/point.h
private indique que ces
membres ( données ou
fonctions ) sont
accessible,
généralement, que par
des fonctions
membres de la class
contrairement au
public.
Privatisation des
données privées (
private ) est appelée
encapsulation des
données.
#ifndef __POINT_HH // C
préprocesseur directive: on veut
définir
#define __POINT_HH //point.h une
seule fois
#include <iostream>
using namespace std;
class Point { //class : unité de base
d’un programme C++, qui:
private:
int m_x , m_y ; //regroupe des
données et
public:
Point( ) ; //des fonctions
dans une seule entité
void printMe( ) ;
} ; //termine avec (;)
#endif // __POINT_HH
Rappel
45
Les langages
informatiques
modernes tendent a
créer des
programmes orien
objet (POO) dont la
particularité:
Abstraction
Encapsulation
Polymorphisme
Héritage
Réutilisation
Programmation d’Applications
Programmation 2D/3D:
INF 1483
Environnement de Développement
Encapsulation
est un mécanisme
consistant à rassembler les
données et les méthodes au
sein d'une structure en
cachant l'implémentation
de l'objet:
Protection de l’accès
aux données
(mécanisme d’accès /
modification).
Augmenter la sécurité
de la structure.
facilité la maintenance
de la structure.
L'encapsulation permet
donc de garantir
l'intégrité du contenu
de la structure.
Class Point: ./header/point.h
Class Point:. /source/point.h
private indique que ces
membres ( données ou
fonctions ) sont
accessible,
généralement, que par
des fonctions
membres de la class
contrairement au
public.
Privatisation des
données privées (
private ) est appelée
encapsulation des
données.
#ifndef __POINT_HH // C
préprocesseur directive: on veut
définir
#define __POINT_HH //point.h une
seule fois
#include <iostream>
using namespace std;
class Point { //class : unité de base
d’un programme C++, qui:
private:
int m_x , m_y ; //regroupe des
données et
public:
Point( ) ; //des fonctions
dans une seule entité
void printMe( ) ;
} ; //termine avec (;)
#endif // __POINT_HH
Rappel
46
Les langages
informatiques
modernes tendent a
créer des
programmes orien
objet (POO) dont la
particularité:
Abstraction
Encapsulation
Polymorphisme
Héritage
Réutilisation
Programmation d’Applications
Programmation 2D/3D:
INF 1483
Environnement de Développement
Polymorphisme
Permettre de
redéfinir dans une
classe dérivée les
méthodes dont elle
hérite de sa classe
mère. une même
méthode possède
alors plusieurs
formes.
Rappel
47
Les langages
informatiques
modernes tendent a
créer des
programme orienté
objet (POO) dont la
particularité:
Abstraction
Encapsulation
Polymorphisme
Héritage
Réutilisation
Programmation d’Applications
Programmation 2D/3D:
INF 1483
Environnement de Développement
Réutilisation
L'importance des
progiciels conçus à l'aide
de la programmation
orientée-objet est dans sa
capacité de réutilisation.
Lorsque vous utilisez un
ou plusieurs objets qui
existent déjà dans votre
banque, vous ne partez
pas à zéro.
Toutes les particularités
au dessus sont un
exemple de réutilisation
de même que la
production d’un fichier
objet ou l’héritage sont
que deux façons de
réutilisation de code.
Class Point:
./source/point.cpp
le symbole :: est un
opérateur de résolution
de portée (scope)
On compile
point.cpp pour obtenir
un fichier objet point.o
g++ -c point.cpp
De cette façon le fichier
objet point.o peut être
réutiliser par autres
programmeurs sans sa
modification. Cest une
façon de réutilisation de
code.
#include "point.h" /*
instruction au compilateur de
trouver la déclaration de la
classe Point dans le fichier
point.h */
Point::Point ( ) { // Point( ) est
une fonction spéciale appelée
m_x = 0 ; //
constructeur qui a le nom du
class
m_y = 0 ; // ne
retourne aucun type même void
// constructeur
sert à initialiser les variables
}
void Point::printMe ( ) {
cout << endl;
cout << "Le point d'origine O (
" << m_x << " , " << m_y << " ) "
<< endl;
}
Rappel
Abstraction
Permet la
distinction ent
re les objets et
par
conséquence
oriente
l’utilisation et
la
manipulation
d’objets.
48
Les langages
informatiques
modernes tendent
a créer des
programmes orien
té objet (POO)
dont la
particularité:
Abstraction
Encapsulation
Polymorphisme
Héritage
Réutilisation
Programmation d’Applications
Programmation 2D/3D:
INF 1483
Environnement de Développement
./source/main.cpp
une classe définit juste un
modèle de variable (une sorte
de type) qui regroupe un
ensemble de variables et
fonctions dans un nouveau
type. Cette variable s’appelle
objet ( ou instance ) de class.
Comme toute variable, il faut
déclarer et définir une variable
du type comme suit:
Point p ;
Une fois l’objet déclaré, toutes
les méthodes sous le mot clé
public de la classe peuvent être
invoquées. On invoque les
méthodes avec l'opérateur
point ( . )
p.printMe( );
#include "point.h"
#include <iostream>
using namespace std;
int main( ){
Point p ; // déclare
un objet p ( instance ) de
class Point
p.printMe( );
return 0 ; //retourne
la valeur 0
}
Rappel
49
Les langages
informatiques
modernes tendent a
créer des
programme orienté
objet (POO) dont la
particularité:
Abstraction
Encapsulation
Polymorphisme
Héritage
Réutilisation
Programmation d’Applications
Programmation 2D/3D:
INF 1483
Environnement de Développement
Réutilisation
L'importance des
progiciels conçus à l'aide
de la programmation
orientée-objet est dans sa
capacité de réutilisation.
Lorsque vous utilisez un
ou plusieurs objets qui
existent déjà dans votre
banque, vous ne partez
pas à zéro.
Toutes les particularités
au dessus sont un
exemple de réutilisation
de même que la
production d’un fichier
objet ou l’héritage sont
que deux façons de
réutilisation de code.
./source/main.cpp
On obtient le
fichier exécutable
et on l’exécute à
la ligne de
commande:
./ Point
À l’exécution le
programme
affiche les
coordonnées du
point.
On link le
fichier objet poi
nt.o avec le
fichier
main.cpp pour
obtenir le fichier
exécutable
Point.exe
du programme
qui crée un
objet Point:
g++ -
o Point main.cp
p point.o
Rappel
50
Les langages
informatiques
modernes tendent a
créer des
programme orienté
objet (POO) dont la
particularité:
Abstraction
Encapsulation
Polymorphisme
Héritage
Réutilisation
Programmation d’Applications
Programmation 2D/3D:
INF 1483
Environnement de Développement
Héritage
Permettre la création d’une
classe à partir d’une classe
existante.
La classe dérivée ( fille )
contient sous certaines
conditions les attributs et
les méthodes de la classe
Mère ( super-classe ).
est une technique très
puissante et extrêmement
pratique.
il est très utile qu’une classe
soit construite à partir d'une
autre classe, en conservant
les propriétés de la classe
d'origine et en en acquérant
de nouvelles propriétés.
Fichier:
./header/shape.h
Fichier: ./source/ shape.cpp
private indique que ces membres (
données ou fonctions ) sont
accessible, généralement, que par
des fonctions membres de la class
contrairement au public.
Privatisation des données privées (
private ) est appelée
encapsulation des données.
51
#ifndef __SHAPE_HH // C pre-processeur directive: on veut
#define __SHAPE_HH //shape.h une seule fois
#include "point.h"
#include <iostream>
using namespace std;
class Circle : public Point {
private:
int m_x , m_y ; //regroupe des données et
public:
Cicle( ) ; //des fonctions dans une seule entitée
void printMe( ) ;
} ; //termine avec (;)
#endif // __POINT_HH
Interface de Programmation d’Applications (API)
Introduction à OpenGL
Programmation 2D/3D:
INF 1483
Rappel
52
Les langages
informatiques
modernes tendent a
créer des
programme orienté
objet (POO) dont la
particularité:
Abstraction
Encapsulation
Polymorphisme
Héritage
Réutilisation
Programmation d’Applications
Programmation 2D/3D:
INF 1483
Environnement de Développement
Réutilisation
L'importance des
progiciels conçus à l'aide
de la programmation
orientée-objet est dans sa
capacité de réutilisation.
Lorsque vous utilisez un
ou plusieurs objets qui
existent déjà dans votre
banque, vous ne partez
pas à zéro.
Toutes les particularités
au dessus sont un
exemple de réutilisation
de même que la
production d’un fichier
objet ou l’héritage sont
que deux façons de
réutilisation de code.
Build: ./source/shape.cpp
On compile
et link shape.cpp pou
r obtenir
une bibliotheque libs
hape.a et ibshape.dll
le fichier
objet libshape.a peu
t être réutiliser par
autres programmeurs
sans sa modification.
Cest une façon
de réutilisation de
code.
Fichier: ./source/main.cpp
Rappel
Abstraction
Une API est un
ensemble réuti
lisable de:
fonctions,
structures,
classes,
constantes et
autres objets,
Fonctionnalités
d’une API
LAPI se veut donc
un outil
suffisamment
puissant et simple
pour simplifier la vie
du programmeur.
Ce dernier pourra
donc se concentrer
sur des tâches plus
53
Les langages
informatiques
modernes tendent
a créer des
programmes orien
té objet (POO)
dont la
particularité:
Abstraction
Encapsulation
Polymorphisme
Héritage
Réutilisation
Interface de Programmation d’Applications (API)
Programmation 2D/3D:
INF 1483
Environnement de Développement
Qu’est-ce qu’une API ?
Une API permet de fournir un
certain niveau d’encapsulatio
n c’est-à-dire
qu’elle masque la complexité
de l’accès à un système ou à
une application en proposant
de connaitre seuls les
paramètres et les valeurs
retournées.
il s'agit d'une certaine façon
de l'interface proposée à
l'utilisateur.
Grâce aux API,
un développeur n’a
donc pas à se soucier de
la façon dont les fonctions
ont été implémentées
pour pouvoir l'utiliser
dans un programme.
Une API qui permettent
de faciliter
le veloppement d’une
application :
logiciels,
jeux,
etc…
LAPI en tant que
un certain
nombre de fonctions,
classes et autres
objets sont généralement l
ocalisés au sein
d’un même fichier (.h
en C/C++).
Une API permet de fournir
un certain
niveau dabstraction au
veloppeur.
Exercices Exercices
Une API est un
ensemble réuti
lisable de:
fonctions,
structures,
classes,
constantes et
autres objets,
Fonctionnalités
d’une API
LAPI se veut donc
un outil
suffisamment
puissant et simple
pour simplifier la vie
du programmeur.
Ce dernier pourra
donc se concentrer
sur des tâches plus
54
Les langages
informatiques
modernes tendent
a créer des
programmes orien
té objet (POO)
dont la
particularité:
Abstraction
Encapsulation
Polymorphisme
Héritage
Réutilisation
Interface de Programmation d’Applications (API)
Programmation 2D/3D:
INF 1483
Environnement de Développement
Exercices
Une API permet de fournir un
certain niveau d’encapsulatio
n c’est-à-dire
qu’elle masque la complexité
de l’accès à un système ou à
une application en proposant
de connaitre seuls les
paramètres et les valeurs
retournées.
il s'agit d'une certaine façon
de l'interface proposée à
l'utilisateur.
Grâce aux API,
un développeur n’a
donc pas à se soucier de
la façon dont les fonctions
ont été implémentées
pour pouvoir l'utiliser
dans un programme.
Une API qui permettent
de faciliter
le veloppement d’une
application :
logiciels,
jeux,
etc…
LAPI en tant que
un certain
nombre de fonctions,
classes et autres
objets sont généralement l
ocalisés au sein
d’un même fichier (.h
en C/C++).
Une API permet de fournir
un certain
niveau dabstraction au
veloppeur.
OpenGL et ses Extensions
55
Les APIs de graphiques utilisées dans
le cours sont: OpenGL et ses
extensions.
Qu'est-ce qu'OpenGL?
OpenGL (Open Graphics Library ) est
une API standard:
coue d’un côté au programmer
pour développer des applications
qui produisent des graphiques
2D/3D.
d’un autre côté pour produire des
graphiques 2D/3D indépendants du
plateforme,
Les APIs Utilisées
Programmation 2D/3D:
INF 1483
Environnement de Développement
Ou se situe API OpenGL?
Dans sa forme moderne, OpenGL est une
librairie multiplateforme qui sert à
communiquer avec les GPU programmable,
dans le but de rendre des images 3d en
temps réel.
OpenGL et ses Extensions
56
Il y a plusieurs manières avec lesquelles
un utilisateur peut interagir avec un
système graphique par exemple par les
dispositifs d’entrée ( sourie, clavier, etc. )
En utilisant des API des librairies
Graphiques , un programmeur peut
construire des images en interagissant
avec le système grâce aux dispositifs
d’entrée: sourie, clavier, etc.
Les APIs Utilisées
Programmation 2D/3D:
INF 1483
Environnement de Développement
Comme, OpenGL est une librairie
multiplateforme.
OpenGL permet d’utiliser d’autres interfaces
appelées extensions ayant accès à toutes les
options du matériel ( hardware
) graphiques.
Portabilité
cross-plateforme et Portabilité d’ OpenGL
57
L'une des grandes forces d'OpenGL - et
l'une de ses priorités - est sa portabilité
dans les divers systèmes d'exploitation.
Dans ce cas OpenGL laisse le système de
fenetrage, etc.. Aux extensions qui fournit
une interface multiplateforme entre le
système de fenêtrage et OpenGL.
En utilisant des API des librairies
Graphiques , un programmeur peut
construire des images en interagissant
avec le système grâce aux dispositifs
d’entrée: sourie, clavier, etc.
Before you can start drawing things, you
need to initialize OpenGL. This is done by
creating an OpenGL context, which is
essentially a state machine that stores all
OpenGL et ses Extensions
Programmation 2D/3D:
INF 1483
Environnement de Développement
The problem is that creating a window and
an OpenGL context is not part of the
OpenGL specification. That means it is done
differently on every platform out there!
Developing applications using OpenGL is all
about being portable, so this is the last thing
we need. Luckily there are libraries out there
that abstract this process, so that you can
maintain the same codebase for all
supported platforms.
While the available libraries out there all
have advantages and disadvantages, they do
all have a certain program flow in common.
You start by specifying the properties of the
game window, such as the title and the size
and the properties of the OpenGL context,
Portabilité
cross-plateforme et Portabilité d’ OpenGL
58
Your application will then initiate the event
loop, which contains an important set of
tasks that need to be completed over and
over again until the window closes. These
tasks usually handle window events like
mouse clicks, updating the rendering state
and then drawing.
This program flow would look something
like this in pseudocode:
OpenGL et ses Extensions
Programmation 2D/3D:
INF 1483
Environnement de Développement
#include <libraryheaders>
int main() {
createWindow(title, width, height);
createOpenGLContext(settings);
while (windowOpen) {
while ( event = newEvent() )
handleEvent(event);
updateScene();
drawGraphics();
presentGraphics();
}
return 0;
}
Portabilité
cross-plateforme et Portabilité d’ OpenGL
59
There are many libraries around that can create
a window and an accompanying OpenGL context
for you. There is no best library out there,
because everyone has different needs and
ideals. I've chosen to discuss the process for the
three most popular libraries here for
completeness, but you can find more detailed
guides on their respective websites. All code
after this chapter will be independent of your
choice of library here.
SFML
SFML is a cross-platform C++ multimedia library
that provides access to graphics, input, audio,
networking and the system. The downside of
using this library is that it tries hard to be an all-
in-one solution. You have little to no control over
the creation of the OpenGL context, as it was
designed to be used with its own set of drawing
OpenGL et ses Extensions
Programmation 2D/3D:
INF 1483
Environnement de Développement
SDL
SDL is also a cross-platform multimedia
library, but targeted at C. That makes it a bit
rougher to use for C++ programmers, but it's
an excellent alternative to SFML. It supports
more exotic platforms and most importantly,
offers more control over the creation of the
OpenGL context than SFML.
GLFW
GLFW, as the name implies, is a C library
specifically designed for use with OpenGL.
Unlike SDL and SFML it only comes with the
absolute necessities: window and context
creation and input management. It offers
the most control over the OpenGL context
creation out of these three libraries.
Extension Utilisées
60
OpenGL entant que source
ouverte (open source) offre
des outils aux développeurs
et les encourage à faire
évoluer la bibliothèque
graphique et à la rendre
utilisable sur un très grand
nombre de plateformes.
En plus d'OpenGL, je vai
utiliser trois librairies bien
pratiques:
GLUT
GLEW
WebGL
OpenGL et ses Extensions
Programmation 2D/3D:
INF 1483
Environnement de Développement
(GL Utility Toolkit),
qui fournit une
interface
multiplateforme
entre le système de
fenêtrage et
OpenGL.
GLEW
GLUT
(GL Extensions Wrangler),
qui simplifie la gestion des
différentes versions
d'OpenGL et ses
extensions.
Ou récupérer OpenGL, GLUT et GLEW?
Ou récupérer OpenGL, GLUT et GLEW?
5. Vous pouvez utiliser le l'OpenGL Extensions Viewer
de RealTech pour déterminer quelle version
d'OpenGL votre driver supporte (NDT: Je lui préfère
GPU Caps Viewer, plus complet, mais uniquement
sous Windows).
6. Les drivers OpenGL nVidia et AMD supportent au
moins OpenGL 2.0 sur toute les cartes graphiques
sorties au court des quatre dernières années.
7. Les utilisateurs de chipset intégré Intel et de carte
graphiques plus anciennes ont moins de chance.
8. Comme solution de replis, Mesa fournit une
implémentation software multiplateforme et open-
source d'OpenGL 2.1 qui fonctionne sur windows et
presque toute les plateformes Unix.
OpenGL
61
1. OpenGL est livré en standard (d'une façon ou
une autre) sur MacOS X, Windows et la
plupart des distributions Linux.
2. Si vous voulez suivre ces tutoriaux, vous devez
être sur que votre implémentation d'OpenGL
supporte au moins la version 2.0
3. L'implémentation OpenGL de MacOS X
supporte toujours OpenGL 2.0, au moins en
software si le pilote de la carte graphique ne
la fournit pas.
4. Sur Windows, cela dépend des pilotes de
votre carte graphique.
Programmation 2D/3D:
INF 1483
Environnement de Développement
Ou récupérer OpenGL, GLUT et GLEW?
Ou récupérer OpenGL, GLUT et GLEW?
10. Pour installer GLUT et GLEW, allez chercher les
packages binaires sur leurs sites respectifs. MacOS
X est livré avec GLUT préinstallé.
11. La plupart des distribution linux ont GLUT et GLEW
disponible aux travers de leurs "system package",
bien que pour GLUT, vous devriez avoir à activer les
dépôts optionnels "non-free", dans la mesure ou sa
licence n'est pas, techniquement, open source.
12. Il y a un clone de GLUT open source appelé
OpenGLUT si vous êtes pointilleux sur ce genre de
choses.
13. Si vous êtes un développeur C chevronné, vous
devriez être capable d'installer ses librairies et de
les faire fonctionner avec votre IDE sans
problèmes.
OpenGL
62
9. Mesa est également, l'implémentation
OpenGL la plus communément utilisé sous
Linux, ou elle fonctionne également avec X
server pour interfacer OpenGL avec la carte
graphique en utilisant les pilotes "direct
rendering interface" (DRI).
10. Vous pouvez déterminer si votre pilote DRI
supporte OpenGL 2.0 en lançant la commande
glxinfo depuis un xterm. Si OpenGl 2.0 n'est
pas supporté sur votre machine, vous pouvez
désactiver le driver pour vous replier vers
Mesa et son implémentation software. nVidia
fournit également sa propre implémentation
OpenGL propriétaire pour Linux qui vise
uniquement leur GPU; Cette implémentation
devrait fournir OpenGL 2.0 ou plus sur
Programmation 2D/3D:
INF 1483
Environnement de Développement
OpenGL et GLUT
Télécharger GLUT:
FreeGLUT (GLUT):
support la fenêtre d’affichage,
initialise le contexte OpenGL et
aide a recevoir les données:
de la souris et
le clavier.
OpenGL & Code::block
63
OpenGL devrait déjà être présent
ce sera probablement Freeglut /
GLUT qui manquera.
GLUT est très daté maintenant ( Nov
2001 ) et n'est pas activement
supporté
donc vous devriez certainement
utiliser Freeglut à la place.
Vous n'aurez pas à changer votre
code du tout, et quelques
fonctionnalités supplémentaires
seront disponibles.
Programmation 2D/3D:
INF 1483
Environnement de Développement
OpenGL et GLUT
OpenGL
OpenGL
64
Les platforms supportées:
1. Windows
2. Linux
3. Mac
Programmation 2D/3D:
INF 1483
Environnement de Développement
IDE
Option
Code::Blocks Windows
opengl32
glew32
Code::Blocks Linux
GL
DevC++
-
lopengl32
-
lglew32
Visual Studio
opengl32.lib
glew32.lib
Télécharger GLUT:
Télécharger GLUT:
Lorsque vous téléchargez ces
fichiers, vous trouverez que le
dossier Freeglut (GLUT) a trois
sous-dossiers:
1. bin: contient les fichiers dll pour
l'exécution
2. include: les fichiers d'en-tête
pour la compilation
3. lib: contient les fichiers de
bibliothèque pour la compilation
OpenGL & Code::block
65
1. Vous trouverez
ici des ensembles de
fichiers pré-packagés :
http://freeglut.sourceforge.net/i
ndex.php#download ou
http://www.xmission.com/~nate/glut.ht
ml
Programmation 2D/3D:
INF 1483
Environnement de Développement
Installation
Installation
1. Télécharger GLUT:
http://www.xmission.com/~nate/glut.html
OpenGL & Code::block
66
Les instruction d’installation
suggèrent de:
1. Copier glut32.dll dans
C:\windows\system
2. Copier glut32.lib dans
C:\Program
Files\CodeBlocks\MinGW\lib
3. Copier glut.h dans
C:\Program
Files\CodeBlocks\MinGW\include\GL
Programmation 2D/3D:
INF 1483
Environnement de Développement
OpenGL
Extensions
En plus
d'OpenGL, je vai
utiliser deux
librairies bien
pratiques:
GLUT
GLEW
67
Ou puis-je récupérer OpenGL, GLUT et
GLEW?
OpenGL et ses Extensions
Programmation 2D/3D:
INF 1483
Environnement de Développement
GLEW
(GL Utility Toolkit), qui fournit une
interface multiplateforme entre le système
de fenêtrage et OpenGL.
Il y a plusieurs manières avec lesquelles
un utilisateur peut interagir avec un
système graphique par exemple par
les dispositifs d’entrée ( sourie,
clavier, etc. )
En utilisant des API des librairies
Graphiques , un programmeur peut
construire des images en interagissant
avec le système grâce aux dispositifs
d’entrée: sourie, clavier, etc.
(GL Extensions
Wrangler), qui
simplifie la gestion
des différentes
versions d'OpenGL
et ses extensions.
GLUT
Projet OpenGL avec GLUT
Projet OpenGL avec GLUT
68
4. Donner un nom au projet, et
choisir sa Location et appuyer
sur Next
Programmation 2D/3D:
INF 1483
OpenGL & Code::block
Environnement de Développement
Projet OpenGL avec GLUT
Projet OpenGL avec GLUT
69
1. lancer Code::Blocks et choisir
new project.
2. Sélectionner new GLUT
project and appuyer Go pour
continuer.
3. Appuyer Next a ce menu
Programmation 2D/3D:
INF 1483
OpenGL & Code::block
Environnement de Développement
Projet OpenGL avec GLUT
Projet OpenGL avec GLUT
70
5. Indiquer a Code::Blocks ou les
fichiers GL sont places:
1. glut32.dll dans
C:\windows\system
3. glut32.lib dans
C:\Program
Files\CodeBlocks\MinGW\lib
4. glut.h dans
C:\Program
Files\CodeBlocks\MinGW\include\G
Puis appuyer Next
Programmation 2D/3D:
INF 1483
OpenGL & Code::block
Environnement de Développement
Projet OpenGL avec GLUT
Projet OpenGL avec GLUT
71
6. Être sure que le compilateur
est GNU GCC Compiler, et
appuyer sur Finish.
7. Ouvrir l’échantillon fichier
source avec un double click.
8. Dans le cas de Windows,
ajouter
#include <windows.h>
Toute au debut.
Programmation 2D/3D:
INF 1483
OpenGL & Code::block
Environnement de Développement
Code::Block Project
Code::Block Project
72
9. Compile et build l'application
Programmation 2D/3D:
INF 1483
OpenGL & Code::block
Environnement de Développement
OpenGL et GLUT
OpenGL et GLUT
File
Location
glut32.dll
Windows XP | Server 2003:
C:
\WINDOWS\system\
Windows 2000:
C:
\WINNT\system\
glut32.lib
C:
\Program Files\Microsoft Visual Studio NET
2003
\Vc7\PlatformSDK\Lib
glut.h
C:
\Program Files\Microsoft Visual Studio NET
2003
\Vc7\PlatformSDK\Include\gl
73
Etape 1: Installation GLUT
Windows vient avec OpenGL,
aussi Visual Studio vient avec la
bibliothèque OpenGL, mais ni
Windows ni Visual Studio vient
avec GLUT.
http://freeglut.sourceforge.net/i
ndex.php#download ou
http://www.xmission.com/~nate/glut.ht
ml
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
Mettre les fichiers suivants dans les
locations suivantes:
OpenGL et GLUT
OpenGL et GLUT
74
Étape 2: Créer un projet
console vide:
1. File → New → Project...
2. La fenêtre New Project
s’affiche.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL et GLUT
OpenGL et GLUT
75
Étape 2: Créer un projet
console vide:
3. Dans Project Types: choisir:
Visual C++ Projects.
4. Puis dans Templates choisir:
Win32 Console Project
5. Nom le projet et le chemin et
cliquer OK.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL et GLUT
OpenGL et GLUT
76
Étape 2: Créer un projet
console vide:
6. Le Wizard de l’application Win32
s’affiche.
7. Cliquer sur la tabulation
Application Settings a gauche,
8. Sélectionner Application Type:
Console Application et Additional
Options: Empty Project. Then
9. click Finish.
10. le projet est créé.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL et GLUT
OpenGL et GLUT
77
Étape 3: Ajouter le code source
When you include GLUT in a program, it automatically
includes the rest of the OpenGL header files.
So explicitly having
#include <GL/gl.h>
#include <GL/glu.h>
in either Linux or Windows isn't necessary, provided
you include GLUT.
In short, you only need to do this:
#include <GL/glut.h>
Do not use a backslash in the preprocessor #include.
#include <GL\glut.h> ← No!
Visual Studio will still compile your program if you do
this, but gcc/g++ in Linux will not.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
Étape 4: : Modifier les Propriétés du
Project
Avant la compilation du projet, il faut
configure le Linker pour qu’il trouve la
bibliothèque GLUT. Deux fons pour
ouvrir la fenêtre Property Pages :
1. Utiliser l’option menu.
2. Utiliser l’explorateur localiser dans
le coin haut a droite.
OpenGL et GLUT
OpenGL et GLUT
78
Étape 4: : Modifier les Propriétés du
Project
1. Utiliser l’option menu:
Menu Visual Studio: Project →
Properties.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL et GLUT
OpenGL et GLUT
79
Étape 4: Modifier les Propriétés du
Project
2. Utiliser l’explorateur localiser dans
le coin haut a droite.
Cliquer droit sur le nom du projet et
sélectionner Properties.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL et GLUT
OpenGL et GLUT
80
Étape 4: Modifier les Propriétés du
Project
Utilisant l’une ou l’autre des deux
options, la fenêtre Property Pages
s’affiche et faire le suivant:
1. A partir Configuration: list box,
sélectionner All Configurations.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL et GLUT
OpenGL et GLUT
81
Étape 4: Modifier les Propriétés du
Project
2- dans la fenêtre Property Pages a
gauche, sélectionner l’arborescence
Linker sélectionner Input option.
Copier et coller:
opengl32.lib glu32.lib glut32.lib
Dans le coté droite Additional
Dependencies
Visual Studio peut trouver la
bibliothèque GLUT.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio
OpenGL with Visual Studio
82
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio 8
OpenGL with Visual Studio 8
83
Utiliser OpenGL & freeglut in
Visual Studio 2008
On a besois de trois:
1. Visual Studio 2008
2. OpenGL
3. freeglut
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Visual Studio 2008
Assuming you have VS2008
installed, the first step then is
to download the Windows
header files.
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio 8
OpenGL with Visual Studio 8
84
Utiliser OpenGL & freeglut in
Visual Studio 2008
On a besois de trois:
1. Visual Studio 2008
2. OpenGL
3. freeglut
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
La bibliotheque freeglut
Le site web officiel de freeglut a la derniere version code source
seuleument.
Il faut la compiler.
Put freeglut.h in: "C:\Program Files\Microsoft Visual Studio
9.0\VC\include\GL\" (note: you'll have to create the GL folder)
Put freeglut_ext.h in: "C:\Program Files\Microsoft Visual Studio
9.0\VC\include\GL\"
Put freeglut_std.h in: "C:\Program Files\Microsoft Visual Studio
9.0\VC\include\GL\"
Put freeglut.lib in: "C:\Program Files\Microsoft Visual Studio
9.0\VC\lib\"
Put freeglut.dll in: "C:\WINDOWS\system32\"
Put glut32.dll in: "C:\WINDOWS\system32\"
Put glut32.lib in: "C:\Program Files\Microsoft Visual Studio
9.0\VC\lib\"
Put glut.h in: "C:\Program Files\Microsoft Visual Studio
9.0\VC\include\GL\"
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio
OpenGL with Visual Studio
85
Note: In previous versions of Visual Studio, you
were required to install the Platform SDK. That
isn't the case anymore in VS2008 since it already
includes the SDK.
Ok, now that you've "installed" freeglut, you need
to make the C++ project aware of freeglut.
1. Create a new C++ Console project in VS.
1a. In the Create Application Wizard, select Empty
Project.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio
OpenGL with Visual Studio
86
2. Add a new cpp file to the empty
project. Add a bit of template code in
there. For example:
#include
int main ()
{
return 0;
}
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio
OpenGL with Visual Studio
87
3. If you try to compile, VS will fail to
compile. This is because it can't see the
freeglut header files.
3a. On the menu bar, go to Project ->
Properties (Alt+F7).
3b. Go to Linker -> Input and copy and
paste this line.
opengl32.lib glu32.lib glut32.lib
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio
OpenGL with Visual Studio
88
4. If you try to compile now,
errors may still show up. You'll
probably need to add directories
for your header and lib files in
Project/Solutions directories.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio
OpenGL with Visual Studio
89
5. The program should now
compile. Try a simple freeglut
application.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio 2013
OpenGL with Visual Studio 2013
90
Setting up OpenGL in Visual Studio 2013:
Telecharger,
FreeGLUT
Make sure you download FreeGLUT
2.8.1.
GLEW (GL Extension Wrangler), which
adds support for the newest OpenGL
versions eg. OpenGL version 4.5.
This means that we can access and
play with OpenGLs newest
functions.
Now open Visual Studio and create a New
Project.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio 2013
OpenGL with Visual Studio 2013
91
Create New Project:
Pick Visual C++ and select Empty Project:
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio 2013
OpenGL with Visual Studio 2013
92
Choose a good location and enter a
name for this project.
Now click OK and we are ready to
create our main.cpp file which is our
entry point for our program.
Press CTR+SHIFT+A to add a new file
and call it main.cpp
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio 2013
OpenGL with Visual Studio 2013
93
We can write down the main
function declaration and build
and run the program by pressing
F5 key:
int main(int argc, char **argv)
{
return 0;
}
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Now we are finally ready to set
up FreeGLUT and GLEW in
Visual Studio 2013. There are
two ways do to that:
From Visual Studio we set up
paths to the lib/include folders
where we extracted FreeGLUT
and GLEW
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio 2013
OpenGL with Visual Studio 2013
94
We can write down the main
function declaration and build
and run the program by pressing
F5 key:
int main(int argc, char **argv)
{
return 0;
}
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Copy those important files (.libs,
.h) from FreeGLUT and GLEW in
our project in a folder called
Dependencies or Libraries or
however you want to call it.
After that we tell Visual Studio to
reference this internal folder.
This way, when you copy your
project to another PC you will still
have these important files with the
project and you don’t have to set
them up again in Visual Studio.
Also you have much more control
over your project.
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio 2013
OpenGL with Visual Studio 2013
95
We can write down the main
function declaration and build
and run the program by pressing
F5 key:
int main(int argc, char **argv)
{
return 0;
}
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
I will go with the second
option, even if it takes a little
more work to do.
First things, we create a folder
called Dependencies.
Here we will put FreeGLUTs
and GLEW’s required files (.libs
and .h) in two subfolders called
freeglut and glew.
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio 2013
OpenGL with Visual Studio 2013
96
Lets start with GLEW because its easier.
Extract GLEW archive somewhere else.
Not in your project.
Create a new folder called glew in
Dependencies folder from your project.
Go where you extracted GLEW, there
should be an include folder with a GL
subfolder with only 3 files glew.h,
glxew.gl, wglew.h.
Copy all of them in your glew directory
from your project.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
Go again where you extracted GLEW, there
should be an lib directory with a Release
directory inside,
choose Win32 directory and copy glew32.lib
in your glew directory from your project.
Glew Directory in Dependencies
OpenGL with Visual Studio 2013
OpenGL with Visual Studio 2013
97
Now lets prepare FreeGLUT (version 2.8.1 or
later)
Extract Freeglut archive somewere else. Not
in you project.
Create a new folder called freeglut in
Dependencies folder in your project.
Unlike GLEW, we have to compile Freeglut,
because there are no dll or lib files.
Go where you extracted Freeglut archive and
there should be a VisualStudio folder.
For this version of Freeglut in VisualStudio
folder there is only 2008, 2010, 2012 versions
of Visual Studio.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
Open 2012 folder, and there should be a
freeglut.sln, open it and load all projects.
Now be sure that freeglut is your main
project in Solution Explorer.
OpenGL with Visual Studio 2013
OpenGL with Visual Studio 2013
98
Also select how you want to compile,
Win32 or x64. By default is Win32.
Press F5 and compile.
After you compile,
a lib folder was created (root archive
directory)
with a x86 folder and
a Debug folder inside.
There you can find the freeglut.lib.
Copy it to your freeglut directory in your
project.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
Go again where you extracted Freeglut
and there should be:
a include folder with
a GL subfolder inside.
OpenGL with Visual Studio 2013
OpenGL with Visual Studio 2013
99
There are four .h files:
1. freeglut.h,
2. freeglut_ext.h,
3. freeglut_std.h and
4. glut.h.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
Copy them to your freeglut folder from
your project
OpenGL with Visual Studio 2013
OpenGL with Visual Studio 2013
100
Now files are ready but they are still
not linked with Visual Studio project.
To do this open your project again
and go to properties:
1. Here we select Linker > General.
2. Find Additional Library Directories
field and write freeglut and glew
directories that we just created
above. Copy-Paste text :
Dependencies\freeglut;Dependencies\glew
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio 2013
OpenGL with Visual Studio 2013
101
Now under Linker go to
Input and the first line is
Additional Dependencies.
Here we have to provide our .lib file
names.
Notice that opengl32.lib is part of
Windows SDK.
Just add this .lib names near the existing
ones. Copy-Paste text :
opengl32.lib;freeglut.lib;glew32.lib;
Click OK
now we are ready to initialize OpenGL
and create a new project.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Environnement de Développement Intégré (IDE)
OpenGL with Visual Studio 2013
OpenGL with Visual Studio 2013
102
If you want to build for a x64
architecture, go through above
steps but make sure you copy
from x64 folders and
you build Freeglut with x64
selected.
Also your project must be
compiled using x64.
Programmation 2D/3D:
INF 1483
OpenGL & Visual Studio
Common mistakes:
Adding Dependency folder in
Solution Explorer. Its not necessary
Removing other libs from
Additional Dependencies
Invalid paths
Copying wrong libs. You will get
LNK errors.
Using FreeGLUT for x64 and GLEW
for x86 or vice versa. LNK errors
Environnement de Développement Intégré (IDE)
Code Blocks on Ubuntu 16.04/17.04
Code Blocks on Ubuntu 16.04/17.04
103
Code Blocks is a free, open-
source IDE for C, C++ and
Fortran. It can run on Linux,
Mac, Windows.
The latest version, Code Blocks
16.01, was released on
January, 2016.
Programmation 2D/3D:
INF 1483
OpenGL & Linux Ubuntu
Code Blocks features:
Supports multiple compilers
including GCC, Clang, Visual C++,
MinGW and many more
Syntax highlighting
C++ code completion, class browser,
a hex editor
A debugger with full breakpoint
support
A plug-in system to support other
programming languages.
And more
Environnement de Développement Intégré (IDE)
Code Blocks on Ubuntu 16.04/17.04
Code Blocks on Ubuntu 16.04/17.04
104
Code Blocks is a free, open-
source IDE for C, C++ and
Fortran. It can run on Linux,
Mac, Windows.
The latest version, Code Blocks
16.01, was released on
January, 2016.
Programmation 2D/3D:
INF 1483
OpenGL & Linux Ubuntu
Code Blocks features:
Supports multiple compilers
including GCC, Clang, Visual C++,
MinGW and many more
Syntax highlighting
C++ code completion, class browser,
a hex editor
A debugger with full breakpoint
support
A plug-in system to support other
programming languages.
And more
Environnement de Développement Intégré (IDE)
Code Blocks on Ubuntu 16.04/17.04
Code Blocks on Ubuntu 16.04/17.04
105
Installation:
Code Blocks is in the default
Ubuntu package repository.
: Ouvrir un terminal et ecrire la
commande
sudo apt install codeblocks
Ubuntu 17.04 contains Code
Blocks version 16.01. However,
the version is outdated in
Ubuntu 16.04.
Programmation 2D/3D:
INF 1483
OpenGL & Linux Ubuntu
Installation:
To install the latest version, you can use PPA.
Run the following 3 commands:
sudo add-apt-repository ppa:damien-
moore/codeblocks-stable
sudo apt update
sudo apt install codeblocks codeblocks-
contrib
This to add Code Blocks PPA to system,
update local package index and
install the package
Environnement de Développement Intégré (IDE)
Code Blocks on Ubuntu 16.04/17.04
Code Blocks on Ubuntu 16.04/17.04
106
Start CodeBlocks
Once installed, you can start
Code Blocks IDE from:
Unity Dash or
your preferred app launcher.
Better from terminal:
sudo codeblocks
Programmation 2D/3D:
INF 1483
OpenGL & Linux Ubuntu
Start CodeBlocks
Upon first launch of Code Blocks, you will be
prompted with a Compilers auto-detection
window:
Environnement de Développement Intégré (IDE)
Code Blocks on Ubuntu 16.04/17.04
Code Blocks on Ubuntu 16.04/17.04
107
Start CodeBlocks
Tow popular open-source C compilers
available for Linux are:
1. GNU C Compiler: open-source C
compiler
2. Clang: much faster and uses far less
memory than GCC and it provides
extremely clear and concise
diagnostics (error and warning
messages).
Programmation 2D/3D:
INF 1483
OpenGL & Linux Ubuntu
Start CodeBlocks
To install gcc, run:
sudo apt install gcc
To install the Clang compiler:
sudo apt install clang
If you want to compile native Windows
binaries on Linux, then you can install the
mingw-w* package. ( * = 32 or 64 ):
sudo apt install mingw-w64
sudo apt install mingw-w32
Environnement de Développement Intégré (IDE)
Code Blocks on Ubuntu 16.04/17.04
Code Blocks on Ubuntu 16.04/17.04
108
Start CodeBlocks
After choosing your default C
compiler,
you can start using Code Blocks to
write programs.
ubuntu code blocks setup
You can also choose your default
compiler by going to:
Settings > Compiler > Global Compiler
Settings.
Programmation 2D/3D:
INF 1483
OpenGL & Linux Ubuntu
Environnement de Développement Intégré (IDE)
OpenGL (GLUT) on Linux (Ubuntu)
OpenGL (GLUT) on Linux (Ubuntu)
109
Start CodeBlocks
Install the following packages from the
ubuntu repository:
1. freeglut3-dev
2. mesa-common-dev
from terminal:
sudo apt-get install freeglut3
freeglut3-dev mesa-common-dev
Check your /usr/include/GL folder to
verify the installation of the openGL
headers that you intend to use.
Programmation 2D/3D:
INF 1483
OpenGL & Linux Ubuntu
Compiling and Linking
You will have to use the -lglut linker option
with gcc/g++ to compile a program with glut
library.
For example, to compile the program cube.c
that uses GLUT type, use
gcc -o cube cube.c -lglut lGLU -lGL
to get the binary executable cube.
Environnement de Développement
OpenGL et GLUT
OpenGL et GLUT
Dans cette première partie,
nous allons ouvrir une fenêtre
avec GLUT.
Nous allons commencer par
configurer GLUT pour avoir
une fenêtre vide sur l'écran.
Chaque plateforme a ses
headers OpenGL à différents
endroits. GLUT, pour l'inclure,
vous devez passer par
quelques tricks multi-
plateforme (les ifdef).
Son header est généralement
dans GL/glut.h, mais le
framework GLUT livré avec
MacOS X utilise les
conventions de header Apple.
Ducoup, le header de GLUT
est dans GLUT/glut.h.
Préparation de Fenêtrage
110
En plus d'OpenGL, je
vai utiliser deux
librairies bien
pratiques:
1. GLUT (GL Utility
Toolkit), qui fournit
une interface
multiplateforme
entre le système de
fenêtrage et
OpenGL.
2. GLEW (GL
Extensions
Wrangler), qui
simplifie la gestion
des différentes
versions d'OpenGL
et ses extensions.
Environnement de Développement
Programmation 2D/3D:
INF 1483
#include <stdlib.h>
#include <GL/glew.h>
#ifdef __APPLE__
# include
<GLUT/glut.h>
#else
# include
<GL/glut.h>
#endif
int main(
int argc, char**
argv){
Il y a également un
bug dans la façon
dont les versions
récentes des headers
C standards de Visual
Studio interagissent
avec glut.h, ce qui
requière que stdlib.h
soit déclaré avant
glut.h.
OpenGL et GLUT
WebGL
GLUT fournit une
interface au système
de fenêtrage (window
system) limité mais
simple et portable.
Après avoir initialisé
GLUT en appelant la
fonction glutInit, nous
utilisons
glutInitDisplayMode
pour spécifier les
buffers dont notre
framebuffer par défaut
disposera.
Préparation de Fenêtrage
111
En plus d'OpenGL, je
vai utiliser deux
librairies bien
pratiques:
1. GLUT (GL Utility
Toolkit), qui fournit
une interface
multiplateforme
entre le système de
fenêtrage et
OpenGL.
2. GLEW (GL
Extensions
Wrangler), qui
simplifie la gestion
des différentes
versions d'OpenGL
et ses extensions.
Environnement de Développement
Programmation 2D/3D:
INF 1483
#include <stdlib.h>
#include <GL/glew.h>
#ifdef __APPLE__
# include
<GLUT/glut.h>
#else
# include
<GL/glut.h>
#endif
int main(
int argc, char**
argv){
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_
RGB | GLUT_DOUBLE);
glutInitWindowSize(400,
300);
glutCreateWindow("Hello
World");
glutDisplayFunc(&render);
glutIdleFunc(&update_fade
_factor);
OpenGL et GLUT
OpenGL et GLUT
Dans notre cas, un
buffer de couleur
(GLUT_RGB) avec double
buffering
(GLUT_DOUBLE) est
suffisant.
La technique du double
buffering permet de
stocker deux coleur
buffers dans le
framebuffer et
d'alterner à chaque
frame entre le buffer
affiché sur l'écran et
celui qui est en court de
rendu, ce qui permet
d'avoir une animation
Préparation de Fenêtrage
112
En plus d'OpenGL, je
vai utiliser deux
librairies bien
pratiques:
1. GLUT (GL Utility
Toolkit), qui fournit
une interface
multiplateforme
entre le système de
fenêtrage et
OpenGL.
2. GLEW (GL
Extensions
Wrangler), qui
simplifie la gestion
des différentes
versions d'OpenGL
et ses extensions.
Environnement de Développement
Programmation 2D/3D:
INF 1483
#include <stdlib.h>
#include <GL/glew.h>
#ifdef __APPLE__
# include
<GLUT/glut.h>
#else
# include
<GL/glut.h>
#endif
int main(
int argc, char**
argv){
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_
RGB | GLUT_DOUBLE);
glutInitWindowSize(400,
300);
glutCreateWindow("Hello
World");
glutDisplayFunc(&render);
glutIdleFunc(&update_fade
_factor);
OpenGL et GLUT
WebGL
Ensuite, nous nous
servons de
glutInitWindowSize pour
initialiser la taille de notre
fenêtre à 400x300 (la
taille de nos images) et
nous créons notre fenêtre
avec glutCreateWindow.
Pour finir, nous faisons
appel à deux fonctions qui
"reçoivent" les events
(callbacks) de la fenêtre:
glutDisplayFunc qui calcul
notre image quand la
fenêtre lui demande de
s'afficher.
glutIdleFunc qui met
continuellement à jour le
Préparation de Fenêtrage
113
En plus d'OpenGL, je
vai utiliser deux
librairies bien
pratiques:
1. GLUT (GL Utility
Toolkit), qui fournit
une interface
multiplateforme
entre le système de
fenêtrage et
OpenGL.
2. GLEW (GL
Extensions
Wrangler), qui
simplifie la gestion
des différentes
versions d'OpenGL
et ses extensions.
Environnement de Développement
Programmation 2D/3D:
INF 1483
#include <stdlib.h>
#include <GL/glew.h>
#ifdef __APPLE__
# include
<GLUT/glut.h>
#else
# include
<GL/glut.h>
#endif
int main(
int argc, char**
argv){
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_
RGB | GLUT_DOUBLE);
glutInitWindowSize(400,
300);
glutCreateWindow("Hello
World");
glutDisplayFunc(&render);
glutIdleFunc(&update_fade
_factor);
OpenGL et GLUT, GLEW
GLEW
mais avec GLEW, vous
n'avez pas à vous soucier
de ça.
Le fait d'inclure GL/glew.h
vous permet de récupérer
tout les headers OpenGL,
sans que vous ayez à aller
les récupérer vous même.
Une fois que GLUT a créé
notre fenêtre, on prépare
OpenGL pour faire des
appels.
La première appelle est
d'initialiser GLEW. Lorsque
glewInit est appelé, il
définit des appels au
fonctions OpenGL en se
basant sur la version ainsi
que les extensions
supportées par votre
Préparation de Fenêtrage
114
En plus d'OpenGL, je vai
utiliser deux librairies
bien pratiques:
1. GLUT (GL Utility
Toolkit), qui fournit une
interface
multiplateforme entre
le système de
fenêtrage et OpenGL.
2. GLEW (GL Extensions
Wrangler), qui simplifie
la gestion des
différentes versions
d'OpenGL et ses
extensions.
Environnement de Développement
Programmation 2D/3D:
INF 1483
#include <stdlib.h>
#include <GL/glew.h>
#ifdef __APPLE__
# include
<GLUT/glut.h>
#else
# include
<GL/glut.h>
#endif
int main(
int argc, char**
argv){
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_
RGB | GLUT_DOUBLE);
glutInitWindowSize(400,
300);
glutCreateWindow("Hello
World");
glutDisplayFunc(&render);
glutIdleFunc(&update_fade
_factor);
glewInit();
if (!GLEW_VERSION_2_0)
{
fprintf(stderr, "OpenGL
2.0 not available\n");
return 1;
OpenGL et GLUT, GLEW
GLEW
Nous vérifions que
GLEW_VERSION_2_0 est
définit pour être certain
que le matériel qui
exécuté le programme a
au moins OpenGL 2.0.
Une fois que la version est
vérifié, l'utilisation de
GLEW devient quasiment
invisible, et nous n'aurons
plus besoin d'interagir
avec lui.
Préparation de Fenêtrage
115
En plus d'OpenGL, je vai
utiliser deux librairies
bien pratiques:
1. GLUT (GL Utility
Toolkit), qui fournit une
interface
multiplateforme entre
le système de
fenêtrage et OpenGL.
2. GLEW (GL Extensions
Wrangler), qui simplifie
la gestion des
différentes versions
d'OpenGL et ses
extensions.
Environnement de Développement
Programmation 2D/3D:
INF 1483
#include <stdlib.h>
#include <GL/glew.h>
#ifdef __APPLE__
# include
<GLUT/glut.h>
#else
# include
<GL/glut.h>
#endif
int main(
int argc, char**
argv){
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_
RGB | GLUT_DOUBLE);
glutInitWindowSize(400,
300);
glutCreateWindow("Hello
World");
glutDisplayFunc(&render);
glutIdleFunc(&update_fade
_factor);
glewInit();
if (!GLEW_VERSION_2_0)
{
fprintf(stderr, "OpenGL
2.0 not available\n");
return 1;
OpenGL et GLUT, GLEW
OpenGL et GLUT, GLEW
GLEW initialisé, on
appelle une fonction
make_resources
definie a configurer
nos ressources
OpenGL.
Pour le moment
make_resoureces
est vide ( dummy).
On revient a cette
fonction dans les
prochains chapitres.
Préparation de Fenêtrage
116
En plus d'OpenGL, je vai
utiliser deux librairies
bien pratiques:
1. GLUT (GL Utility
Toolkit), qui fournit une
interface
multiplateforme entre
le système de
fenêtrage et OpenGL.
2. GLEW (GL Extensions
Wrangler), qui simplifie
la gestion des
différentes versions
d'OpenGL et ses
extensions.
Environnement de Développement
Programmation 2D/3D:
INF 1483
#include <stdlib.h>
#include <GL/glew.h>
#ifdef __APPLE__
# include <GLUT/glut.h>
#else
# include <GL/glut.h>
#endif
Int make_resources( ) {
return 1 ;
}
int main(
int argc, char** argv){
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_
RGB | GLUT_DOUBLE);
glutInitWindowSize(400,
300);
glutCreateWindow("Hello
glewInit();
if (!GLEW_VERSION_2_0)
{
fprintf(stderr, "OpenGL
2.0 not available\n");
return 1;
}
if (!make_resources()) {
fprintf(stderr,
"Failed to load
resources\n");
return 1;
}
glutMainLoop();
return 0;
}
OpenGL et GLUT, GLEW
OpenGL et GLUT, GLEW
Si nos ressources
sont correctement
chargé,
glutMainLoop prend
le relais.
Il affiche la fenêtre,
commence par
recevoir les events
de l'UI, et appel les
fonctions que l'on a
configuré en
réponse à ses
events (les
callbacks).
Préparation de Fenêtrage
117
En plus d'OpenGL, je vai
utiliser deux librairies
bien pratiques:
1. GLUT (GL Utility
Toolkit), qui fournit une
interface
multiplateforme entre
le système de
fenêtrage et OpenGL.
2. GLEW (GL Extensions
Wrangler), qui simplifie
la gestion des
différentes versions
d'OpenGL et ses
extensions.
Environnement de Développement
Programmation 2D/3D:
INF 1483
#include <stdlib.h>
#include <GL/glew.h>
#ifdef __APPLE__
# include <GLUT/glut.h>
#else
# include <GL/glut.h>
#endif
Int make_resources( ) {
return 1 ;
}
int main(
int argc, char** argv){
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_
RGB | GLUT_DOUBLE);
glutInitWindowSize(400,
300);
glutCreateWindow("Hello
glewInit();
if (!GLEW_VERSION_2_0)
{
fprintf(stderr, "OpenGL
2.0 not available\n");
return 1;
}
if (!make_resources()) {
fprintf(stderr,
"Failed to load
resources\n");
return 1;
}
glutMainLoop();
return 0;
}
OpenGL et GLUT, GLEW
OpenGL et GLUT, GLEW
glutMainLoop
fermera aussi le
programme pour
nous quand
l'utilisateur le
quittera.
Le return 0
supprime
simplement les
avertissements du
compilateur et il
n'est, de toute
façon, jamais
réellement atteint.
Préparation de Fenêtrage
118
En plus d'OpenGL, je vai
utiliser deux librairies
bien pratiques:
1. GLUT (GL Utility
Toolkit), qui fournit une
interface
multiplateforme entre
le système de
fenêtrage et OpenGL.
2. cOMPILEE
Environnement de Développement
Programmation 2D/3D:
INF 1483
#include <stdlib.h>
#include <GL/glew.h>
#ifdef __APPLE__
# include <GLUT/glut.h>
#else
# include <GL/glut.h>
#endif
Int make_resources( ) {
return 1 ;
}
int main(
int argc, char** argv){
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_
RGB | GLUT_DOUBLE);
glutInitWindowSize(400,
300);
glutCreateWindow("Hello
glewInit();
if (!GLEW_VERSION_2_0)
{
fprintf(stderr, "OpenGL
2.0 not available\n");
return 1;
}
if (!make_resources()) {
fprintf(stderr,
"Failed to load
resources\n");
return 1;
}
glutMainLoop();
return 0;
}
OpenGL et GLUT, GLEW
GLEW
static int
make_resources(void)
{
return 1;
}
static void
update_fade_factor(void)
{
}
static void render(void)
{
glClearColor(1.0f, 1.0f,
1.0f, 1.0f);
glClear(GL_COLOR_BUFFE
R_BIT);
glutSwapBuffers();
}
Préparation de Fenêtrage
119
En plus d'OpenGL, je vai
utiliser deux librairies bien
pratiques:
GLUT (GL Utility Toolkit), qui
fournit une interface
multiplateforme entre le
système de fenêtrage et
OpenGL.
Compiler et lancer notre
programme
Arrivé ici, nous pouvons
écrire le code des callbacks
de GLUT, de la fonction
make_resources, et faire
fonctionner notre (au
combien inutile) programme.
glClearColor set une couleur
de fond RGBA (dans notre
cas, blanche) que glClear
utilise pour remplir le buffer
Environnement de Développement
Programmation 2D/3D:
INF 1483
#include <stdlib.h>
#include <GL/glew.h>
#ifdef __APPLE__
# include <GLUT/glut.h>
#else
# include <GL/glut.h>
#endif
Int make_resources( ) {
return 1 ;
}
int main(
int argc, char** argv){
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_
RGB | GLUT_DOUBLE);
glutInitWindowSize(400,
300);
glutCreateWindow("Hello
glewInit();
if (!GLEW_VERSION_2_0)
{
fprintf(stderr, "OpenGL
2.0 not available\n");
return 1;
}
if (!make_resources()) {
fprintf(stderr,
"Failed to load
resources\n");
return 1;
}
glutMainLoop();
return 0;
}
Compiler et Executer
sur MacOS
Sur Windows avec mingw:
gcc -o hello-gl-dummy.exe
hello-gl-dummy.c \
-lopengl32 -lglut32 -
lglew32
Sur Windows avec Visual
C++:
cl /Fohello-gl-dummy.obj
/c hello-gl-dummy.c
link /out:hello-gl-
dummy.exe hello-gl-
dummy.obj \
opengl32.lib glut32.lib
glew32.lib
Préparation de Fenêtrage
120
et Executer
La commande qui compile le
programme et le link aux libs
OpenGL, GLUT et GLEW peut
varier suivant les
plateformes.
Le reposit contient également
les makefiles de chacune de
ses plateformes.
make -f Makefile.MacOSX
hello-gl-dummy # or
Makefile.Unix or
Makefile.Mingw
nmake /f Nmakefile.Windows
hello-gl-dummy.exe
Environnement de Développement
Programmation 2D/3D:
INF 1483
Sur la plupart des systèmes
Unix, elle devrait
ressembler à ça:
gcc -o hello-gl-dummy
hello-gl-dummy.c \
-I/usr/X11R6/include -
L/usr/X11R6/lib \
-lGL -lGLEW -lglut
Sur MacOS X:
# Assuming GLEW was
installed to /opt/local
gcc -o hello-gl-dummy
hello-gl-dummy.c \
-I/opt/local/include -
L/opt/local/lib \
-framework OpenGL -
framework GLUT -
lGLEW
Compiler sur Linux
sur Windows
Compiler et Executer
sur MacOS
Sur Windows avec mingw:
gcc -o hello-gl-dummy.exe
hello-gl-dummy.c \
-lopengl32 -lglut32 -
lglew32
Sur Windows avec Visual
C++:
cl /Fohello-gl-dummy.obj
/c hello-gl-dummy.c
link /out:hello-gl-
dummy.exe hello-gl-
dummy.obj \
opengl32.lib glut32.lib
glew32.lib
Préparation de Fenêtrage
121
Une fois que vous avez
compilé le programme,
vous devriez être capable
de le lancer et d'avoir une
fenetre blanche, comme
promis:
Environnement de Développement
Programmation 2D/3D:
INF 1483
Sur la plupart des systèmes
Unix, elle devrait
ressembler à ça:
gcc -o hello-gl-dummy
hello-gl-dummy.c \
-I/usr/X11R6/include -
L/usr/X11R6/lib \
-lGL -lGLEW -lglut
Sur MacOS X:
# Assuming GLEW was
installed to /opt/local
gcc -o hello-gl-dummy
hello-gl-dummy.c \
-I/opt/local/include -
L/opt/local/lib \
-framework OpenGL -
framework GLUT -
lGLEW
Compiler sur Linux
sur Windows
WebGL
WebGL
122
la portabilité d'OpenGL s'étend
sur:
les plateformes mobiles et sur les
systèmes embarqués (grâce à l'API
OpenGL ES: Embedded System) et
le web (avec WebGL).
OpenGL est indépendante du système
d'exploitation et du matériel.
En 2006, c'est le Khronos Group qui pris
la gérance des spécifications OpenGL:
Les mettant à jours pour supporter les
OpenGL et ses Extensions
Programmation 2D/3D:
INF 1483
Environnement de Développement
webGL:bibliothèque OpenGL
basée web ( web based )
Pas besoin de
compilateur ni IDE.
Besoin:
1. une connaissance
de javascript et
2. d’un navigateur
qui support
javascript.
WebGL
Créer le Contexte
nomFichier.htm
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>WebGL Demo</title>
<link rel="stylesheet"
href="./css/webgl.css"
type="text/css">
</head><body>
<canvas id="glCanvas"
width="640"
height="480"></canvas>
<script
src="./js/WebGLCanvasTest
.js"></script>
<script > webGLStart();
</script></html>
Préparation de Fenêtrage
123
WebGL permet au
contenu web d'utiliser
une API basée sur
OpenGL ES 2.0 pour
effectuer des rendus 3D
dans un <canvas> HTML
dans les navigateurs qui le
supportent, sans avoir
recours à des modules
complémentaires.
Les éléments
WebGL peuvent être
mélangés avec d'autres
éléments HTML et composés
avec d'autres parties de la
page ou du fond de la page..
Environnement de Développement
Programmation 2D/3D:
INF 1483
Pour dessiner des
graphiques sur le
l'élément
<canvas> on
utilise un objet de
contexte
Javascript, qui
crée des
graphiques à la
volée.
La fonction main()
webGLStart()
dans notre code
JavaScript est
appelée quand
notre script est
chargé. Son but
est de créer le
contexte WebGL
et de commencer
à rendre du
./js/ WebGLCanvasTest.js
var gl;
// Initialize the GL context
function initWebGL(canvas) {
gl = null;
try {
// Try to grab the standard context. If
it fails, fallback to experimental.
gl = canvas.getContext("webgl") ||
canvas.getContext("experimental-
webgl");
}catch(e) { }
// If no GL context, give up now
if (!gl) { alert(" navigateur ou machine
ne supporte pas WebGL..");
return gl;
}
// Continuer si WebGL est disponible
return gl;
}
Enbedder Contexte
WebGL
Créer le Contexte
nomFichier.htm
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>WebGL Demo</title>
<link rel="stylesheet"
href="./css/webgl.css"
type="text/css">
</head><body>
<canvas id="glCanvas"
width="640"
height="480"></canvas>
<script
src="./js/WebGLCanvasTest
.js"></script>
<script > webGLStart();
</script></html>
Préparation de Fenêtrage
124
WebGL permet au
contenu web d'utiliser
une API basée sur
OpenGL ES 2.0 pour
effectuer des rendus 3D
dans un <canvas> HTML
dans les navigateurs qui le
supportent, sans avoir
recours à des modules
complémentaires.
Les éléments
WebGL peuvent être
mélangés avec d'autres
éléments HTML et composés
avec d'autres parties de la
page ou du fond de la page..
Environnement de Développement
Programmation 2D/3D:
INF 1483
Pour dessiner des
graphiques sur le
l'élément
<canvas> on
utilise un objet de
contexte
Javascript, qui
crée des
graphiques à la
volée.
La fonction main()
webGLStart()
dans notre code
JavaScript est
appelée quand
notre script est
chargé. Son but
est de créer le
contexte WebGL
et de commencer
à rendre du
./js/ WebGLCanvasTest.js
function make_resources( ){
//initShaders();
//initBuffers();
}
function render( ){
// Définir la couleur d'effacement noir,
et opaque
gl.clearColor(0.0, 0.0, 0.0, 1.0);
// Effacer le tampon de couleur avec la
couleur d'effacement spécifiée
gl.clear(gl.COLOR_BUFFER_BIT|gl.DEPT
H_BUFFER_BIT);
// gl.enable(gl.DEPTH_TEST);
drawScene();
}
Enbedder Contexte
OpenGL et GLUT
WebGL
./js/ WebGLCanvasTest.js
function make_resources( )
{ //initShaders();
//initBuffers();
}
function render( ){
// Définir la couleur
d'effacement noir, et opaque
gl.clearColor(0.0, 0.0, 0.0,
1.0);
// Effacer le tampon de
couleur avec la couleur
d'effacement spécifiée
gl.clear(gl.COLOR_BUFFER_B
IT|gl.DEPTH_BUFFER_BIT);
// gl.enable(gl.DEPTH_TEST);
drawScene();
}
Préparation de Fenêtrage
125
#include <stdlib.h>
#include <GL/glew.h>
#ifdef __APPLE__
# include <GLUT/glut.h>
#else
# include <GL/glut.h>
#endif
static int make_resources(void ) { return 1;}
static void update_fade_factor (void){ }
static void render(void){
// Définir la couleur d'effacement noir, et
opaque
glClearColor(1.0f, 1.0f, 1.0f, 1.0f);
// Effacer le tampon de couleur avec la
couleur d'effacement spécifiée
glClear(GL_COLOR_BUFFER_BIT);
glutSwapBuffers();
}
Environnement de Développement
Programmation 2D/3D:
INF 1483
./js/ WebGLCanvasTest.js
var gl;
// Initialize the GL context
function initWebGL(canvas) {
gl = null;
try { // standard context. If it fails, fallback
to experimental.
gl = canvas.getContext( "webgl“) ||
canvas.getContext("experimental-webgl");
}catch(e) { }
// If we don't have a GL context, give up
now
if (!gl) {
alert(" navigateur ou machine ne
supporte pas WebGL..");
return gl;
}
// Continuer si WebGL est disponible
return gl;
}
OpenGL et GLUT
WebGL
if (!GLEW_VERSION_2_0) {
fprintf(stderr, "OpenGL
2.0 not available\n");
return 1;
}
if (!make_resources()) {
fprintf(stderr, "Failed to
load resources\n");
return 1;
}
glutMainLoop();
return 0;
}
Préparation de Fenêtrage
126
int main(int argc, char**
argv){
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_
RGB | GLUT_DOUBLE);
glutInitWindowSize(400,
300);
glutCreateWindow("Hello
OpenGL");
glutDisplayFunc(&render);
glutIdleFunc(&update_fade
_factor);
glewInit();
Environnement de Développement
Programmation 2D/3D:
INF 1483
./js/
WebGLCanvasTest.js
function
webGLStart() {
const canvas =
document.querySele
ctor("#glCanvas");
// var canvas =
document.getEleme
ntById('#glCanvas ');
// Initialisation du
contexte WebGL
initWebGL(canvas);
render( ) ;
make_resources( ) ;
}
nomFichier.htm
<!doctype html>
<html lang="en"><head>
<meta charset="utf-8">
<title>Hello WebGL</title>
<link rel="stylesheet"
href="./css/webgl.css"
type="text/css">
</head><body>
<canvas id="glCanvas"
width="640" height="480">
</canvas> </body>
<script src= “
./js/WebGLCanvasTest.js">
</script>
<script> webGLStart();
</script>
</html>
FIN DU CHAPITRE
Nous allons commencer par configurer
GLUT pour avoir une fenêtre vide sur
l'écran.
fonction make_resources definie a
configurer nos ressources OpenGL.
Pour le moment make_resoureces est vide
( dummy).
On revient a cette fonction dans les
prochains chapitres.
Si nos ressources sont correctement chargé,
glutMainLoop prend le relais.
Il affiche la fenêtre, commence par recevoir
les events de l'UI, et appel les fonctions que
l'on a configuré en réponse à ses events (les
callbacks).
glutMainLoop fermera aussi le programme
pour nous quand l'utilisateur le quittera.
Le return 0 supprime simplement les
avertissements du compilateur et il n'est, de
toute façon, jamais réellement atteint.
127
OpenGL et GLUT
OpenGL
4. If you're a seasoned C programmer, you should be
able to install these libraries and get them working
in your development environment without any
trouble. But before we get our hands dirty with any
code, I'm going to go over some big-picture
concepts. In this first chapter, I'm going to explain
the graphics pipeline and the dataflow of a
rendering job. In the next chapter, we'll write a
simple "hello world" program that draws the
contents of an image file to the screen, showing
how the pipeline is put into practice.
OpenGL
128
Where do I get OpenGL, GLUT, and GLEW?
====================================
1. OpenGL comes standard in some form or
another on MacOS X, Windows, and most
Linux distributions. If you want to follow these
tutorials, you'll need to ensure your OpenGL
implementation supports at least version 2.0.
MacOS X's OpenGL implementation always
supports OpenGL 2.0, at least in software if
the graphics card driver doesn't provide it. On
Windows, you're dependent on your graphics
card drivers to provide OpenGL 2 or later. You
can use RealTech's free OpenGL Extensions
Viewer to see what OpenGL version your
driver supports. nVidia and AMD's OpenGL
drivers support at least OpenGL 2.0 on all of
Programmation 2D/3D:
INF 1483
Environnement de Développement
OpenGL et GLUT, GLEW
OpenGL et GLUT, GLEW
glutMainLoop
fermera aussi le
programme pour
nous quand
l'utilisateur le
quittera.
Le return 0
supprime
simplement les
avertissements du
compilateur et il
n'est, de toute
façon, jamais
réellement atteint.
Préparation de Fenêtrage
129
Avec la satisfaction
d'avoir une fenêtre
ouverte devant nous,
nous somme prêt à
remplir OpenGL de
vertex et d'images.
Dans le prochain article,
j'introduirais les buffers
et textures OpenGL.
Environnement de Développement
Programmation 2D/3D:
INF 1483
#include <stdlib.h>
#include <GL/glew.h>
#ifdef __APPLE__
# include <GLUT/glut.h>
#else
# include <GL/glut.h>
#endif
Int make_resources( ) {
return 1 ;
}
int main(
int argc, char** argv){
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_
RGB | GLUT_DOUBLE);
glutInitWindowSize(400,
300);
glutCreateWindow("Hello
glewInit();
if (!GLEW_VERSION_2_0)
{
fprintf(stderr, "OpenGL
2.0 not available\n");
return 1;
}
if (!make_resources()) {
fprintf(stderr,
"Failed to load
resources\n");
return 1;
}
glutMainLoop();
return 0;
}