JHelpEngine

Il va dépendre de JHelpUitl, JHelpXML, JHelpGUI et JHelpVideo. Son git : JHelpEngine GitHub : git clone https://github.com/jhelpgg/JHelpEngine.git Il s'agit d'un moteur 3D basé sur JOGL afin de communiquer avec OpenGL.
Le moteur ici est en réalité ce qu'on appelle un "scene-graph", c'est à dire une représentation d'une scène 3D sous forme de graphe.
Avant de parler des différentes notions représentées ici, rappelons brièvement les couches et ou se situe ce moteur.
Il y a tout d’abord l'écran qui dessine une ensemble de pixels qui représentent à nos yeux une image en deux dimensions. Ensuite lui est adjoints un élément graphique, le plus souvent maintenant une carte dite 3D, mais il existe encore des chipset intégré. A part la différence de qualité de rendu et la rapidité de calcul leur rôle est le même : projeter un ensemble de point des l'espace sur l'ensemble des pixels affichés par l'écran. A savoir qu'il fut une époque ou il fallait aussi faire ce travail de projection. Bien sur les composants modernes proposent bien plus que de la simple projection, en général on leur fournit un ensemble de lumière, une description de l'aspect d'un objet et ils sont capables de calculer les réfections et l'éclairage pour nous. Comme je l'ai déjà dit fut une époque (Pas si lointaine, puisque je l'ai connue) ou il fallait faire aussi tout cela au sein du moteur. Le problème est que chaque matériel est différent à ces propres réglages, pour normaliser et simplifier le travail, une couche d'abstraction à été ajoutée. Cette couche est Direct X ou OpenGL. Direct X est dédié seulement à Windows, tandis qu'OpenGL est multi-plateforme (Y compris Windows). Si on ne fait que des applications dédiées Windows Direct X est encore à préféré car il offre plus de fonctionnalités, mais si on est orienté multi-plateforme OpenGL est tout indiqué. Ici le moteur utilisera OpenGL pour cette raison. Ensuite pour faire le pont entre OpenGL et Java, j'ai choisi d'utiliser JOGL. Il faut savoir qu'il existe aussi LWJGL et d'autres "binding". A ce niveau encore la 3D est vu comme un ensemble de polygones dans l'espace avec chacun une description de comment les dessiner.Ce moteur ajoute une couche d'abstraction supplémentaire en parlant d'objets 3D, de scènes, d'animations, ...

Les notions utilisés dans le moteur

