Mettre un nom
Cliquer sur « OK »
Cliquer sur la vignette
Cliquer sur « English »
Possibilité de changer la langue
Tous les éléments qu’on peut mettre dans l’application (User Interface)
Tous les éléments qu’on peut mettre dans l’application (User Interface)
Tous les éléments qu’on peut mettre dans l’application (Layout)
Tous les éléments qu’on peut mettre dans l’application (Media)
Tous les éléments qu’on peut mettre dans l’application (Drawing & Animation)
Tous les éléments qu’on peut mettre dans l’application (Sensors)
Tous les éléments qu’on peut mettre dans l’application (Social)
Tous les éléments qu’on peut mettre dans l’application (Storage)
Tous les éléments qu’on peut mettre dans l’application (Visualisation)
Tous les éléments qu’on peut mettre dans l’application (Connectivity)
Tous les éléments qu’on peut mettre dans l’application (Artificial Intelligence)
Tous les éléments qu’on peut mettre dans l’application (LEGO MINDSTORMS)
Tous les éléments qu’on peut mettre dans l’application (Experimental)
Possibilité de rajouter des fonctions externes
Je vais vous faire un exemple d’application simple pour vous montrer comment cela fonctionne
Faire glisser le label sur l’écran du milieu
Voici ce que ça donne
Descendre
Changer le texte
Remonter
Voici ce que ça donne
Cliquer sur « Front size » et mettre 25
On voit que la taille a augmenté
Faire glisser un checkbox sur l’écran
Descendre
Changer le texte
Remonter
Voici ce que ça donne
Cliquer sur « Background Color »
Choisir une couleur (ici rouge)
Voici ce que ça donne
Faire glisser un « Date Picker »
Descendre
Changer le texte
Remonter
Voici ce que ça donne
Cliquer sur Width
Cliquer sur « Fill Parent »
Cliquer sur « OK »
Voici ce que ça donne
Cliquer sur « Height »
Cliquer sur « Pixel »
Mettre 20
Cliquer sur « OK »
Voici ce que ça donne
Glisser un « Button »
Descendre
Changer le texte
Remonter
Voici ce que ça donne
Descendre
Cliquer sur « Layout »
Glisser un « Horizontal Arrangement »
Cliquer sur « Width »
Cliquer sur « Fill parent »
Cliquer sur « OK »
Cliquer sur « User interface »
Faire glisser une « Image » dans le rectangle gris
Faire glisser un « Button » à droite de l’image
Cliquer sur le cadre gris
Cliquer sur « Align Vertical »
Sélectionner « Center »
Voilà ce que ça donne
Cliquer sur le logo image
Cliquer sur « Picture »
Cliquer sur « Upload File »
Cliquer sur « Choisissez un fichier »
Sélectionner une image
Cliquer sur « Ouvrir »
Cliquer sur « OK »
Cliquer sur « Height »
Cliquer sur « pixels »
Mettre 200
Cliquer sur « OK »
Cliquer sur « Width »
Cliquer sur le bouton
Cliquer sur « Width »
Cliquer sur « Fill parent »
Cliquer sur « OK »
Descendre
Changer le texte
Remonter
Cliquer sur « Add Screen »
Cliquer sur « OK »
Descendre
Faire glisser l’élément « Google Maps »
Cliquer sur « User interface »
Faire glisser le « Web Viewer » en dessous de la map
Dans « Home URL », mettre l’URL d’un site, ici « https://saligaud.com »
Voilà
Après l’aspect visuel, place à la « programmation » simplifiée
Cliquer sur « Screen2 »
Cliquer sur « Screen1 »
Cliquer sur « Blocks »
Cliquer sur « Screen1 »
Glisser le « When »
Pour comprendre, il suffit de lire ce qu’il y a de marqué sur les blocks. C’est assez clair je trouve^^
Aller dans « Horizontal Arrangement »
Faire glisser « Visible »
Faire glisser la partie verte dans la jaune
Cliquer sur « Logic »
Prendre le « false »
Cliquer sur « Button1 »
Glisser « Click »
Cliquer sur « Control »
Glisser le « if »
Cliquer sur « Logic »
GIisser le « and »
Voilà
Faire glisser le « = »
Copier et coller le « = »
Cliquer sur « CheckBox1 »
Glisser « Checked »
Cliquer sur « Logic »
Glisser le « true »
Cliquer sur « Date_Picker1 »
Descendre
Glisser « Year »
Cliquer sur « Math »
Glisser le « 0 »
Le glisser dans le « = »
Copier et coller le « visible »
Cliquer sur la roue dans dents du « if »
Glisser le « else » dans le « if »
Cliquer dans le vide pour valider
Cliquer sur « Label1 » et glisser le « text » dans le « else »
Cliquer sur « Text »
Le glisser dans le « text » du « label1 »
Cliquer sur « Button2 »
Cliquer sur « Control »
Glisser « open another screen screenName »
Cliquer sur « Text »
Glisser un « text » et noter « Screen2 »
Maintenant pour tester et installer l’application sur un smartphone
Cliquer sur « Apps »
Cliquer sur « Save app »
Cliquer sur « Export »
Cliquer sur « App (provide QR code for .apk) »
Attendre la fin du chargement
Voici le QR code qu’il va falloir scanner
Mais avant, faire descendre la barre de notifications
Cliquer sur le logo des réglages
Descendre
Cliquer sur « Sécurité »
Cocher « Sources inconnues »
Cliquer sur « OK »
Retourner au menu principal
Ouvrir une application de scan de QR code, ici « QR Droid »
Le fichier a été téléchargé, cliquer dessus
Cliquer sur « Installer »
Cliquer sur « OK »
Voici le résultat
On peut voir que j’ai fait le bouton trop petit donc on ne peut pas lire le texte
Cocher la case
Cliquer sur l’année
Scoller vers le haut
Sélectionner « 1950 »
Cliquer sur « OK »
Cliquer sur « Valider »
Cliquer sur « Aller à la page suivante »
Voici la 2ème page
Allez faire un tour sur le site 🙂 (www.saligaud.com)
Complément : Possibilité de changer l’icone, d’enlever « Screen1 » et « Screen2 » en haut et de faire encore plein de trucs. Thunkable fonctionne exactement comme Apinventor (mais en plus moderne). J’ai fait une démo d’Appinventor plus complète (lien dans la description de la vidéo) que je vous invite à regarder.
Maintenant pour iOS
Descendre
Cliquer sur « Get Your App Started »
Cliquer sur « iOS »
Cliquer sur « Sign in with Google »
Cliquer sur votre compte
Cliquer sur le « + »
Mettre un nom
Cliquer sur « Create »
Cliquer sur le logo de l’application
On retrouve des fonctions similaires à celles sur Android
Faire glisser sur l’écran du mobile
Voici le résultat
Faire glisser sur l’écran du mobile
Cliquer sur « Screen1 »
Cliquer sur « Blocks »
Cliquer sur « Button1 »
Même principe que pour Android
Cliquer sur Map1
Même principe que pour Android
Cliquer sur « Live Test »
Pour tester l’application sur un iPhone
Voici le QR code
Fermer la fenêtre
Cliquer sur Download
Possibilité d’envoyer l’application par mail
Fermer la page
Personnellement je n’ai pas d’iPhone donc je n’ai pas pu faire le test. Mais vous trouverez, dans la description de la vidéo, un tuto qui explique comment procéder exactement pour iOS.
Related posts:
Gagner de l’argent avec une application mobile grâce aux publicités (AppInventor, Thunkable, Kodular, AppyBuilder)
Présentation de l’application officielle des Saligauds (Android pour l’instant)(www.saligaud.com)
Faire une application sur Smartphone Android GRATUITEMENT (App Inventor)
Emulateur Android Officiel 📱 (avec Android Studio) (PlayStore, camera…) (GRATUIT)