Xamarin.Forms
Travailler avec des cartes

Remarques

Ajouter une carte dans Xamarin.Forms (Xamarin Studio)

Vous pouvez simplement utiliser les API de carte natives sur chaque plate-forme avec Xamarin Forms. Il vous suffit de télécharger le package Xamarin.Forms.Maps à partir de nuget et de l'installer dans chaque projet (y compris le projet PCL).

Initialisation des cartes

Tout d'abord, vous devez ajouter ce code à vos projets spécifiques à la plateforme. Pour ce faire, vous devez ajouter l' Xamarin.FormsMaps.Init méthode Xamarin.FormsMaps.Init , comme dans les exemples ci-dessous.

projet iOS

Fichier AppDelegate.cs

[Register("AppDelegate")]
public partial class AppDelegate : Xamarin.Forms.Platform.iOS.FormsApplicationDelegate
{
    public override bool FinishedLaunching(UIApplication app, NSDictionary options)
    {
        Xamarin.Forms.Forms.Init();
        Xamarin.FormsMaps.Init();

        LoadApplication(new App());

        return base.FinishedLaunching(app, options);
    }
}

Projet Android

Fichier MainActivity.cs

[Activity(Label = "MapExample.Droid", Icon = "@drawable/icon", Theme = "@style/MyTheme", MainLauncher = true, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation)]
public class MainActivity : Xamarin.Forms.Platform.Android.FormsAppCompatActivity
{
    protected override void OnCreate(Bundle bundle)
    {
        TabLayoutResource = Resource.Layout.Tabbar;
        ToolbarResource = Resource.Layout.Toolbar;

        base.OnCreate(bundle);

        Xamarin.Forms.Forms.Init(this, bundle);
        Xamarin.FormsMaps.Init(this, bundle);

        LoadApplication(new App());
    }
}

Configuration de la plate-forme

Des étapes de configuration supplémentaires sont nécessaires sur certaines plates-formes avant que la carte ne s'affiche.

projet iOS

Dans un projet iOS, il suffit d'ajouter 2 entrées à votre fichier Info.plist :

• Chaîne NSLocationWhenInUseUsageDescription avec la valeur We are using your location
• Chaîne NSLocationAlwaysUsageDescription avec valeur Can we use your location

Projet Android

Pour utiliser Google Maps, vous devez générer une clé API et l'ajouter à votre projet. Suivez les instructions ci-dessous pour obtenir cette clé:

1. (Facultatif) Recherchez l'emplacement de votre outil keytool (par défaut, /System/Library/Frameworks/JavaVM.framework/Versions/Current/Commands )

2. (Facultatif) Ouvrez le terminal et accédez à votre répertoire d'outils:

   cd /System/Library/Frameworks/JavaVM.framework/Versions/Current/Commands

