Dans cet article, vous apprendrez :

• Les différentes parties de l'éditeur d'applications Tulip
• Les éléments visuels de base que vous pouvez ajouter à une application (aussi appelés Widgets)
• Comment ajouter une logique de base en utilisant des boutons
• Comment compléter une application pour enregistrer des données

Si vous êtes encore en train de vous familiariser avec l'éditeur d'applications Tulip, cet article est fait pour vous. Nous utiliserons un exemple d'application d'instructions de travail pour passer en revue tous les outils principaux de l'Editeur d'Applications.

L'éditeur d'applications vous permet de créer des applications pour les opérateurs sans écrire de code.

Voici à quoi il ressemble :

Dans l'éditeur d'applications, vous pouvez créer une série d'étapes qui présentent des éléments visuels numériques d'un processus.

Vidéo d'introduction

Présentation de l'éditeur d'applications

L'éditeur d'applications est l'endroit où vous construisez et éditez votre application. Le diagramme suivant montre les différentes parties qui composent l'éditeur d'applications :

1. Add Step/Step Group - Ajouter une nouvelle étape ou un nouveau groupe d'étapes
2. Panneau Etapes/Enregistrements - Visualisez vos étapes via l'onglet Etapes ou passez à l'onglet Enregistrements pour visualiser les tables utilisées.
3. Espace de travail - L'espace pour créer l'interface de votre application
4. Add an Asset Widget - Ajoutez une forme, une icône ou un logo à votre application.
5. Ajouter un widget bouton - Ajouter un bouton à votre application.
6. Ajouter un widget de saisie - Ajoutez un champ de saisie à votre application.
7. Ajouter un widget texte - Ajoutez une zone de texte à votre application.
8. Incorporer un widget - Incorporer une variété de widgets, tels que des images, des analyses, des attributs de machine, etc.
9. Ajouter un widget de caméra - Ajoutez une caméra ordinaire ou un instantané de caméra à code-barres.
10. Traduire - Le lecteur Tulip traduira automatiquement l'application dans la langue sélectionnée via votre profil Tulip.
11. Créer un instantané - Sauvegarder une version actuelle de votre application, en créant un duplicata.
12. Test - Testez votre application en mode développeur.
13. Run - Exécuter votre application dans le Tulip Player
14. Publier - Publier votre application
15. Avancer/Retour - Déplacer un élément dans l'espace de travail vers l'avant ou derrière d'autres éléments
16. Volet latéral - Définir les déclencheurs et les composants stylistiques dans les onglets Widget, Step et App.

L'outil de panoramique et de zoom vous permet de

• déplacer la surface d'édition de votre application
• Effectuer un zoom avant ou un zoom arrière

La liste des étapes sur la gauche montre la liste des étapes, y compris la mise en page de base.

Mise en page de base

Toute modification de formatage ou de mise en page apportée à la présentation de base s'appliquera automatiquement à chaque étape de l'application.

Vous pouvez modifier la mise en page de base d'une seule étape en "déverrouillant" les éléments individuels dans le volet contextuel à droite.

Pour en savoir plus sur les mises en page de base , cliquez ici.

Étapes

Vous pouvez cliquer sur une étape pour afficher les éléments qu'elle contient.

{Cliquez avec le bouton droit de la souris sur une étape pour la dupliquer.}

Cliquez avec le bouton droit de la souris sur une étape pour la dupliquer, la regrouper ou la supprimer.

{Cliquez avec le bouton droit de la souris sur une étape pour la dupliquer, la regrouper ou la supprimer.}

Pour en savoir plus sur les étapes , cliquez ici.

Barre d'outils

La barre d'outils située en haut de l'écran comprend des éléments visuels qui peuvent être ajoutés à l'application. Il s'agit d'éléments tels que des formes, des photos, du texte, des vidéos et des boutons. Pour ajouter un nouvel élément visuel à l'application, il suffit de cliquer dessus et de le faire glisser à l'endroit souhaité.

