Home

LiveCode

Structure et organisation

La structure


L'analogie de LiveCode avec un tiroir et des fiches est tout à fait valable. En LiveCode le tiroir s'appelle une pile et les fiches s'appellent des cartes.

Leurs noms dans la programmation sont "stack" et "card", car LiveCode est uniquement en anglais.

Vous pouvez avoir autant de piles que vous voulez sur votre PC, et elles peuvent s'appeler les unes les autres.

L'ouverture d'une pile se fait sur la carte numéro un, quel que soit le nombre de cartes dans la pile.

Vous pouvez vous déplacer dans les cartes d'une pile avec, par exemple, les commandes :

go to card 5

go to card "unNomDonnéParVous"


Et appeler une autre pile par :

go to stack "maPile"



Dans chaque carte, vous pouvez y placer des boutons et des champs du même type de ce que vous êtes habitués à voir dans les fenêtres des applications sur votre PC. En fait il serait possible d'écrire Windows en LiveCode. LiveCode lui-même est écrit en LiveCode.

De plus, plusieurs boutons et champs peuvent être regroupés sous un même nom lorsqu'on veut appliquer dessus la même chose. Par exemple les déplacer ensemble plutôt qu'un par un. Cela s'appelle un GROUP tout simplement.


Un exemple

Pour vous donner des idées d'utilitaires personnelles que vous pouvez faire, voici quelques exemples qui me sont utiles.

Premier exemple, pour faire ce tutoriel voici une carte où j'ai programmé, dans un bouton de nom "LiveCode --> HTML", la fonction permettant de passer la syntaxe de commande LiveCode en syntaxe compréhensible en HTML.


Le travail consiste à analyser chaque mot et à générer le mot en HTLM avec la bonne couleur de visualisation. Exemple :

go to stack "maPile"


Est traduit en HLM pour voir le même texte en :


LC-110

C'est un bouton simple rectangulaire avec un contour souligné et un fond semi-transparent.

Les boutons pour les couleurs correspondent à celles que LiveCode utilise dans sa présentation d'édition du code.

La flèche indique quelle est la couleur qui est visualisée.

Le champ à tous les mots avec un blanc comme séparateur, pour permettre le retour à la ligne et les voir tous.

Nous étudierons cette pile quand nous aurons fini avec les bases.


../icones/LCtoHTML

La taille de ma fenêtre est le format historique de HyperCard 512x360 pixel. Vous pouvez avoir toutes les tailles que vous voulez et aussi agrandir la fenêtre dynamiquement en tirant sur le coin en bas à droite.



Un autre exemple

Paprika est un gestionnaire de recettes de cuisine pour Windows, Mac, Android. Il est capable de récupérer les recettes à partir d'une page Web, mais il ne récupère pas les images, ce qui est un point fort des recettes du meilleurduchef.com. Je vous recommande ce site de cuisine.

J'ai donc développé une pile qui ne possède qu'une seule carte pour gérer Paprika.


../icones/Paprika

La pile Paprika est appelée à partir de ma pile d'aiguillages "ALGhome".


../icones/home

Notez le bouton "Toggle" qui fait passer la fenêtre "ALGhome" de mon premier écran de travail vers le deuxième écran.

Sa programmation est :

on mouseUp

if the first item of the location of this stack < 0

then

set the location of this stack to 680, 680 -- 1e écran

else

set the location of this stack to -260, 1260 -- 2eme écran

end if

end mouseUp


"the first item of the location" est la distance du bord gauche de l'écran au milieu du bouton, donc si il est négatif, le bouton est sur le deuxième écran à gauche.

Vous venez d'apprendre une nouvelle propriété de LiveCode. La propriété "location" qui permet de positionner une pile ou un bouton ou un champ. Il existe aussi topLeft, topRight, boottomLeft, bottomRigh pour déplacer qu'un seul coin, et la propriété rectangle" pour déplacer les quatre points cardinaux ensemble.

Mais revenons à nos moutons de description de la structure.




Quel type de langage est LiveCode ?



C'est un langage par événement

C'est quoi un événement ? Et bien par exemple quand vous cliquez avec votre souris vous avez plusieurs événements qui se produisent :


Le "mouseStillDown" c'est dans tous les logiciels typiquement pour faire un glisser-déposer.

Le "mouseUp" est le plus utilisé pour déclencher le code associé avec votre bouton, puisqu'en général on clique et on relâche le bouton de la souris immédiatement.

Les plus courants utilisés sont "openStack", "openCard", "mouseUp", "resizeStack".



Chaque événement génère un message avec son nom qui est envoyé à l'objet concerné, un bouton, un champ, une image, etc.



Que fait LiveCode de ces événements ?


Si l'objet, sur lequel vous avez cliqué, a le code suivant correspondant à l'événement :

on mouseUp

Le code de votre programme

end mouseUp


Parfait le code de votre programme va s'exécuter et LiveCode n'ira pas plus loin.

Mais si vous n'avez pas de "on mouseUp" dans l'objet, LiveCode va chercher quelqu'un d'autre qui en possède un. Cela se fait en suivant la hiérarchie du chemin des messages. LiveCode cherchera dans et dans l'ordre :



Librairies et arrière-plan c'est pour des grosses applications ou l'on doit partager du code commun à plusieurs piles. Laissons cela côté à notre niveau.


Les sous-piles (sub-stack) sont des piles attachées à la pile principale. Elles sont stockées physiquement dans le même fichier que la pile principale. Laissons cela côté à notre niveau.


Par contre, il est temps d'expliquer ce que c'est un background.



Définition des backgrounds


Si vous voulez qu'un même objet se trouve dans plusieurs cartes et ai le même code. A priori, il faut dupliquer le code dans tous les objets, ce qui est fastidieux.

Pour éviter cela, vous déclarez cet objet "background" (arrière-plan), et là vous n'aurez qu'à écrire votre code qu'une seule fois pour qu'il soit disponible dans tous les occurrences de cet objet dans les différentes cartes.

De plus, vous pouvez modifier le code de l'objet à partir de n'importe quelle carte où se trouve l'objet. Le code est commun à toutes les occurrences de l'objet.

Encore mieux, sachant que lorsque que vous demandez à créer une carte, tous les "background" (arrière-plan) de cette carte, où vous êtes, sont dupliqués, mais pas les objets non-background. Créer des cartes modèles "template" avec uniquement les objets backgrounds est une bonne habitude en programmation.

Notez qu'un objet déclaré en background n'a pas l'obligation d'être dans toutes les cartes. Vous choisissez les cartes où vous voulez qu'il soit.

Et si vous supprimez l'objet dans une carte cela supprime cet objet que dans cette carte. Les autres cartes le possédant ne sont pas affectés.


En pratique :

  1. Vous créer et positionnez votre objet (bouton, champ, etc)
  2. Vous le déclarez GROUP
  3. Vous le déclarez "background"

Nous verrons cela plus en détail avec des exemples de programmation. Pour cela il est temps d'installer LiveCode sur votre PC.




La suite : Comment installer LiveCode


Merci
SignatureZapfino




Les commandes que vous avez appris dans cette leçon
go to

go to card 5

go to stack "maPile"

location Donne la localisation du milieu d'un objet

set the location of this stack to -260, 1260 -- 2eme écran

rectangle Donne la localisation des quatre points cardinaux d'un objet

set the rectangle of field "Text" to 55, 0, Largeur-40, Hauteur

topLeft, topRight, boottomLeft, bottomRigh Chaque points cardinaux un par un



Page précédente

Page suivante



Merci de votre visite


UP