3. Exécutez la commande keytool suivante:

   keytool -list -v -keystore "/Users/[USERNAME]/.local/share/Xamarin/Mono for Android/debug.keystore" -alias androiddebugkey -storepass android -keypass android

   Où [NOM D'UTILISATEUR] est évidemment votre dossier d'utilisateur actuel. Vous devriez obtenir quelque chose de similaire dans la sortie:

   Alias name: androiddebugkey
   Creation date: Jun 30, 2016
   Entry type: PrivateKeyEntry
   Certificate chain length: 1
   Certificate[1]:
   Owner: CN=Android Debug, O=Android, C=US
   Issuer: CN=Android Debug, O=Android, C=US
   Serial number: 4b5ac934
   Valid from: Thu Jun 30 10:22:00 EEST 2016 until: Sat Jun 23 10:22:00 EEST 2046
   Certificate fingerprints:
            MD5:  4E:49:A7:14:99:D6:AB:9F:AA:C7:07:E2:6A:1A:1D:CA
            SHA1: 57:A1:E5:23:CE:49:2F:17:8D:8A:EA:87:65:44:C1:DD:1C:DA:51:95
            SHA256: 70:E1:F3:5B:95:69:36:4A:82:A9:62:F3:67:B6:73:A4:DD:92:95:51:44:E3:4C:3D:9E:ED:99:03:09:9F:90:3F
            Signature algorithm name: SHA256withRSA
            Version: 3
   

4. Tout ce dont nous avons besoin dans cette sortie est l'empreinte du certificat SHA1. Dans notre cas, cela équivaut à ceci:

   57:A1:E5:23:CE:49:2F:17:8D:8A:EA:87:65:44:C1:DD:1C:DA:51:95
   

   Copiez ou enregistrez quelque part cette clé. Nous en aurons besoin plus tard.

5. Accédez à Google Developers Console , dans notre cas, nous devons ajouter l' API Google Maps Android , alors choisissez-la:

6. Google vous demandera de créer un projet pour activer les API, suivez cette astuce et créez le projet:

7. Activez l'API Google Maps pour votre projet: Après avoir activé api, vous devez créer des informations d'identification pour votre application. Suivez ce conseil:

8. Sur la page suivante, choisissez la plate-forme Android, appuyez sur "Quelles sont les références dont j'ai besoin?" Cliquez sur le bouton, créez un nom pour votre clé API, tapez sur "Ajouter le nom et l’empreinte du package", entrez votre nom de package et votre empreinte SHA1 à l’étape 4 et créez enfin une clé API: Pour trouver le nom de votre package dans Xamarin Studio, accédez à votre solution .Droid -> AndroidManifest.xml:

9. Après la création, copiez la nouvelle clé API (n'oubliez pas de cliquer sur le bouton "Terminé") et collez-la dans votre fichier AndroidManifest.xml : Fichier AndroidManifest.xml

   <?xml version="1.0" encoding="utf-8"?>
   <manifest
       xmlns:android="http://schemas.android.com/apk/res/android"
       android:versionCode="1"
       android:versionName="1.0"
       package="documentation.mapexample">
       <uses-sdk
           android:minSdkVersion="15" />
       <application
           android:label="MapExample">
           <meta-data
               android:name="com.google.android.geo.API_KEY"
               android:value="AIzaSyBAg8X-t4pOIDDp3q5Ph45jKUIVjo_RnxU" />
           <meta-data
               android:name="com.google.android.gms.version"
               android:value="@integer/google_play_services_version" />
       </application>
   </manifest>        
   

   Vous devrez également activer certaines autorisations dans votre manifeste pour activer certaines fonctionnalités supplémentaires:

   • Accès Emplacement grossier
   • Accès Fine Location
   • Accès Emplacement Commandes supplémentaires
   • Emplacement du mock d'accès
   • État du réseau d'accès
   • Accès Wifi State
   • l'Internet

   Bien que les deux dernières autorisations soient nécessaires pour télécharger des données Maps. Lisez les autorisations sur Android pour en savoir plus. C'est toutes les étapes pour la configuration Android.

   Remarque : si vous souhaitez exécuter votre application sur Android simulator, vous devez y installer les services Google Play. Suivez ce tutoriel pour installer Play Services sur Xamarin Android Player. Si vous ne trouvez pas la mise à jour des services Google Play après l'installation de Play Store, vous pouvez la mettre à jour directement depuis votre application, où vous êtes dépendant des services de cartes.

Ajouter une carte

L'ajout d'une vue cartographique à votre projet de plateforme croisée est assez simple. Voici un exemple de la façon dont vous pouvez le faire (j'utilise un projet PCL sans XAML).

Projet PCL

Fichier MapExample.cs

public class App : Application
{
    public App()
    {
        var map = new Map();
        map.IsShowingUser = true;

        var rootPage = new ContentPage();
        rootPage.Content = map;

        MainPage = rootPage;
    }
}

C'est tout. Maintenant, si vous exécutez votre application sur iOS ou Android, la carte s'affiche: