Librairie graphique pour Air Manager

Programmation LUA, Macros FSUIPC, logiciel LINDA
et codage en LUA des gauges Air Manager

Librairie graphique pour Air Manager

Messagede JacquesZ » Mer 6 Juil 2016 07:55

Bonjour à tous.

Air Manager en natif ne propose pas de primitives graphiques permettant de dessiner par programme.
En attendant la future version OpenGL qui j'espère intègrera ces primitives, j'ai développé une petite librairie graphique sur la base d'une idée échangée sur le forum anglophone d'Air Manager.
Pour ceux qui développent leurs propres instruments ou qui améliorent les leurs, cela peut être utile.

Sont disponibles les fonctions suivantes:
Ligne, arc, cercle, polygone et étoile (utile pour les graduations des jauges), avec huit couleurs de base, mais une couleur personnalisée peut facilement être créee.

https://siminnovations.com/forums/viewtopic.php?f=15&p=1780&sid=1ab235da6d4335572fd6570c674c624f#p1780

Jacques
Ma chaîne YouTube Tutos sur l’A320 par un Pilote de Ligne: https://youtube.com/channel/UCljftuoKBcgeR-WBgYJpuoA
Avatar de l’utilisateur
JacquesZ
 
Messages: 2848
Inscription: 24/11/10

Re: Librairie graphique pour Air Manager

Messagede JacquesZ » Mer 6 Juil 2016 11:43

Sans faire du support, je peux aider les allergiques à la langue de Shakespeare avant ou après le Brexit. lolaffiche

L'installation de la librairie est simple:
1- Récupérer le fichier .zip contenant les pixels de couleur de base, téléchargeable dans le premier post du forum d'Air Manager (lien dans mon message précédent) et décompresser les 10 fichier .png dans le sous-répertoire "resources" de la jauge sur laquelle vous travaillez. Le répertoire "ressources" de la jauge en cours est accessible via l'icône "folder" d'Air Manager en mode édition (onglet Edit/Create)
2- Copier l'ensemble du code ("Select All") de la librairie, toujours dans le premier post du Topic en question, puis le coller AU DEBUT du script de votre jauge. Je rappelle que le script de l'instrument en cours de création est accessible via l'icône "Script" d'Air Manager en mode édition (onglet Edit/Create).
C'est tout.

Les fonctions suivantes sont disponibles:
Line
Arc
Polygon
Circle
Star (pour faire les graduations des instruments par exemple)

Des exemples d'utilisation sont donnés dans les posts suivants, toujours dans le même Topic, copier/coller les bouts de code et "dé-commenter"(en enlevant les doubles tirets) les portions de code désirées.

Jacques
Ma chaîne YouTube Tutos sur l’A320 par un Pilote de Ligne: https://youtube.com/channel/UCljftuoKBcgeR-WBgYJpuoA
Avatar de l’utilisateur
JacquesZ
 
Messages: 2848
Inscription: 24/11/10

Re: Librairie graphique pour Air Manager

Messagede jacquesvde » Mer 6 Juil 2016 12:13

Bonjour Jacques, grandsoleil
Très bon travail je suis spécialement intéresser car j’aime développer des gauge, aussi je suis néophyte dans la programmation.
Es que ton topique pourrais éventuellement m’aider pour des questions de positionnement des équilles par exemple l’axes et la rotation comment repérer les coordonnée sur le plans de la gauge etc.
Je te donnerais des exemples concret quand je développerais la gauge du Cluster Cessna

Image

merci affiche
Jacques cligneoeil
Avatar de l’utilisateur
jacquesvde
 
Messages: 1226
Inscription: 20/04/09
Localisation: Courcelles Belgique

Re: Librairie graphique pour Air Manager

Messagede JacquesZ » Mer 6 Juil 2016 23:11

jacquesvde a écrit:Es que ton topique pourrais éventuellement m’aider pour des questions de positionnement des équilles par exemple l’axes et la rotation comment repérer les coordonnée sur le plans de la gauge etc.

