En ce qui concerne ta dernière question, la réponse est simple : À peu près n'importe quelle application android (je ne parlerai pas d'ios parce que j'ai jamais développé sur ios)... Il y a des outils dans android studio pour simplifier la réalisation d'interface pour différente résolution...
L'être humain, contrairement aux geeks qui ne sont de toute façon pas des êtres humains, est un animal social taillé pour vivre en "meute".
Avec Qt tu n'as pratiquement rien à faire pour avoir une version mobile, tu fais juste une version de quelques widgets pour android, le main widget surtout, les autres ne devraient pas trop changer.
Par contre le ndk ne supporte pas du full C++, si tu veux que ton code compile sans changer une ligne, tu peux utiliser crystax.
@charlesfire: Je me demandais surtout, au vu de votre expérience en matière d'utilisation d'application mobile/tablette, s'il est assez courant de voire des applications dont l'interface varie d'un périphérique à un autre.
Typiquement, ici, heftyAD est destiné principalement à être une application Desktop. Mais vu que Qt me permet d'avoir une version pour mobile sans trop me casser la tête, je voudrais savoir s'il est nécessaire qu'une adaptation du contenu de l'application soit effectuée. Par "adaptation", ici, je veux signifier "afficher seulement les éléments pertinents pour les petites résolutions". Car, ici, je le rappelle, dans l'état actuel des choses, créer un algorithme depuis un téléphone portable ne sera pas forcément aisé. Du coup j'essayais d'anticiper et me demandais si ça pouvait être intéressant d'avoir un interface optimisée pour les petites résolutions, interface qui pourra contenir des éléments supplémentaires lorsque visualisée sur un PC par exemple...
@ads00: La version native de Qt, sauf abus de ma part, ne permet pas d'avoir une version Mobile/Tablet de son application. Et donc dans ce cas il est nécessaire d'utiliser un outil externe pour porter son application C++ vers Android par exemple.
Mais depuis Qt5.6, Qt intègre un nouveau langage (le QML) qui permet non seulement de faire fonctionner son application sous les principaux OS mais aussi de la faire fonctionner sous les plateformes IOS & Android. Principalement je m'attaquerais d'abord à Android car j'ai Un Xperia (comme téléphone) et donc réaliserais principalement les tests pour cette plateforme.
Parce que avoir une interface comme ceci sur téléphone n'est pas forcément bien de mon point de vue.
Mais peut-être devrais-je d'abord commencé par réfléchir à une interface qui se rapproche plus de celles couramment utilisées dans les applications Mobile/Tablet.
La version native de Qt, sauf abus de ma part, ne permet pas d'avoir une version Mobile/Tablet de son application. Et donc dans ce cas il est nécessaire d'utiliser un outil externe pour porter son application C++ vers Android par exemple.
Donc, en pratique, sauf utilisation de fonctionnalites specifique a une plateforme, ton code devrait etre directement compilable sur Android. (Tu peux t'amuser a faire le test si tu veux)
misterFad a écrit:
Parce que avoir une interface comme ceci sur téléphone n'est pas forcément bien de mon point de vue.
Par contre, ca, oui. Tu te doutes bien qu'un main window classique est peu utilisable sur un mobile.
Tu as mal de choses a prendre en compte sur mobile (quelque soit le langage, c'est un probleme materiel), en particulier :
la densite de pixel (ou taille physique de l'ecran) : pour avoir des elements et du texte qui sont a une taille utilisable selon le device. Un bouton qui fait 10 mm d'epaisseur, c'est difficile a cliquer
la resolution (cf https://design.google.com/devices/) tu ne peux pas afficher la meme chose sur un ecran qui fait 200x200 et un ecran qui fait 2000x2000. Ta fenetre principale, si tu la divise en 2 comme tu le fais sur un mobile en 200x200, ca va etre complique. Sur un tablette, ca passera.
l'orientation : portait ou paysage
Tu peux faire une UI sur mobile en QML ou avec des widgets. Mais comme il y a pas mal de choses a faire sur l'UI pour que ce soit adaptatif, il est plus efficace de le faire en QML.
@ads00, @gbdivers: Vous faites bien de le préciser. J'ignorais en fait qu'une application Qt fonctionne de base sous Android (et même IOS apparemment).
Sinon j'ai été lire ce qu'il faut faire pour porter heftyAD vers les plateformes mobiles. A peine avais-je commencé à lire que j'étais déjà fatigué. En plus, j'ai lu quelque part que les fonctionnalités de la STL ne sont pas utilisables directement. Il faut passer par une sorte de wrapper et tout. Et pourtant certaines parties du code source sont écrites uniquement en C++/STL, afin de pouvoir les réutiliser telles quelles dans n'importe quel projet C++ (moyennant une réécriture assez facile pour les autres langages).
@gbdivers: Je te remercie pour les informations. Je me doutais bien aussi que le design de l'interface ne sera pas le même selon que la plateforme d'exécution soit un mobile, une tablette, ou un PC.
Finalement le portage va être beaucoup plus long que je ne le pensais. Mais c'est sans doute aussi parce que je ne l'avais prévu depuis le début.
En plus, j'ai lu quelque part que les fonctionnalités de la STL ne sont pas utilisables directement. Il faut passer par une sorte de wrapper et tout. Et pourtant certaines parties du code source sont écrites uniquement en C++/STL, afin de pouvoir les réutiliser telles quelles dans n'importe quel projet C++ (moyennant une réécriture assez facile pour les autres langages).
Serieux, change de sources, cela fait plusieurs fois que tu lis des choses completement fausse. Ou arrete de lire (sauf ce que j'ecris, bien sur )
misterFad a écrit:
Finalement le portage va être beaucoup plus long que je ne le pensais. Mais c'est sans doute aussi parce que je ne l'avais prévu depuis le début.
En fait, un programme bien concu va separer les differentes logiques en module (reseau, UI, BdD, etc). Du coup, le probleme n'est pas forcement que tu n'as pas prevu de faire du QML des le debut (il est normal de ne pas pouvoir prevoir TOUTES les evolutions possibles de son programme), mais que tu n'as tout simplement pas concu ton programme pour etre evolutif.
Mais ce n'est pas grave, c'est en faisant des erreurs que l'on apprend.
Tu n'as pas une ligne de code à changer pour avoir ton soft sur android, installe juste crystax : https://www.crystax.net/
Le mieux est de compiler Qt avec pour ne pas avoir de problème de compatibilité avec le ndk de google.
Je ne comprends pas trop l'idee. Si je comprends bien, crystax remplace le NDK. Du coup, crystax ne regelera pas les problemes d'UI dont j'ai parle avant. Et s'il a pas de probleme de build avec le NDK, crystax ne sert a resoudre aucun probleme. Sauf se taper la recompilation de Qt.
Serieux, change de sources, cela fait plusieurs fois que tu lis des choses completement fausse. Ou arrete de lire (sauf ce que j'ecris, bien sur )
Mort de rire. Si si, j'ai lu quelque part qu'il faut utiliser des librairies pour pouvoir utiliser STL. J'essayes de retrouver le lien en question mais en vain. Bon après il n'est pas impossible que ce soit moi qui fume -> mon cerveau doit être en surchauffe . Je n'ai en effet pas arrêté de réfléchir en stage durant toute la journée.
gbdivers a écrit:
En fait, un programme bien concu va separer les differentes logiques en module (reseau, UI, BdD, etc). Du coup, le probleme n'est pas forcement que tu n'as pas prevu de faire du QML des le debut (il est normal de ne pas pouvoir prevoir TOUTES les evolutions possibles de son programme), mais que tu n'as tout simplement pas concu ton programme pour etre evolutif.
et le code est en CONSTANTE EVOLUTION (je viens même juste de faire encore un bon refactor).
gbdivers a écrit:
Mais ce n'est pas grave, c'est en faisant des erreurs que l'on apprend.
Entièrement d'accord : j'ai encore pas mal de choses à apprendre. Et une chose est sûre, ce projet m'a permis de connaître davantage le C++ (et Qt avec).
@ads00 : Merci pour les précisions. Mais par contre s'il faut recompiler Qt... comment dire ... C'est mort direct.
La création de tableaux au sein de l'application est beaucoup plus intuitive mais pas encore aussi bien que je le souhaite. En effet il y a plein de choses que j'ignore encore dans Qt : j'apprends donc au fur et à mesure.
Les six boutons de la barre d'outils (à droite) permettent (à l'utilisateur de) :
1- une fois coché, on pourra rajouter des items dans le tableau en cliquant dans le rectangle qui le définit.
2- une fois coché, on pourra éditer la valeur de chacun des éléments du tableau (la valeur par défaut étant "?").
3- en cliquant dessus, tous les éléments sélectionnés sont retirés du tableau.
4- une fois cochée, l'index de chacun des éléments dans le tableau est affiché comme ci-dessous. En effet, on peut déplacer les items comme on veut.
5- en cliquant dessus, le rectangle représentant le tableau est allongé. J'avais voulu rendre celui-ci redimensionnable comme c'est le cas dans la plus part des outils de dessin. Mais finalement j'ai opté pour cette solution simpliste car je n'y arrivais pas.
6- en cliquant sur celui-ci, les items sont affichés par ordre d'indice croissant (comme dans un tableau) et la longueur du rectangle est ramenée a sa valeur minimale (affichage semblable à celui de la première capture d'écran sauf qu'ensuite j'ai demandé à rallonger le ractangle).
Les algorithmes
Il y a du nouveau : les modèles associés aux algorithmes ne sont plus des widgets. Et n'importe qui peut toujours créer son algorithme : l'application pourra en contrôler le flux d'exécution (pour l'instant tout SAUF avancer & reculer. De plus, si par mégarde quelqu'un essayant d'expliquer un algorithme via l'application ne fait pas suffisamment attention et que des exceptions "lancées" ne sont jamais "attrapées", heftyAD ne plantera pas. Qui a parlé robustesse de heftyAD ?
Une exception C++ standard std::exception (pour ceux qui connaissent) a été attrapée
Une exception C++ due à un "throw 10;" par exemple a été attrapée
Les animations
C'est sans doute la partie la plus intéressante de la chose. Bonne nouvelle : les animations fonctionnent lorsqu'elles sont utilisées depuis le GUI thread, celui qui fait que les différents composants graphiques de l'application communiquent entre eux, ... On peut ainsi bouger un élément d'une position A vers une position B via une animation. Mauvaise nouvelle : les animations ne fonctionnent pas lorsque utilisées depuis les processus qui exécutent les algorithmes. Il n'y a pas de messages d'erreurs, rien, ... C'est juste qu'il n'y a rien qui s'anime à l'écran. Et ça fait 3h que j'essaye de corriger ça mais en vain.
What else ?
Ba je vais essayer de régler le problème concernant les animations, en espérant y arriver. La prochaine étape sera d'intégrer un éditeur graphique permettant de créer des algorithmes. Oui oui j'ai bien dis éditeur graphique pas éditeur de code (même si à certains endroits, il sera nécessaire d'écrire du code, du moins pour un début).
Ensuite, je pense que je pourrais m'orienter vers une première phase de test (pouvoir exécuter l'application chez soi sans passer par le git), avec vidéo à l'appui si j'ai suffisamment de nouveauté depuis la v1.3 (celle que j'ai développée pendant les vacances estivales 2015). Mais bien sûr, ce sera seulement après que le bug des animations aura été fixé. Et je n'ai absolument aucune idée d'où peut venir le problème pour l'instant.
Sur ce, je vais voir un autre épisode de "Owari no Seraph" (pour ceux qui connaissent) et ensuite me coucher. Bonne soirée à tous.
heftyAD avance. La description des algorithmes ne se fera plus en C++ mais dans un langage dédié à la description d'algorithmes. Ce langage que je nomme Light se veut simple et se présente comme un dénominateur commun de la plupart des langages de programmation existants. L (Light) présente en effet uniquement les fonctionnalités nécessaires pour faire de l'algorithmie.
Voici un exemple de code Light que je peux déjà parser. Je vous en dirais plus dans les jours à venir.
/**
* Définition d'un algorithme
*/
algorithm Algorithm42
{
information {
languages {
"fr", "en" // liste des langues supportées.
}
name {
"Algorithme 42",
"Algorithm 42"
}
description {
"L'algorithme 42 est un algorithme de ... qui n'existe pas.",
"Algorithm 42 refers to ... and doesn't exist."
}
authors {
"misterFad" {
"Elève ingénieur à INSA Rennes",
"Engineer student at INSA Rennes"
}
#, "Author 2" {}
}
}
# En cours de réflexion sur cette partie
model {
}
# En cours de réflexion sur cette partie
code {
/*
// juste un exemple rapide
auto p = 0;
for(int i=0; i<5; i++) {
}
*/
}
}
Pour information, le compilateur de L est écrit en C/C++ et utilise les outils flex et Yacc.
Si éventuellement vous avez des remarques sur l'exemple que je montre, surtout n'hésitez pas. Sur ce, bonne soirée à tous et à toutes.
J'avance bien sur le compilateur de L. Pour information, L n'est pas vraiment un langage de programmation : c'est juste un langage de description. Lorsqu'on écrit du code L, on a l'impression que l'on programme mais à vrai dire le code écrit ne peut rien faire tout seul.
Une fois un code L compilé, le compilateur générera un fichier (XML ou JSon par exemple) dont le contenu décrira la structure de l'algorithme dont le code source est compilé. C'est ce fichier généré qui sera ensuite utilisé dans heftyAD pour générer des instructions C++ qui vous permettront de réellement contrôler le flux d'exécution des algorithmes.
Avancées générales sur L
Depuis mon dernier message, je n'ai plus effectué d'analyse sémantique au sein de L. Je me concentre essentiellement sur la syntaxe du langage. Voici un autre exemple de code que l'on peut déjà écrire :
/**
* An example of Light source code.
*/
# Import Types
# ============
# optional:
# Only user-defined types can be imported (built-in types are always available).
# Any multiple import of a given type leads to semantic error.
# '*' can be used to import all types.
import UserDefinedType from "dir/filePath";
import * from "dir/filePath";
On peut aussi définir des types, même si dans le cadre de l'utilisation de heftyAD, aucun type défini par l'utilisateur ne sera utilisé. Tout ce dont on aura besoin aura déjà été fourni par le langage.
# Define Types
# ============
# optional:
# Any multiple definition of a given type leads to semantic error.
abstract type MyType1 {}
abstract types {
MyType2<int> {}
MyType3<auto> { // generic templated class
// $1 will refer to the 1st template type
// $2 will refer to the 2nd template type
// ...
}
MyType4 {
# Operations
void operation1();
void operation2(void); // same as void operation2();
void operation3(int, int b); // the 1st parameter is unamed
void operation3(int); // method overloading
MyType2<int> operation4(MyType4 param);
void operation5(MyType1 param);
int getValue(void);
void setValue(int value);
# Shortcuts
# Shortcuts + - * / % etc. will be available.
# They can be bound to any operation
# For example, array[1, 2] may return the list of elements in the given range.
// [] const : int getValue(void);
// [] : setValue(int value);
}
// ...
}
abstract type MyType4 : MyType3<String> {}
abstract type MyType5<auto, auto> : MyType3<auto> {}
Vous ne savez pas programmer ?
Donc voili voilou pour ceux qui s'y connaissent déjà en programmation. Pour les autres, n'ayez crainte, ceux qui savent programmer écriront des algorithmes et vous vous aurez juste à récupérer ces algorithmes puis les exécuter pour mieux en comprendre le fonctionnement.
heftyAd avance. Plus précisément, dans l'état actuel des choses, l'application permet déjà à n'importe qui de créer son algorithme et de l'exécuter via une simulation. Mais le fait est que pour créer un algorithme, il faudra
d'une part en écrire le code source en C++ et utiliser des outils externes (compilateur, éditeur de code, ...)
et d'autre part utiliser aussi quelques fonctionnalités relatives à Qt.
De même, le contrôle du flux de l'exécution des algorithmes n'est pas facilité par le précédent procédé. Afin donc de simplifier tout cela, j'ai commencé à développer Light, un langage qui se veut simple et dédié à la description d'algorithmes.
Light
Light (ou L) tout seul ne sert à rien. En effet, une fois du code L compilé, le compilateur génère une représentation actuellement XML (mais cela aurait peut être du JSon, du Java, du Python, etc) du code analysé. Ainsi, alors qu'en C++ (par exemple) on ne peut changer la sémantique associée à une instruction,
afficher(var);
// cette instruction a pour sémantique celle définie par C++ (code assembleur pour C++)
// idem pour Java, Ruby, ...
les instructions Light n'ont quant à elles pas de sémantiques associées. C'est lors de l'analyse du XML généré que l'on définira ensuite quelles sémantiques l'on veut associer aux instructions. Une même instruction Light peut donc avoir différentes sémantiques associées. Vous comprendrez mieux quand j'aurais quelques chose de concret à montrer. En attendant, L permet déjà de définir des types ainsi que quelques instructions. En voici un extrait (concernant les types) :
Light (Exemple)
# type Test
type Test {
int operation(auto param); // a generic operation
}
# namespace test
namespace test
{
type List<auto>
{
# Ctor declaration will be available soon.
# I just realize that it isn't provided yet.
// List(void);
// List(List<$1> list);
# Several operations
int size(void);
bool isEmpty(void);
bool contains($1 value); // $1 refers to the first template parameter
$1 at(int index);
void swap(int i, int j);
bool removeAt(int index);
bool removeFirst($1 value);
bool removeLast($1 value);
void clear(void);
# Operator declaration will be available later (very very later).
// ...
}
type StringList : test::List<String> {
// ...
}
}
Saviez-vous ?
J'espérais vraiment avoir tout terminé pour cette rentrée mais hélas, la mise en place de L est plus longue que prévue (surtout que pendant plusieurs semaines je n'ai rien fait, faute de disponibilité).
Néanmoins, je voudrais savoir :
Connaissez-vous des outils qui permettraient de réaliser un testeur de code en ligne (un peu comme celui disponible pour le langage Rust ici : https://www.rust-lang.org/en-US/) ?
De préférence, si de tels outils sont déjà développés et que l'on peut les intégrer directement à son site, ce serait génial. Bien sûr, ce n'est pas ma priorité pour l'instant mais je voudrais quand même me renseigner : ce sera très utile pour L et surtout vous pourriez tester facilement aussi, en attendant que tout soit intégré à heftyAD.
J'ai de très bonnes nouvelles à vous annoncer (oui oui j'ai gagné des millions -> dans mes rêves bien sûr).
Tout d'abord
Je voulais vous informer que j'ai suspendu le développement de Light (ou L). Pourquoi ? Malgré que j'avançais plutôt bien, mettre en place un langage qui permettrait d'écrire un algorithme même minimal nécessiterait encore plusieurs mois de travail. Mais moi, je veux des résultats : je n'ai pas envie de rester sur le projet pendant mille ans. D'ailleurs, vous comprendrez dans la suite assez rapidement pourquoi j'ai fait ce choix.
Les animations
Elles fonctionnent maintenant. Par exemple, si on suppose qu'un algorithme écrit par l'utilisateur s'applique à un modèle qui est un tableau, celui-ci peut réaliser des actions comme suit :
// Je suppose dans la suite que array désigne
// le modèle (ici un tableau) avec lequel l'auteur de l'algorithme travaille.
/*
* Permuter les valeurs des éléments aux indices i et j.
* Donc pas d'animation ici.
*/
array.swapValues(i, j);
/*
* Permuter la position des éléments aux indices i et j.
* Une animation a donc lieu et montre le changement de position des deux items.
*/
array.swap(i, j);
Les animations sont cependant à améliorer : elles sont seulement rectilignes pour l'instant. Et surtout, lorsqu'on accélère l'exécution d'un algorithme, les éventuelles animations en cours ne sont plus bien synchronisées dans la suite de l'exécution de celui-ci. Pour information, la représentation graphique d'un tableau est semblable à ceci.
Les graphes
Alors là, très très très bonne nouvelle : j'ai réussi à intégrer les courbes de Bézier. Avant de passer aux captures d'écran, voici ce à quoi ressemblait les graphes. Maintenant on a droit à ce qui suit (et le résultat est nettement mieux).
En bougeant l'un des quatre points, la courbe verte change de forme. Chacun de ces points correspond à un point de contrôle de la courbe verte qu'on appelle une courbe de Bézier. Ne faites pas attention aux deux sommets en bas.
La courbe bleue est une aussi une courbe de Bézier. Par contre l'approche est ici différente. De fait, plutôt que de déplacer les points de contrôle pour dessiner la courbe, vous indiquez plutôt les points par lesquels vous souhaitez que la courbe passe. Je calcule ensuite les points de contrôle adéquats (que vous ne voyez pas) puis dessine la courbe associée.
Note : Pour calculer les points de contrôle, on a besoin de deux autres paramètres u et v (compris entre 0 et 1) dont je n'expliquerais pas ici la sémantique (pour ne pas perdre les non matheux). Mais la configuration à partir de laquelle la courbe bleue a été calculée est : u=0,33 et v=0.67.
Pour rappel, l'application ne propose pour l'instant pas encore des options de customisation mais on peut customiser tous les items qui s'affichent à l'écran (et ce, pour n'importe quel type de modèle). Voici ce que ça donne sur un exemple de graphe.
What else ?
Et bien ma prochaine tâche sera d'intégrer les courbes de Bézier directement au module de dessin de graphe. Ce que je vous montre là n'est rien d'autre que le résultat de mes tests. Ensuite :
améliorer les animations
voir si l'intégration de Qt Script n'est pas trop galère. En effet, plutôt que d'écrire les algorithmes en C++, Qt Script permettrait de les écrire en JavaScript. Ainsi, on pourra tout faire depuis l'application, plutôt que de devoir compiler du code C++, générer un plugin puis ensuite le charger dans l'application. Personnellement, je préfère la seconde option mais a priori très peu de gens préféreraient cette solution.
réaliser des vidéos de présentation sur la chaîne YouTube.
Sur ce, merci de m'avoir lu et bonne fin de week-end à tous.
HS : Qt Script est deprecie et sera vire de Qt dans le futur. Utilises plutot QtQML (le classe QJS*, c'est aussi un JavaScript engine)
Classes for making Qt applications scriptable. Deprecated in favor of the QJS* classes in the Qt QML module.
Oui oui je suis au courant, merci. Dans ma tête quand j'écrivais, je pensais au JS API, même si dans l'état actuel des choses, il n'est pas aussi bien "garni" que son prédécesseur Qt Script.
« Ils demandèrent que les graphes soient et les graphes furent. » Allez je vous balance encore quelques captures d'écrans.
Captures d'écran
Comme vous pouvez le voir, on peut vraiment dessiner tout ce qu'on veut. Pour information, le procédé de dessin de graphe sera exactement le même pour les automates, surtout que maintenant on peut dessiner des boucles (une boucle est une "ligne" entre un point et lui-même).
De plus, parmi les deux méthodes que je mentionnais dans la partie "Les graphes" de ce post, j'ai finalement choisi la seconde : les lignes du graphe passent donc par les petits rectangles blancs (et ne sont correspondent ainsi pas aux points de contrôle des courbes de Bézier qui s'affichent).
Aussi, on peut voir que l'arc partant de C n'aboutit nulle part. Cela est tout à fait normal puisque vous pouvez déplacer les points blancs afin de dessiner les arcs comme vous le souhaitez. Toutefois, en double-cliquant sur un nœud blanc, celui-ci est automatiquement rattaché au sommet avec lequel il est en lien. Voici ce que cela donne (en désactivant en plus l'affichage des petits nœuds blancs).
Sympa, non ? Je sais qu'avec une vidéo vous apprécierez mieux mais ça ne saurait tarder. Notez aussi qu'en déplaçant un sommet du graphe, tout noeud blanc rattaché à celui-ci est automatiquement déplacé aussi.
Prochaines étapes
Il y a quelques autres étapes intermédiaires (comme le refactoring de code) mais je mets juste les grandes lignes. Aussi, l'ordre ci-après représenté ne correspondra pas forcément à l'ordre d'implémentation.
Permettre de customiser les différents éléments qui s'affichent (brosse, couleur, fonte, police, ...). Toutefois, actuellement, on peut déjà écrire un algorithme qui met les couleurs que l'on veut aux éléments d'un modèle.
Améliorer les animations.
Intégrer un moteur de script JavaScript (pour expliquer les algorithmes en écrivant du code JavaScript).
Intégrer le modèle Automaton (en plus de Graph et Array).
S'assurer de la bonne communication entre modèle et vue. Par exemple, arrayModel.setVisible(true) doit bien afficher la vue associée, alors que arrayView.setVisible(false) (par exemple) doit non seulement cacher la vue mais en plus arrayModel.isVisible() doit aussi retourner false.
Réaliser les vidéos de présentation YouTube.
Améliorer plus tard le mécanisme de dessin de graphe (j'ai plein d'idée mais mes compétences sont parfois limitées).
...
Enfin, l'application intègre déjà la fonctionnalité du Undo/Redo (Annuler/Refaire) pour toutes les actions de déplacement à la souris. En plus, pour les tableaux, le Undo/Redo fonctionne pour les actions d'ajout et de suppression d'items.
J'ai bien avancé. La création des tableaux au sein de l'application est complètement opérationnelle, même si sans doute encore imparfaite.
Comme vous pouvez le voir sur la capture d'écran, heftyAD propose maintenant deux types de géométrie pour les items :
les rectangles qui peuvent avoir des bords arrondis
ainsi que les cercles.
Les items d'un même modèle peuvent avoir des formes variées (comme le montre d'ailleurs la figure). A noter que les carrés sont perçus au sein de l'application comme des rectangles particuliers. Aussi, les arcs dans les graphes représentent une catégorie de forme à part.
Je me pencherais ensuite sur l'amélioration des animations ainsi que l'intégration d'un langage de script pour simplifier l'écriture des algorithmes. Une fois que tout ceci sera opérationnel pour les tableaux, je continuerais ensuite mes travaux sur les graphes (même si, au passage, j'ai déjà beaucoup avancé depuis mon dernier post).
Je vous ferais une vidéo-gif dans la semaine pour vous montrer ce que ça donne. En gros, on peut exécuter les animations en synchrone ou en asynchrone. Dans le premier cas, le plus important pour nous sans doute, l'algorithme ne continuera pas son exécution tant que l'animation démarrée n'a pas fini son exécution. Cela va donc s'en dire que lorsqu'une animation est en cours et que l'on essaye d'arrêter l'exécution de l'algorithme à partir duquel celle-ci a été démarrée, l'arrêt ne sera effectif que lorsque ladite animation aura fini son exécution.
La prochaine étape sera donc l'intégration d'un moteur de script. Une fois cette étape passée, alors je serais proche d'une première version testable. Sur ce, bonne soirée à tous. Et je termine sur un zoli graphe dessiné avec l'application.
Là j'ouvre QtCreator (mon super IDE préféré pour Qt/C++) et sans avoir cliqué sur quoi que ce soit, j'obtiens ce bug célèbre que tout programmeur a forcément déjà rencontré au moins une fois dans sa vie.
Comme quoi, même le célèbre Qt Creator est bugué (mais heureusement cela n'arrive que très rarement).
Sinon concernant heftyAD, ça avance bien. J'ai commencé à intégrer Javascript pour pouvoir écrire les algorithmes en Javascript. Personnellement je continuerais à écrire les algos en C++ : comme ça je testerais à la fois les deux méthodes de mise en place d'algorithmes. Mais avant, pour pouvoir avoir du code un minimum générique, il faut bien réorganiser le code que j'avais déjà écrit.
Concernant les animations, don't worry, elles fonctionnent toujours. Pour l'instant je n'ai juste pas eu le temps de faire la vidéo. Mais ça arrive !
Hello, heftyAD avance ! Voici quelques nouveautés intéressantes.
Avancée 1/3
J'ai amélioré l'interface des simulations. Maintenant, lorsqu'on écrit un algorithme, l'explication par le texte est optionnelle mais toujours possible. Les textes explicatifs seront affichés dans deux types de console dont je parlerais plus tard. Et il est toujours possible d'exécuter (ou visualiser) plusieurs simulations en même temps.
Avancée 2/3
Il est dorénavant possible de choisir le type d'algorithme que l'on souhaite. Pour l'instant seuls les langages C++ et JavaScript sont pris en compte.
Avancée 3/3
Concernant les langages, heftyAD permet seulement de créer des algorithmes en JavaScript. Pour le C++, il faudra pour le moment passer par des outils externes comme Qt Creator.
Mots de fin
Enfin, je travaille aussi sur un nouveau genre d'animation. En effet, en plus de pouvoir animer l'opacité ou encore la position d'un item, on pourra plus tard mettre en évidence des parties dans la zone affichant les items. Typiquement, je proposerais des fonctionnalités pour
entourer/encadrer une zone de l'écran,
afficher du texte furtif (qui disparaîtra après un certain temps)
...
Tout ça, dans quel but ? Hé bien tout simplement : permettre aux gens d'expliquer les algorithmes plus facilement. En effet, nul besoin de lire le pseudo code d'un algorithme pour en comprendre le fonctionnement. Voir une simulation détaillée est largement suffisante de mon point de vue. Sur ce, bonne soirée à tous !
De très bonnes nouvelles sur l'avancement de heftyAD ! En voici TROIS que je trouve intéressantes :
Au moins 2 vidéos seront publiées prochainement
Je ferais deux vidéos dans les prochaines semaines. Promis juré !
La 1ère montrera où j'en suis arrivé pour la version 1.3 de l'application. Cette vidéo n'est pas nécessaire mais complète néanmoins celle que j'avais précédemment réalisée.
La 2nde montrera où j'en suis actuellement (la version 2.0). Et surtout, je ferais au moins un test complet des fonctionnalités nouvelles de l'application : création d'un modèle, choix d'un algorithme C++, etc.
Les animations classiques
Je vous parlais d'animation dans ce post datant du 12 octobre. Voici enfin l'image-gif. Elle est un peu floutée certes mais je n'y suis pour rien. Toutefois, ne vous en faites pas : je reviendrais dessus dans les prochaines vidéos.
On peut voir que
pour A : on anime l'opacité
pour B : on anime la couleur (en utilisant deux animations consécutives -> du blanc au noir puis du noir au blanc)
pour E et F : on anime la position
...
Les animation furtives
Pour l'instant, on peut rajouter seulement du texte furtif :
customiser le style du texte
indiquer s'il est en background ou en foreground (les textes en foreground s'affichent par dessus les items)
indiquer sa durée d'apparition
invoquer l'apparition du texte en synchrone (bloquer l'algorithme jusqu'à disparition du texte)
...
Les animation furtives permettront notamment de pouvoir annoter l'écran et ainsi permettre à l'apprenant de bien comprendre l'algorithme sans pour autant passer par la console. Je reviendrais dessus dans les prochaines vidéos.
J'ai enfin tout ce qu'il faut pour créer n'importe quel algorithme sur n'importe quel tableau. Bien entendu, les automates, map, graphes, matrices et bien d'autres types de modèle seront progressivement intégrés.
Ce qui est bien aussi, c'est que les algorithmes peuvent être écrits indépendamment des fonctionnalités que proposent heftyAD. Pour l'instant, seul le langage C++ est autorisé mais JavaScript le sera plus tard, une fois que l'API C++ sera suffisamment stable. Quant aux fonctionnalités de heftyAD sensées faciliter l'explication et la compréhension des algorithmes, on peut citer
le Highlighter : il permet de mettre en évidence ou rajouter directement des informations sur la vue affichant le contenu du modèle. On peut par exemple rajouter du texte furtif (qui disparaîtra après un certain temps) à l'écran.
le Clarifier : il permet de rajouter du texte explicatif qui sera afficher dans les deux consoles que proposent l'application (SimpleConsole et ShadowConsole). Pour information, Shadow est le nom de votre assistant dans l'application.
le Locker : il permet de simuler des temps d'attente (en millisecondes) et utilise des timers en interne. L'exécution de ces timers peut aussi être accélérée ou décélérée depuis l'interface graphique de l'application (via une slider dont les valeurs peuvent varier entre -100% et 100%).
Comme promis, il est maintenant tant que je commence à faire les vidéos. Il faudra aussi que j'écrive quelques algorithmes afin de vous montrer exactement ce dont je parle. Le seul hic est que mon PC est depuis tout récemment dans un état assez déplorable. Conséquence ? Toutes les captures d'écran ou vidéos que je réalise depuis mon PC sont légèrement floutées (cf. mes précédents posts ou encore la 1ère vidéo YouTube du projet). Dans tous les cas, je devrais pouvoir avoir accès à un PC ne présentant pas ces défauts. En attendant et vu qu'on est période de fêtes, je vous laisse sur cette joyeuse musique : https://www.youtube.com/watch?v=lJZj9nDbSpY.
Reproduire le dessin en background de cette vidéo n'est pas très compliqué : mais je n'ai pas l'impression de l'avoir bien réussi (sans doute la flemme ?). Le résultat est d'ailleurs clairement moins bien que celui-ci. Mais bon c'est en forgeant qu'on devient forgeron. Sinon bonne nouvelle concernant mon PC : il est maintenant en état. Je peux donc dorénavant commencer à réaliser les vidéos. Sur ce, très bonne année à tous ! Je me rapproche de plus en plus de la version que j'ai tant souhaitée.
PS : Les deux captures d'écran présentent le même dessin, l'une prise en rapproché le soir et l'autre en (légèrement) éloigné sous la lumière du jour.
heftyAD avance ! Pour information, la sauvegarde et le chargement du contenu d'un graphe est maintenant possible (cf. capture d'écran ci-après). Vous noterez aussi que l'application permet de customiser les items comme on le souhaite (peu importe la nature du modèle les contenant : graphe, tableau, automate, matrice, ...).
Concernant les vidéos, je n'ai pas oublié : je fais plein de trucs en même temps donc c'est assez dur de bien avancer dans un seul domaine. Mais sinon ça avance. J'ai par exemple déjà écrit une simulation qui explique clairement (et ce grâce à heftyAD) une des méthodes utilisées par l'ordinateur pour trier des données. La barre en haut à gauche (dans la capture d'écran ci-après) permet d'accéler ou de décélérer la simulation.
Là je vais voir quel algorithme simple s'appliquant aux graphes je peux expliquer avec l'application. Si j'en trouve un et que j'y arrive, alors j'aurais un autre élément intéressant pour les prochaines vidéos. Dans tous les cas, je dispose actuellement déjà de suffisamment d'éléments pour faire des démonstrations. Mais quelques réajustements par ci par là ne peuvent apporter que du positif.
Voici quelques captures d'écran : pas de textes kilométriques dans ce poste.
[1/5] Un tableau plutôt élég---
[2/5] Un graphe vide
Ouvrir l'image dans un nouvel onglet (car trop large) et essayer de ne pas s'en dormir.
[3/5] Graphe et courbes de Bézier
[4/5] Une petite comparaison
Comparons ensemble le graphe ci-dessous et son homologue dessiné avec la précédente version de l'application : aucune régression comme vous pouvez le constater.
[5/5] La sympathie des graphes
Ouvrir l'image ci-dessous dans un nouvel onglet car trop large.
Un graphe sympa pour la route.
Je m'approche progressivement du bout du tunnel. Mais il reste encore un petit bout de chemin à faire.
Comme vous pourrez le constater sur les screenshots ci-après, à chaque modèle est associé un menu contextuel. Aussi, actuellement, le procédé de personnalisation des arcs dans les graphes ne me plait pas trop. J'espère trouver une alternative d'ici là. Sinon la prochaine étape sera d'implémenter la fonctionnalité Edition Complète qui permettra d'éditer toutes les propriétés du modèle ainsi que celles de chacun ses éléments. Je n'aurais donc plus besoin d'éditer le fichier xml à la main.
Discord NaN. Mon site.
Discord NaN. Mon site.
Discord NaN. Mon site.
Discord NaN. Mon site.