|
|
|
|
|
|
|
|
|
|
- Leçon 1 - Présentation de l'application à réaliser
- Le projet exemple utilisé
- Ouverture du projet exemple
- Création d'une plateforme iOS
- Analyse du projet
- En résumé
Tuto - Développement d'une application Android et iOS
Leçon 1 - Présentation de l'application à réaliser Ce que vous allez apprendre : - Quel est le projet utilisé pour ce tuto ?
- Comment activer une plateforme ?
 10 mn Le projet exemple utilisé Dans ce tuto, nous allons réaliser une application Android et iOS utilisant une base de données HFSQL Classic. Les fonctionnalités que nous allons utiliser dans ce projet sont les suivantes : - une fenêtre permettant de lister les produits,
- une fenêtre permettant de visualiser et de modifier un produit affiché dans la liste. Cette fenêtre permettra également de créer un produit. Dans cette fenêtre, l'utilisateur pourra prendre une photo du produit et scanner un code-barres.
- une fenêtre permettant de visualiser les magasins sur un champ Carte.
- les agencements pour gérer l'orientation des fenêtres.
- une fenêtre permettant de réaliser une recherche avec "Pull to refresh".
- la gestion d'un menu coulissant.
- le changement du contenu d'une fenêtre par balayage.
- l'impression d'un état.
- la consommation d'un Webservice.
Nous avons déjà vu la création de projets dans le tuto Ma première application Android/iOS, nous travaillerons donc à partir d'un projet existant, contenant déjà la base de données et les données utilisées par l'application. Notre application va utiliser une base de données en mode HFSQL Classic.  Différence HFSQL Classic et HFSQL Client/Serveur - En mode HFSQL Classic, les fichiers de données sont stockés sur le matériel (iPhone, iPad, téléphones ou tablettes Android).
Dans ce cas, l'application est autonome. Il n'est pas nécessaire d'avoir une connexion via le réseau ou Internet.
Les données sont stockées dans la mémoire du matériel. La taille maximale de stockage dépend de la capacité mémoire du matériel.
Remarque : Si les données saisies sur l'appareil mobile doivent être synchronisées avec une base de données sur un serveur (HFSQL ou autre), la mise en place de la réplication est nécessaire (consultez Réplication des données mobiles). - En mode HFSQL Client/Serveur, aucune donnée n'est stockée sur le matériel. Les données sont stockées sur une machine sur laquelle est installé un serveur HFSQL. Pour accéder à cette machine et donc à la base de données, il est nécessaire d'avoir activé un moyen de communication avec le serveur dans l'application mobile (Wi-Fi ou 4G) afin de se connecter via le réseau ou Internet.
Les temps de réponse vont bien entendu dépendre de la qualité du réseau Wi-Fi ou Internet et du volume des données demandées.
Ouverture du projet exemple Dans WINDEV Mobile, ouvrez le projet "WM Gestion Produits" : - Affichez la page d'accueil de WINDEV Mobile (Ctrl + <).
- Dans la page d'accueil, cliquez sur "Tutoriel" puis dans la zone "Tuto - Développement d'une application Android et iOS", double-cliquez sur "Gestion de produits Android/iOS - Exercice".
 Avertissement