Point 3D : (x, y ,z) dans l'espace
Normale : C'est un vecteur (x, y, z) qui représente la normale d'un objet en un point. La normale est utilisée dans les calculs de lumière et de réflexion. Elle permet de donné l'illusion d'arrondi, par exemple.
UV : Coordonnées (u, v) [u : abscisse, v : ordonnée] sur une texture. Nommée U et V pour ne pas les confondre avec des coordonnées dans l'espace. De plus elles sont en générales dans [0, 1], et représentes un pourcentage des la texture u=0 étant bord gauche, u=1 bord droit et entre les deux plus ou moins proche d'un bord. V=0 bord haut, v=1 bord bas
Vertex : est un triplet formé d'un point 3D, d'un UV et d'une normale. Cela signifie ; à la position définit par le point 3D, l'objet à la normale indiquée et on utiliser le point de la texture en UV
Polygone 3D : ensemble de vertex déterminant le contour d'un polygone dans l'espace. Les UV et normales à l'intérieur du polygones sont interpolés par la carte 3D
Attention ici chaque position du polygone doivent être dans le même plan, de plus le polygone doit être convexe. Pour les polygones concaves ou polygone qui se croisent on les découpent en un ensemble de polygones convexes.
Maille : Ensemble de polygone 3D (En général reliés entre eux). Les polygones sont aussi appelés face.
Nœud : Partie du graphe 3D, pouvant être un objet concret, ou virtuel. Il possède une position dans la scène, , une rotation, et un facteur d'échelle. Le nœud peut avoir un ou plusieurs nœuds enfants. Chaque enfant aura sa position, rotation et échelle relative au parent. Ce qui veut dire par exemple une translation du parent, va également translater les enfants. Par exemple on peut avoir un nœud bicyclette, avec comme enfant un nœud cadre et deux nœuds roue. Toute transformation faite au nœud bicyclette sera subit par les nœuds roue et cadre, ce qui permet de mouvoir la bicyclette à partir d'un seul nœud.
Objet 3D : Nœud possédant en plus une maille et un matériau
Clone : Nœud copie d'un objet 3D, mais avec son matériau propre. Il va réutiliser la maille d'un objet 3D (Ce qui entraîne que toute modification de celle-ci, entraîne une modification pour l'original et la copie), sans la stocker de nouveau en mémoire. Ce qui permet de ne pas à avoir à créer deux fois le même objets, par exemple pour les roues d'une bicyclette, on va modéliser une maille dans un objet 3D, et la seconde ne sera que le clone de la première. Ce qui permet d'économiser de la mémoire (RAM et vidéo). Bien sur il est possible d'utiliser des matériaux différents et des transformations différentes. Ce qui permet avec la même maille d'avoir une grande roue rouge et un petite roue verte par exemple
Texture : Image que l'on se sert pour décorer les polygones d'un objet ou comme réflexion
Matériau : Description du rendu à appliqué à un objet ou un clone. Il possède les différents éléments :
- Double ou simple face : précise si les polygone peuvent être vu de tous le angles (double face) ou si on ne les voit que si la normale pointe vers l'écran (simple face)
- Transparence : Transparence de l'objet
- Couleur diffuse : Couleur principale
- Texture diffuse : Texture principale, si elle est définit elle remplace la couleur diffuse
- Couleur ambiante : Couleur aux alentour, donne un petit effet halo selon la lumière
- Couleur spéculaire : couleur émise au choc d'une lumière blanche. Le rayon d'action est plus ou moins réglable
- Texture sphérique : Si elle est définit, donne l'effet que l'objet est entouré d'une sphère peinte avec la texture qui se reflète dans l'objet. Le taux de réflexion est réglable
- Texture cubique (Ou plus souvent nommée "CubeMap") : Si elle est définit, donne l'effet que l'objet est entouré d'un cube peint avec la texture qui se reflète dans l'objet. Le taux de réflexion est réglable
Pour mieux se rendre compte des effets, un seul moyen, faire des essais.
Camera : Définit la position de l'observateur ainsi que la direction de son regard. C'est à travers elle que l'on voit la scène.
Lumière : Éclaire la scène, elle peut être directionnelle (comme le soleil), ponctuelle (comme un ampoule) ou spot (comme un projecteur)
Objet 2D : Élément en deux dimensions se dessinant soit en fond d'écran, soit pardessus la 3D, servant par exemple comme décors ou élément dynamique d'interface
Scène : Contient un nœud dit "root", dans lequel seront placés (entant qu'enfant) les autres nœuds. Elle définit la caméra à utiliser.
Pour des raisons de performances, les objets ajoutés ne sont pas immédiatement visibles, il faut "flusher" la scène pour les voir. Il est conseiller d'ajouter les objets par bloc, puis "flusher", plutôt que de les "flusher" à chaque ajout d'un seul objet.
Attention les diverses opérations ne sont pas thread safe, pensez à gérer la synchronisation si vous avez plusieurs threads qui manipule la scène
Rendu de scène (Scene Renderer) : contient une scène, les lumières et les objets 2D. Il s'occupe d'envoyer régulièrement la scène à OpenGL à travers JOGL. Il possède un mécanisme d'auto-adaptation au matériel, il va changer la fréquence de rafraîchissement pour être au plus proche du meilleur FPS (Frames Per Second) que peut supporter le matériel avec la complexité de la scène. Du à l'utilisation de nombreux cache, en RAM ou mémoire vidéo, au départ le FPS est faible, mais augmente rapidement après quelques rafraîchissements.

Voilà pour les notions dont je ferais référence dans le reste de la présentation de ce moteur

Des formes de bases sont déjà crées, ce qui va nous permettre de faire rapidement un "hello word". Vous pouvez retrouver les codes sources des exemples dans le dossier sample du code.
Une scène possède un éclairage de base (Que l'on peut modifier par la suite) ce qui permet de voir quelque chose sans se préoccuper de l'éclairage pour le moment.
Chaque objet créé est affecté un matériau par défaut gris, opaque, donc pour notre premier exemple on pourra juste ajouter un objet 3D.
Pour l'exemple on va utiliser jhelp.engine.gui.JHelpFrame3D qui possède par défaut (Désactivable) un ensemble de geste et raccourcis clavier :

Mouvement de la souris en maintenant le bouton gauche enfoncé : Rotation
Mouvement de la souris en maintenant le bouton droit enfoncé : Zoom
Mouvement de la souris en maintenant les boutons droit et gauche enfoncés : Translation
Mouvement de la mollette : Zoom
Alt + Ctrl + Shift + Espace : Capture de la scéne 3D, selon la méthode embarquée dans JHelpSceneRenderer
Alt + Ctrl + Shift + R : Capture de l'écran, ne fonctionne pas toujours bien selon le systéme et/ou ce qu'il y à l'écran
Alt + Ctrl + Shift + S : Montre le FPS
Alt + Ctrl + Shift + H : Cache le FPS
Alt + Ctrl + Shift + P : Ecrit sur la console la position actuelle exacte (En coordonées et rotation) de la scéne, ceci pouvant servir ensuite plus tard pour positionner la scéne au départ, ou dans les animations par exemple

Le code du helloword : Qui donne : Scène 3D avec un cube gris

Pour que cela fonctionne, il faudra penser à récupérer le dossier jar, et le copier à coté de votre code. A savoir que si vous changer son nom, il faudra aussi changer dans le code. Si vous faites un jar contenant le moteur, le dossier jar, doit se trouver juste à coté, de plus il doit se trouver dans le chemin des librairies dans votre manifest. Le déploiement des bonnes librairies selon la plate-forme est effectuée dans ce dossier. Des logs indiquent le chemin ou va chercher le système au lancement ce fameux dossier, vérifiez si il est valide si vous n'arrivez pas à lancer l'exemple ci dessus. Log à chercher :

06/04/2013 : 08h46m39s640ms : VERBOSE : jhelp.engine.util.LibraryInstaller.install at 40 : file=/home/jhelp/jhelpapi/JHelpUtil/jar/jogl-natives-linux-amd64.jar | false

Ou quelque chose de proche, si false est indiqué comme dans l'exemple, vérifiez l’existence du dossier.

Un cube gris, c'est bien joli, mais on aimerait faire un peu plus, par exemple ajouter un texture sur notre cube. Pour cela on va modifier notre hello word en : On obtient : Scène 3D avec un cube texturé

On a créé un matériau sur lequel on a appliqué une texture diffuse. La texture diffuse est la texture principale. La couleur diffuse à une influence sur la texture diffuse, elle permet de la rendre plus ou moins claire, ou de la teinté, par exemple, si on ajoute cette ligne material.setColorDiffuse(Color4f.RED); On obtient : Scène 3D avec un cube texturé teinté en rouge

Scène 3D avec un cube texturé teinté en rouge

Essayez HelloWord3, pour voir l'effet que permet la composante sphérique, essayez avec et sans la texture diffuse. Jouez avec le spherical rate pour comprendre son influence.
Essayez HelloWord4, pour voir l'effet que permet la composante cube map, essayez avec et sans la texture diffuse. Jouez avec le cube map rate pour comprendre son influence.
Libre à vous ensuite de combiner cube map, spheric map et diffuse comme bon vous semble, les trois peuvent coexister en même temps.
Et voici un hello word un peu plus sympa : Ce qui donne : Hello word en 3D

Pour être clair, le système de coordonnées de l'espace est X, Y, Z. Le point (0, 0, 0) se trouve au centre de l'écran, au même niveau que lui. Les X (ou abscisses) sont sur l'horizontal de l'écran, le sens positif va ver la droite de l'écran. Les Y (ou ordonnées) sont dans le sens vertical, le sens positif va vers le haut de l'écran. Les Z (ou profondeur) sont l'éloignement de l'écran, le sens positif va vers l'observateur, ce qui fait que seuls les négatifs sont visibles puisque derrière l'écran.

Des géométries de bases sont déjà existantes et se trouvent dans le package jhelp.engine.geom.
Box est une boîte simple. Par défaut il s'agit d'un cube, mais en utilisant les fonctions de scales il est aisé d'en faire quelque chose de plus rectangulaire.
Equation3D est un chemin 2D "promener" sur une courbe 3D. Par exemple si le chemin est un cercle, on aura un tuyau décrivant une équation 3D (Voir le sample dédié pour un exemple). Chaque coordonnée de l'équation est en fonction de t. X(t), Y(t) et Z(t). Pendant la création de la forme, la texture peut paraître mal calée, c'est normal, les UV sont calculés une fois la forme construite.
PathGeom est est forme faite des deux chemins, l'un décrivant, les U, l'autre les V. Le chemin des V sera répéter tout au tour du chemin U. Pour mieux comprendre, essayez l'exemple dédié.
Plane est un morceau de plan. On peut ajuster le nombre de cases dans la grille, ce qui peut être utile, par exemple, pour faire une grille d'élévation.
Revolution est un chemin tourner autour de l'axe des Y. Pratique pour modéliser des objets comme des bouteilles (Voir l'exemple), des cylindre,des cônes, ....
Sphere est comme son nom l'indique une sphère.

La détection d'objets pour choisir un objet à la souris est possible. Il faut ajouter un NodeListener pour réagir aux événements souris. Les événements souris étant envoyées dans un thread à part, il est possible de faire des opérations lourdes. Juste une chose à savoir, les événements souris peuvent être nombreux en peu de temps (Cela dépend de l'utilisateur et de la scène). Dans l'exemple, le survol des objets les faits rougir, click droit dessus montre la maille, click gauche la cache. Note : On peut rendre un objet non détectable avec setCanBePick
Il est possible d'avoir la position approximative dans la texture diffuse où le click c'est effectué (Voir l'exemple de détection précis). Les coordonnées renvoyées sont entre 0 et 255. Donc pour avoir la position sur la texture. Donc (x, y) sur la texture vaut ((u*width)/255, (v*height)/255).
Pour information, les deux détections sont basées sur les couleurs. Pour la détection simple, chaque objet est dessiné avec une couleur de détection unie, on ne fait qu'alors repéré la couleur du pixels cliqué. Puis la scène est réellement dessinée. Pour la détection précise, seul l'objet concerné est dessiné cette fois avec une texture dégradée, et c'est encore la couleur qui permet de déduire la position sur la texture. L'astuce des couleurs à été choisit (par rapport à un calcul de projection) pour sa rapidité et sa précision, on a au pixel prés une détection d'objet, et une bonne approximation de la zone de la texture touchée. On ne voit aucun clignotement car ces rendus sont fait avant d'échanger le buffer de dessin et le buffer afficher à l'écran si bien que ce qui est envoyé à l'écran n'est que la scène finale.

Les objets 2D peuvent être utilisés pour des éléments d'interface ou de décors, par exemples. Ils peuvent être cacher/montrer translater ou changer de taille. Ils ont l'avantage d'être toujours là quelque soit l'orientation de la scène, le zoom appliqué, ... Ils peuvent être placées devant la scène 3D ou derrière celle-ci. Bien entendu on peut détecter la souris et réagir à celle-ci. Les positions sont relatives au coin haut-gauche de l'objet 2D. Dans l'exemple cliquez sur les deux carrés, bougez la 3D vers eux pour voir l'effet au dessus et en dessous de la 3D.

Les animations permettent de faire évoluer des objets (2D ou 3D), des matériaux, des textures, des lumières, des caméras, ... au cours du temps. Il suffit d'implémenter l'interface Animation, et la jouée dans le rendu de scène. Une animation est rafraîchie régulièrement pour connaître la situation actuelle. Ce qui est fournis est la frame absolue depuis le début du lancement de la 3D. Si on a besoin de la frame depuis le lancement de l'animation, il faut stocker la frame donnée lors du start, et la soustraire ensuite à chaque refresh à la frame donnée..
Il existe des animations dédiées à des besoins récurrents.
La notion d'animation par clef de frame. En gros on dit à telle frame (relative à l'animation) je suis dans tel état, à telle autre frame je suis dans l'autre, et si l'animation se trouve quelque part entre les deux, on décrit comment interpolé. Deux implémentations existent , une pour bouger des objets 3D dans l'espace, l'autre pour bouger des objets 2D sur l'écran. Dans l'exemple, click sur l'objet lance l'animation liée.
L'animation de texture, elle interpole une texture vers une autre. C'est à dire qu'au début on à la texture de départ et plus le temps passe, plus la texture deviens celle de destination. Plusieurs type d'interpolation sont définis, dont un permettant de choisir aléatoirement un type à chaque répétition. Le mode "Ping-pong" signifie aller-retour, on change vers une, puis on reviens à la première. Voir l'exemple dédié.
Animation faisant suivre une équation paramétrique à un nœud. Voir l'exemple sur la chaîne de nœuds qui l'utilise.
L'animation multiple est une liste d'animations jouée les une après les autres. Dés que l'une est terminée, la suivante prend le relais, etc... Voir l'exemple sur la chaîne de nœuds qui l'utilise.
La contrainte, chaîne de nœuds, permet de garder une distance entre un nœud et son suivant, ce qui fait qu'il suffit de bouger la tête et les autres nœuds suivront.Dans l'exemple de la chaîne de nœuds seule la balle bleue est animée, les autres respectent juste la contrainte. La balle bleue peut être bouger avec les flèches du clavier, ainsi que page haut, page bas pour les mouvements en Z. Ou alors appuyez sur espace pour lancer l'animation qui consiste à répéter "indéfiniment" positionner la boule bleue au point de départ, puis monter en spirale. Pour arrêter l'animation et reprendre la main sur la boule bleue, la touche Echap.

Dans Texture vous trouverez plusieurs fonctions pour modifier la texture "en temps réel" (Si le flush automatique est activé, sinon un flush manuel est nécessaire pour voir les modifications)
Un effet sympa est la texture avec relief, ou bump, vous pouvez aisément en créer une grâce aux outils 3D.

Il est possible de former un objet un translatant un de ses points, avec un facteur plus ou moins grand d’entraînement de ses voisins. Voir l'exemple de déformation pour mieux appréhender l'effet.

Tout n'est pas dit ici, il faut expérimenter. Le chargeur de fichiers obj, fonctionne pour la plupart des fichiers obj, par contre le nom des objets est celui trouver dans le ficher, c'est pour ça que souvent ils ne sont pas du tout clair. Le chargeur de MD2 est tout juste commencer. donc ne fonctionne pas. Pour le reste je vous laisse expérimenter, les exemples fournis devraient vous permettre de bien débuter. Je suis conscient que ce moteur n'est pas le meilleur au niveau des rendus possible, mais il a l'avantage de fonctionner sur toutes les plate-formes et sur tous le types de cartes 3D ou chipset. C'est pour cela que notamment le bump est pré-calculé à l'avance, car certains chipset ne supportent pas la fonction de bumpmapping de Open GL. Le mélange des textures est fait juste avec le jeu des alpha seul mélange supporté par tous, mais l'illusion est là et c'est ce qui compte. On remarquera que l'éclairage est plus Gouraud que Phong, pour ceux qui veulent une illusion de Phong, ou plus des astuces sont possibles en utilisant la réflexion, si certains sont intéressés, je recréerais un exemple. Bon courage à tous ceux qui essayeront ce moteur sans prétentions autre que d'être compatible avec le plus d'ordinateur possible.