Sur le côté droit de la barre d'outils se trouvent des outils supplémentaires que vous pouvez utiliser pour superposer les objets dans l'éditeur d'application Tulip.

Panneau de contexte

Le volet contextuel situé à droite de l'écran est l'endroit où vous gérez tout le formatage et la logique de l'application. Pour en savoir plus sur la configuration des widgets, cliquez ici.

Il y a trois onglets :

• Onglet Étape
• Onglet App
• Onglet Widget

Onglet Étape

L'onglet Étape vous présente

• Les options de formatage pour l'ensemble de l'étape
• Permet de spécifier le temps de cycle cible pour cette étape
• Permet de revenir à la disposition spécifiée dans la disposition de base.
• Permet de supprimer l'étape en cours
• Permet de construire une logique qui sera exécutée à chaque fois que cette étape sera ouverte ou fermée - nous reviendrons sur les déclencheurs un peu plus loin.

Onglet App

L'onglet App:

• permet d'imprimer les étapes de l'application
• Permet d'ajuster la durée du cycle pour l'ensemble de l'application.
• Affiche une liste de toutes les variables associées à cette application.
• Vous permet de spécifier la résolution de l'application pour qu'elle corresponde à l'interface que vous souhaitez utiliser.
• Permet d'ajouter des commentaires si plusieurs administrateurs examinent les modifications.
• Permet de construire une logique qui sera exécutée chaque fois que l'application est démarrée, terminée ou annulée.

Onglet Widget

En cliquant sur un élément de l'application, vous ferez apparaître un autre onglet dans le volet latéral, l'onglet Widget. C'est là que vous pouvez ajuster le format des différents éléments visuels de l'application, ainsi que son comportement lorsqu'on interagit avec eux.

Ajouter de la logique à une application

La logique détermine ce qui se passe dans l'application lorsque l'opérateur interagit avec elle. Pour commencer, utilisons un simple bouton avec un déclencheur pour naviguer d'une étape à l'autre.

1. Cliquez sur Boutons dans la barre d'outils et sélectionnez Bouton.
2. Faites glisser le bouton à l'endroit souhaité.

1. Ajoutez une étiquette au bouton et réglez les options de format/couleur à l'aide du volet contextuel situé à droite.

1. Pour ajouter une logique au bouton, cliquez sur + en regard de Déclencheurs dans le volet latéral.

{Les déclencheurs vous permettent d'ajouter de la logique à votre bouton.}

Lesdéclencheurs vous permettent d'ajouter de la logique à vos applications sans avoir à utiliser de code. Les déclencheurs utilisent une séquence "when", "if", "then" et "else".

Le déclencheur que nous allons construire ici a la logique suivante :

Quand : Le bouton est enfoncé

Ensuite : L'heure actuelle est enregistrée dans une variable

Transition : Aller à l'étape → Suivant.

1. Cliquez sur Save.

Ce bouton permet à l'utilisateur de passer à l'étape suivante. En règle générale, vous voudrez ajouter un bouton permettant aux utilisateurs de revenir à l'étape précédente.

Une fois que vous avez construit la logique de base de l'application, vous pouvez cliquer sur Test en haut à droite. Cela lancera votre application en mode développeur, afin que vous puissiez la tester.

Compléter une application et enregistrer les données

Un bouton Compléter permet à Tulip d'enregistrer toutes les données de l'application associées à chaque opérateur.

Dans cet exemple, nous allons ajouter un autre bouton sur la dernière étape de l'application.

1. Sélectionnez la dernière étape de votre application.
2. Cliquez sur Boutons, et sélectionnez Compléter.
3. Faites glisser le nouveau bouton à la position souhaitée.

Pour aller plus loin

Utilisez ces guides pas à pas pour créer une application complète à l'aide de ces concepts :

• Marche à suivre : Créez votre première application
• Marche à suivre : Créer un formulaire de saisie de données

Vous avez trouvé ce que vous cherchiez ?

Vous pouvez également vous rendre sur community.tulip.co pour poser votre question ou voir si d'autres personnes ont rencontré une question similaire !