Ce projet sera utilisé dans les différentes leçons de ce tuto.
Création d'une plateforme iOS Le projet "WM Gestion Produits" que vous venez d'ouvrir, est un projet destiné uniquement à une utilisation sous Android. Comme nous voulons utiliser cette application également sous iOS, nous allons activer la plateforme iOS dans le projet. Rappel : Les configurations de projet permettent de définir les différents types de générations supportées par le projet : Android, iOS, composant, etc. Nous avons déjà utilisé les configurations de projet dans le tuto Mon premier projet Android/iOS. Dans ce tuto, nous allons voir la création d'une configuration de projet. Pour activer la plateforme iOS, il suffit de créer une configuration de projet : - Sous le volet "Projet", dans le groupe "Configuration de projet", déroulez "Nouvelle configuration" et sélectionnez "Application iPhone/iPad".
- L'assistant de création d'une configuration de projet se lance. L'assistant propose la création d'une plateforme iOS. Passez à l'étape suivante.
- Vous pouvez saisir les informations concernant la plateforme. Conservez les options par défaut et passez à l'étape suivante.
- L'assistant propose de choisir le type d'appareils concernés par le projet :
- Générer une application pour tous les iPhone et iPad.
- Générer une application pour tous les iPhone.
- Générer une application pour tous les iPad.
- Générer une application pour un appareil unique précis.
Cette dernière option doit être utilisée uniquement si l'application est destinée à un seul type d'appareil, un seul modèle. Ce cas est relativement rare.
Les autres options permettent un fonctionnement sur plusieurs appareils iOS (téléphones de tailles différentes ou de résolutions différentes par exemple). WINDEV Mobile permet de créer les fenêtres avec la plus petite résolution. L'utilisation des ancrages permettra à l'application de fonctionner sur tous les supports.
- Pour cet exemple, sélectionnez "Générer une application pour tous les iPhone".
- Passez à l'étape suivante et terminez l'assistant. La configuration iOS est automatiquement créée.
Pour vérifier la présence de la nouvelle configuration de projet, utilisez le volet "Explorateur de projet" : - Déroulez l'option "Configurations (Application iOS)" en haut du volet "Explorateur de projet".
- Les deux configurations apparaissent :
- Pour sélectionner l'une ou l'autre configuration, il suffit de double-cliquer sur le nom de la configuration voulue.
- La configuration iOS que nous venons de créer est automatiquement sélectionnée.
Nous allons maintenant commencer le développement de l'application. Pour la suite de ce cours, nous vous conseillons d'activer la configuration Android. - Déroulez l'option "Configurations (Application iOS)" en haut du volet "Explorateur de projet".
- Double-cliquez sur le nom de la configuration "Application Android".
- La configuration Android est automatiquement sélectionnée.
Pour information, les différentes images illustrant les leçons de ce tuto ont été réalisées avec la configuration Android. Si vous utilisez la configuration iOS, de légères différences peuvent être observées (notamment au niveau de l'Action Bar). Maintenant, intéressons-nous à la base de données de notre exemple. En effet, le projet contient uniquement l'analyse décrivant les fichiers de données HFSQL Classic que nous allons utiliser. Les fichiers de données correspondants sont fournis avec des données pour réaliser les différents tests. Avant d'aller plus loin, faisons un rapide rappel des termes utilisés dans l'analyse : - Fichier de données : L'analyse permet de décrire la structure des fichiers de la base de données. Le terme "Fichier de données" correspond dans certaines bases de données à "une table".
Dans WINDEV Mobile, le terme "Table" est réservé pour désigner un objet graphique permettant de visualiser le contenu d'un fichier de données sous forme de tableau, et/ou de saisir des lignes. Par exemple, une table peut permettre de saisir le détail d'une commande. - Enregistrement : Un enregistrement est quelquefois également appelé ligne. L'enregistrement d'un fichier de données correspond à l'ensemble des rubriques définies pour le fichier de données.
- Rubrique : Dans l'analyse, le terme rubrique désigne une zone d'un fichier de données. L'ensemble des rubriques d'un fichier de données permet de définir la structure d'un enregistrement.
- Clé/Index : Avec WINDEV Mobile et sa base de données HFSQL, la notion d'index est liée à la notion de clé. La notion de clé fait partie des caractéristiques d'une rubrique. Les clés permettent d'accélérer les accès aux données ou de faciliter les parcours des fichiers de données. En WINDEV Mobile, si un fichier de données HFSQL a plusieurs rubriques clés, en exécution, un seul fichier d'index sera créé.
Pour visualiser l'analyse associée au projet : - Cliquez sur
 parmi les boutons d'accès rapide du menu de WINDEV Mobile. - L'éditeur d'analyses s'affiche.
- Cette analyse est composée de 3 fichiers de données :
- Un fichier de données "Produit", qui contient la description du produit : libellé, prix, quantité, etc.
- Un fichier de données "Caractéristique", qui contient les différentes caractéristiques du produit. Par exemple, si le produit est un T-shirt, ses caractéristiques correspondront à la taille, la couleur, etc. Le fichier de données "Caractéristique" est donc lié au fichier de données "Produit".
- Un fichier de données "Magasin", qui contient pour chaque magasin, ses coordonnées GPS.
- Fermez l'éditeur d'analyses (cliquez sur la croix en haut à droite de l'éditeur).
Projet corrigé
Vous voulez vérifier le résultat de vos manipulations ?
Un projet corrigé est disponible. Ce projet contient les différentes fenêtres créées dans cette leçon. Pour ouvrir le projet corrigé, dans la page d'accueil, cliquez sur "Tutoriel" puis dans la zone "Tuto - Développement d'une application Android/iOS", double-cliquez sur "Gestion de produits Android/iOS - Corrigé". Cette leçon nous a permis de découvrir le projet manipulé dans ce tuto (avec son analyse) et de créer une configuration de projet. La leçon suivante va nous permettre de commencer le développement avec la mise en place des différentes fenêtres de l'application. |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|