Enseignant du Cours: DJAFER BADDOU (PhD)

Courriel: djafer.baddou@uqo.ca

Programmation 2D/3D:

INF 1483

Contenu

Introduction

Mathématiques

de l’infographie

Introduction à

l’Infographie

Effets Optiques et

Etat du Rendu

Techniques

d'animation et

simulation 2D/3D

Programmation 2D/3D:

INF 1483

Introduction à

OpenGL

IDE en OpenGL

IDE: Code::Blocks

IDE: Visual Studio

Visual Studio

Code::Blocks est gratuit, source

ouvert

Introduction

Programmation 2D/3D:

INF 1483

Environnement de Développement

Environnement de Développement Intégré (IDE)

Introduction

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.

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

 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

 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

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

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

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

 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

 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

 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

 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

 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

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

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

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

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

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

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

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

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

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

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

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

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

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).

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

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é.

• L’exécution d’un programme peut être en 3 modes différents:

1- mode avec debugger, 2- mode sans le debugger ou 3- mode

release.

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.

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.

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

• 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.

 téléchargement de Visual Studio

2017.

✓ Téléchargez Visual Studio 2017

✓ Le fichier sera téléchargé et vous

devriez « Enregistrer sous... » si

nécessaire

IDE: Visual Studio

Programmation 2D/3D:

INF 1483

Environnement de Développement

Lancement Lancement

• .

C’est 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

 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

 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

#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

 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 ( ; )

#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 d’entré au programme.

#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.

#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

manipulation

d’objets.

Les langages

informatiques

modernes tendent a

créer des

programmes 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

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

Les langages

informatiques

modernes tendent a

créer des

programmes 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

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

Les langages

informatiques

modernes tendent a

créer des

programmes 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

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

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. C’est 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

manipulation

d’objets.

 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

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

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.

#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

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.

C’est 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

L’API 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

 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 développement d’une

application :

– logiciels,

– jeux,

– etc…

L’API 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 d’abstraction au dé

veloppeur.

Exercices Exercices

 Une API est un

ensemble réuti

lisable de:

 fonctions,

 structures,

 classes,

 constantes et

 autres objets,

Fonctionnalités

d’une API

L’API 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

 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 développement d’une

application :

– logiciels,

– jeux,

– etc…

L’API 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 d’abstraction au dé

veloppeur.

OpenGL et ses Extensions

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:

 conçue 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

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

 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

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

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

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?

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

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?

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

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

 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

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

DevC++

lopengl32

lglew32

Visual Studio

opengl32.lib

glew32.lib

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

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

Programmation 2D/3D:

INF 1483

Environnement de Développement

Installation

1. Télécharger GLUT:

http://www.xmission.com/~nate/glut.html

OpenGL & Code::block

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

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

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

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

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

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

9. Compile et build l'application

Programmation 2D/3D:

INF 1483

OpenGL & Code::block

Environnement de Développement

OpenGL et GLUT

File

Location

glut32.dll

Windows XP | Server 2003:

\WINDOWS\system\

Windows 2000:

\WINNT\system\

glut32.lib

\Program Files\Microsoft Visual Studio NET

2003

\Vc7\PlatformSDK\Lib

glut.h

\Program Files\Microsoft Visual Studio NET

2003

\Vc7\PlatformSDK\Include\gl

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

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

É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

É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

É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

É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 façons 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

É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

É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

É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

É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

Programmation 2D/3D:

INF 1483

OpenGL & Visual Studio

Environnement de Développement Intégré (IDE)

OpenGL with Visual Studio 8

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

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

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

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

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

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

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

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 OpenGL’s 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

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

 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

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

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

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 FreeGLUT’s

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

Let’s start with GLEW because it’s 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

Now let’s 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

 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

 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

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

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

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. It’s 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

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

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

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

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

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

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)

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

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

#else

# include

#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

#else

# include

#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

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

#else

# include

#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

#else

# include

#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

#else

# include

#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

#else

# include

#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 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

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

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

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>

<head>

<title>WebGL Demo</title>

href="./css/webgl.css"

type="text/css">

</head><body>

<canvas id="glCanvas"

width="640"

height="480"></canvas>

<script

src="./js/WebGLCanvasTest

.js"></script>

</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>

<head>

<title>WebGL Demo</title>

href="./css/webgl.css"

type="text/css">

</head><body>

<canvas id="glCanvas"

width="640"

height="480"></canvas>

<script

src="./js/WebGLCanvasTest

.js"></script>

</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>

<title>Hello WebGL</title>

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>

</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

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;

}