Applications iOS basées sur la localisation faciles avec le modèle appyMap

Ce que vous allez créer

introduction

Vaut-il mieux gagner 5 000 $ en travaillant dix heures par jour ou 3 000 $ en n’en travaillant qu’une seule? Le temps c’est de l’argent, et c’est le atout le plus important que nous avons.

L’utilisation d’un modèle d’application présente deux avantages:

  • Cela vous fait gagner du temps.
  • Vous apprenez quelque chose de nouveau, rapidement.

Pour créer une application à l’aide d’un modèle, vous saisissez vos données, changez le logo, personnalisez les polices, les couleurs … et c’est tout.

Supposons que vous souhaitiez créer un guide des points d’intérêt (églises, musées, monuments ou encore parkings, boutiques, etc.) de votre ville. Vous pouvez créer votre application à partir de zéro et passer beaucoup de temps à concevoir l’interface, à écrire le code et à implémenter des frameworks. Ou vous pouvez utiliser un modèle et tout préparer en quelques heures, parfois quelques minutes!

Et peut-être plus important encore, vous gagnez du temps non seulement dans la réalisation de l’application elle-même, mais aussi dans l’apprentissage de nouveaux concepts: vous pouvez voir en pratique comment les nouvelles choses fonctionnent, afin que vous puissiez apprendre et assimiler de nouvelles idées beaucoup plus rapidement.

Mais nous voulions faire un guide de notre ville, non? Voyons comment le faire en dix minutes avec appyMap.

Aperçu

Avec appyMap, vous pouvez créer votre propre application pour aider les utilisateurs à découvrir des points d’intérêt regroupés par catégories, comme une application de référence pour les magasins ou les restaurants, un guide de la ville ou toute autre utilisation nécessitant la localisation de lieux sur une carte. Tu peux trouver le modèle d’application basée sur la localisation appyMap iOS en téléchargement sur CodeCanyon.

La structure appyMap est très simple et se compose de quatre écrans: Accueil, Section, Détails et Directions (qui sont fournis par Apple Maps).

Écrans appyMap Détails et directions de la section d'accueil

L’écran d’accueil montre nos sections principales, à l’intérieur desquelles se trouvent les points d’intérêt.

La sélection d’un point d’intérêt ouvre l’écran de détail avec des photos, des descriptions et un champ supplémentaire (qui peut être utilisé pour l’adresse, les heures d’ouverture, etc.) et un bouton pour obtenir les itinéraires. Si un numéro de téléphone est présent, vous pouvez également appeler le point d’intérêt depuis l’application.

Voyons maintenant comment insérer nos données dans l’application.

Saisie des données d’application

Il existe deux façons de saisir vos données: via fichiers Plist locaux ou en utilisant CloudKit, La plateforme cloud d’Apple. Chacun a ses avantages et ses inconvénients.

Option 1: Fichiers Plist locaux

Les fichiers Plist sont des fichiers que vous incluez dans votre application. Il s’agit d’un document de données structurées – un peu comme un fichier de feuille de calcul.

Modification d'un Plist dans Xcode

Vous pouvez modifier les fichiers Plist avec Xcode. C’est le moyen le plus simple et utile lorsque vous avez juste besoin de modifier ou d’ajouter de petites quantités de données. Une autre façon d’ajouter des données à un fichier Plist consiste à convertir une feuille de calcul et à l’importer dans Xcode. C’est vraiment pratique lorsque vous devez gérer une grande quantité de données.

L’utilisation de fichiers Plist pour expédier les données de votre application vous offre deux avantages:

  1. Votre application n’aura pas besoin d’une connexion Internet pour fonctionner correctement.
  2. Moins de décalage: les données Plist de votre application seront chargées instantanément au démarrage, tandis que les données stockées dans le cloud auront toujours un certain décalage.

L’inconvénient de l’utilisation de données locales est que, si vous souhaitez ajouter ou modifier des points d’intérêt, vous devrez publier une nouvelle version de l’application.

Configuration du menu principal

Dans le projet Xcode fourni avec appyMap, ouvrez le Main.plist fichier – ce fichier définit le menu principal. Dans ce fichier, nous voyons une liste d’articles, qui définissent les catégories («sections») des lieux d’intérêt. Chaque élément comporte trois champs:

  • id: l’identifiant unique de la section, utilisé également pour commander des articles
  • name: le nom de la section
  • isFree: Si défini sur "yes" la section est gratuite, sinon elle est verrouillée et peut être déverrouillée avec un achat intégré.

Chaque section peut avoir une icône, qui doit avoir le même nom de fichier que le nom de la section (voir l’image ci-dessous).

Mainplist spécifie que les icônes de sections sont dans des fichiers image séparés

Vous pouvez ajouter autant de sections que vous le souhaitez: les nouvelles sections seront ajoutées à la fin de la liste, et la vue de collection du menu principal défilera si besoin est.

Points d’interêts

Une fois que vous avez configuré les sections principales, vous pouvez commencer à ajouter des points d’intérêt. Pour chaque section, appyMap recherchera un fichier Plist avec le même nom de fichier que le nom que vous choisissez pour la section. Par exemple, si vous avez une section intitulée “Maisons”, appyMap recherchera un fichier appelé Houses.plist, et il lira les lieux d’intérêt de la section Maisons à partir de ce fichier.

Ces fichiers de lieux d’intérêt comportent les champs suivants:

  1. id
  2. name
  3. description
  4. latitude
  5. longitude
  6. tel (optionnel)
  7. time (optionnel)

Pour l’image miniature du lieu d’intérêt, l’application recherchera une image JPEG avec un nom de fichier composé du nom de la section suivi de l’identifiant du lieu d’intérêt. Donc, si vous avez trois places dans la section Musée, vous avez besoin de trois photos nommées Museum1.jpg, Museum2.jpg, et Museum3.jpg.

Option 2: CloudKit

Au lieu de stocker les informations de votre application dans des fichiers Plist locaux, vous pouvez les diffuser à partir du CloudKit d’Apple.

Tableau de bord Apple CloudKit

Si vous décidez d’utiliser CloudKit, vos informations ne seront plus locales, mais seront lues à partir du cloud. Cela vous permet de modifier la base de données des lieux d’intérêt sans avoir à publier de nouvelles versions de l’application. Cependant, l’application nécessitera une connexion Internet pour afficher les points d’intérêt.

Utiliser CloudKit

À l’aide de votre compte de développeur Apple, vous pouvez utiliser le CloudKit back-end pour gérer vos données. Si vous disposez d’un compte de développeur Apple, vous pouvez gérer CloudKit avec le tableau de bord CloudKit.

Pour connecter votre application à CloudKit, vous devez accéder à votre Page développeuret activez iCloud:

Activer iCloud sur la page des développeurs

Revenez ensuite à Xcode, sélectionnez votre cible et activer iCloud pour votre application:

Activez iCloud pour votre application

Vous devez maintenant ajouter deux types d’enregistrement pour contenir les données de l’application. En commençant par le type principal, pour contenir les données du menu des sections: accédez à votre tableau de bord CloudKit, sélectionnez Types d’enregistrement, cliquez sur le bouton plus et nommez l’enregistrement “Principale“. Nous devons maintenant recréer essentiellement la même structure que celle utilisée dans le fichier Plist. Cliquez sur Ajouter le champ… et créez quatre champs:

  1. Nom (type: chaîne)
  2. image (type: actif)
  3. ordre (type: Int (64))
  4. est libre (type: Int (64))

C’est un peu différent du format Plist, car nous avons créé un champ supplémentaire appelé “image“, qui contiendra l’icône de chaque section.

À la fin, vous devriez avoir une table comme celle-ci:

Table principale appyMaps dans CloudKit

Ensuite, vous devez créer un type d’enregistrement pour chaque section que votre application affichera. Par exemple, si vous avez deux sections (disons “Maisons” et “Monuments”) pour votre application, vous créerez deux enregistrements correspondants, nommés “Maisons” et “Les monuments“(comme dans la capture d’écran ci-dessus).

Pour créer un autre type d’enregistrement, commencez par cliquer sur le + bouton. Donnez à l’enregistrement le nom de votre section (dans ce cas “Maisons“):

Cliquez maintenant sur Ajouter le champ… et créez des champs comme vous l’avez fait auparavant. Cette fois, les champs que vous devez créer sont les suivants:

  1. Nom (type: chaîne)
  2. la description (type: chaîne)
  3. image (type: actif)
  4. coordonnées (type: Lieu)
  5. tel (type: chaîne)
  6. temps (type: chaîne)
  7. ordre (type: Int64)

Notez que le tel (téléphone) et temps les champs sont facultatifs. S’ils sont présents, ils apparaîtront dans l’écran de détail, sinon ils sont masqués.

Astuce: un moyen rapide d’obtenir les coordonnées cartographiques

Entrer des emplacements pour appyMap implique de rechercher de nombreuses latitudes et longitudes. Pour trouver rapidement la latitude et la longitude d’un emplacement donné, il suffit de le rechercher dans Google Maps, de faire un clic droit sur le point d’intérêt et de sélectionner Qu’est ce qu’il y a ici? Cela renverra toutes les données de lieu, ainsi que sa latitude et sa longitude. Vous pouvez simplement copier et coller ces valeurs dans le lat et lon champs dans CloudKit ou dans votre fichier Plist.

Obtenir les coordonnées cartographiques à partir de Google Maps

Conclusion

Dans ce didacticiel, vous avez appris à démarrer avec une nouvelle application géolocalisée à l’aide du modèle appyMap de CodeCanyon. Vous avez appris comment fonctionne le modèle et comment ajouter vos propres données de localisation au modèle.

Si vous téléchargez le modèle, vous obtiendrez beaucoup plus d’informations sur la configuration et la personnalisation de votre application. appyMap est livré avec un guide d’instructions détaillé qui vous guidera à travers toutes les étapes de configuration et de personnalisation du modèle correctement.

Mais c’est facile. Pour créer une application à l’aide d’un modèle, entrez simplement vos données, personnalisez la couleur, les polices et le logo … et compilez! Votre application peut être prête en quelques heures seulement.

Il y a des centaines d’autres Modèles d’application iOS sur CodeCanyon. Allez les voir! Vous pourriez vous épargner de nombreuses heures de travail.

Bonne chance pour votre prochaine application! Et en attendant, consultez quelques-uns de nos autres didacticiels d’application iOS ici sur Envato Tuts +.

En relation :  7 applications utiles pour gérer votre carte SIM sur Android
Moyens Staff
Moyens I/O Staff vous a motivé, donner des conseils sur la technologie, le développement personnel, le style de vie et des stratégies qui vous aider.