Bonjour Jacques

Je pense que pour ton cas précis du cluster Cessna, la librairie graphique ne te sera pas d'une grande utilité. Les lignes, cercles et polygones sont plutôt destinés à être dessinés à l'exécution pour le cas où on a des éléments susceptibles de varier, par exemple pour créer un indicateur de vitesse générique avec des arcs colorés de vitesse dépendants de paramètres tels que Vs, Vs0, Vne, Vno etc...
Dans ce cas, le programme Lua pourra dessiner des secteurs d'arc en fonction des vitesses spécifiées au début du code.

Autre utilisation possible, le dessin du plan de vol sur le ND par exemple, pour autant qu'on arrive à convertir des coordonnées Lat/Lon en coordonnées x/y (je suis sur le coup...).
Dernière idée, afficher la trace de l'avion dans la moving map de la console instructeur pour vérifier si le circuit d'attente correspond à quelquechose...

Pour en revenir à ton cluster, je te conseille plutôt la chose suivante:
Comme tu as des photos de qualité aux dimensions correctes, utilises-les pour créer les fond de jauge, en particulier pour le logo CESSNA qui est dans une police quasi impossible à trouver. Ces fonds de jauge, y compris les graduations sont de toutes façons fixes.
Pour la position des aiguilles, si on regarde bien la composition des jauges, on s'aperçoit que l'aiguille (l'élément graphique aiguille) décrit à chaque fois un arc de cercle de la gauche vers la droite d'une soixantaine de degrés, ce qui correspond à sa réalisation physique (l'axe de l'aiguille est dissimulé par le cache).
Je comprends ton embarras pour déterminer la position initiale de l'aiguille et la formule pour la faire tourner, car la fonction img_rotate() fait tourner un objet graphique en prenant le milieu de son "rectangle englobant" comme centre.
Le rectangle englobant est constitué par les dimensions maximales de l'objet graphique, par exemple une aiguille de 100x5 pixels incluse au milieu d'un fond de 200x200 aura pour rectangle englobant un rectangle de 200x200, et le centre de celui-ci sera aux coordonnées 100,100

La solution dans ton cas:
1- Tu crées une aiguille dans une boîte englobante deux fois plus longue que la longueur vue, par exemple une image de 100x5 pixels pour une aiguille dont la taille réelle est de 50x5. Cette aiguille sera dessinée horizontalement pour plus de facilité, l'image sera transparente, et l'aiguille occupera seulement la partie droite de l'image, à partir du milieu du rectangle de 100x5. L'image enregistrée au format PNG aura donc pour dimension 100x5 pixels
2- Tu positionnes dans ta jauge l'image de ton aiguille avec img_add(), fonction qui utilise comme origine le coin supérieur gauche du rectangle englobant.
Admettons que veuilles la positionner dans ta jauge de telle manière que l'axe de l'aiguille soit à l'emplacement x=200,y=100 (pour rappel l'origine 0,0 des jauges est toujours en haut à gauche).
L'axe de ton aiguille (le milieu de ta boîte englobante) est à +50 pixels à droite(soit 100/2) et + 2.5 pixels en bas (soit 5/2) de l'origine 0,0 de ton image de 100x5 pixels.

Donc les coordonnées à entrer dans la fonction img_add() seront:
(200-50) pour les X et (100-2.5) pour les Y. Ainsi ton aiguille sera exactement positionnée avec le départ de son axe (le milieu de la boîte englobante) à l'endroit désiré 200,100 et horizontalement.
3- Tu souhaites maintenant la faire tourner pour l'orienter sur la graduation la plus à gauche.
On dessine un cercle dont le centre est l'axe de ton aiguille et le rayon l'extrémité de chaque graduation. La graduation de gauche est située à environ 30° à gauche de la verticale, la graduation de droite est à environ 40° à droite de la verticale.
La fonction img_rotate() prend comme origine de rotation l'axe vertical et le haut du cercle. La rotation se fait dans le sens des aiguilles d'une montre en prenant comme centre de rotation le centre de la boîte englobante, ce qui veut dire qu'une rotation de 90° fera tourner l'objet graphique vers la droite, une rotation de -90° fera tourner l'objet vers la gauche.
Dans le cas de notre aiguille, celle-ci a été dessinée à l'horizontale et pointe pour l'instant vers la droite. Pour la ramener à la verticale, on la ferait tourner de -90°, pour l'amener à gauche en butée, on la fait tourner de -30° de plus, soit un total de -120°(-90-30). L'angle à entrer dans img_rotate est donc ici de -120° pour amener l'aiguille en butée à gauche (Empty).
Pour envoyer l'aiguille en butée à droite, on la ramène d'abord à la verticale par une rotation anti-horaire(-90°), puis on la décale ce coup-ci de 40° vers la droite (+40), soit un total de -50° (-90+40).
Toutes les valeurs intermédiaires seront comprises entre -120° et -50°.
La beauté de l'astuce de l'aiguille double est que tu n'as aucun calcul compliqué à faire en déplacement et rotation, l'aiguille étant déjà positionnée en son centre, une simple rotation de l'angle désiré amènera ton aiguille directement au bon endroit.

Pour terminer ton code, il te suffit de faire varier la rotation de l'aiguille en fonction des valeurs récupérées de FSX, sachant que:
une valeur de 0-->rotation de -120°
une valeur de 100%--> rotation de -50°
Tu sais que la variation d'angle disponible pour l'aiguille est donc de 70 degrés (de -120 à -50), donc ta formule de rotation sera:
img_rotate(nom de l'objet graphique, -120+(70*valeur/100))

Lorsque valeur sera 0, on a bien un angle de -120+(70*0/100)=-120°, en butée à gauche.
Lorsque valeur sera 100, on a bien un angle de -120+(70*100/100)=-50°, butée à droite.

Voilà, j'ai fait une longue explication, mais dans le but de décomposer la solution et de te laisser créer toi même le code plutôt que de te donner une formule toute faite.
En espérant avoir répondu à ton attente, je te conseille en plus de faire un dessin pour visualiser tout ça!

Jacques
Ma chaîne YouTube Tutos sur l’A320 par un Pilote de Ligne: https://youtube.com/channel/UCljftuoKBcgeR-WBgYJpuoA
Avatar de l’utilisateur
JacquesZ
 
Messages: 2848
Inscription: 24/11/10

Re: Librairie graphique pour Air Manager

Messagede jacquesvde » Jeu 7 Juil 2016 05:09

Merci Jacques, grandsoleil merci affiche

Un supère tuto que tu me fais ça va m’être utile, bon je vais faire autre chose pour ne pas te compliquer la vie inutilement, quand j’aurais le temps j’ouvrirais un nouveau topique sur la gauge du Cluster Cessna pour AM, car j’ai plusieurs projet en cour j’aviserai en temps voulu au fur et à mesure du développement de la gauge, je te demanderais ton aide si tu veux bien.

Je remercie Alain "Pegase78" pour m’avoir fait les superbes photos du cluster Cluster Cessna. merci affiche

Sur le lien si dessous tu peu voir que je me débrouille, mais je suis plus un bricoleur bidouilleur que un programmateur donc je vais faire tout ce que je peux seul et quand je pédalerais dans la semoule je crierais au secours Jacques a l’aide. ecroulerire ecroulerire ecroulerire

viewtopic.php?f=147&t=5267&start=10

Mes amitiès,
Jacques cligneoeil
Avatar de l’utilisateur
jacquesvde
 
Messages: 1226
Inscription: 20/04/09
Localisation: Courcelles Belgique

Re: Librairie graphique pour Air Manager

Messagede JacquesZ » Jeu 7 Juil 2016 10:31

Ah oui Jacques, j'avais pas vu tout ce que tu as fait déjà!. Tu as déjà réalisé les jauges dont je parlais applaublanc
En fait tu n'as absolument pas besoin de moi en fait. ecroulerire

Le contour du cluster peut être fait à mon avis avec une combinaison de Skinman pour les cadres et une image photoshop pour le logo à la police impossible...Pour le code, tu sais faire!

Ce mini tuto improvisé pourra servir à d'autres , pas grave. lunettesnoires

Jacques
Ma chaîne YouTube Tutos sur l’A320 par un Pilote de Ligne: https://youtube.com/channel/UCljftuoKBcgeR-WBgYJpuoA
Avatar de l’utilisateur
JacquesZ
 
Messages: 2848
Inscription: 24/11/10

Re: Librairie graphique pour Air Manager

Messagede JacquesZ » Jeu 7 Juil 2016 11:32

Et hop...
Image

Le fichier SkinMan joint.

Jacques
Fichiers joints
cluster cessna.zip
(371.9 Kio) Téléchargé 465 fois
Ma chaîne YouTube Tutos sur l’A320 par un Pilote de Ligne: https://youtube.com/channel/UCljftuoKBcgeR-WBgYJpuoA
Avatar de l’utilisateur
JacquesZ
 
Messages: 2848
Inscription: 24/11/10

Re: Librairie graphique pour Air Manager

Messagede jacquesvde » Jeu 7 Juil 2016 13:06

merci affiche Epoustouflant tu dessines plus vite que ton ombre ecroulerire
Avatar de l’utilisateur
jacquesvde
 
Messages: 1226
Inscription: 20/04/09
Localisation: Courcelles Belgique

Re: Librairie graphique pour Air Manager

Messagede JacquesZ » Jeu 7 Juil 2016 13:59

C'est un peu mon "ancien" métier (architecte) lunettesnoires
Pour paraphraser un auteur célèbre :
"Avant j'étais moche....Mais depuis que j'ai que j'ai découvert SkinMan, ma vie a changé." chouettedoights
Et franchement une fois qu'on a compris les subtilités de Skinman et les opérations booléennes çà va assez vite.

Jacques
Ma chaîne YouTube Tutos sur l’A320 par un Pilote de Ligne: https://youtube.com/channel/UCljftuoKBcgeR-WBgYJpuoA
Avatar de l’utilisateur
JacquesZ
 
Messages: 2848
Inscription: 24/11/10

Re: Librairie graphique pour Air Manager

Messagede jacquesvde » Ven 8 Juil 2016 00:16

JacquesZ a écrit:Ah oui Jacques, j'avais pas vu tout ce que tu as fait déjà!. Tu as déjà réalisé les jauges dont je parlais applaublanc
En fait tu n'as absolument pas besoin de moi en fait. ecroulerire

Le contour du cluster peut être fait à mon avis avec une combinaison de Skinman pour les cadres et une image photoshop pour le logo à la police impossible...Pour le code, tu sais faire!

Ce mini tuto improvisé pourra servir à d'autres , pas grave. lunettesnoires

Jacques


Bonjour Jacques, grandsoleil merci affiche
Mais si j’avais besoin de toi ton conseil va m’aidé car je ne savais pas pour les coordonnées des aiguilles, je me suis arracher les cheveux pour trouver la solution à tâtons, murrouge en fait j’ai recopié un code existent que j’ai modifié pour l’adapter à mes gauge sans savoir le pourquoi du comment. gratgrat
Jacques cligneoeil
Dernière édition par jacquesvde le Sam 16 Juil 2016 17:37, édité 1 fois.
Avatar de l’utilisateur
jacquesvde
 
Messages: 1226
Inscription: 20/04/09
Localisation: Courcelles Belgique

Suivante

Retourner vers LUA, Linda, Macros & gauges Air Manager





Qui est en ligne

Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 2 invités

cron