Xamarin.Forms
Werken met kaarten

Opmerkingen

Een kaart toevoegen in Xamarin.Forms (Xamarin Studio)

U kunt eenvoudig de native map API's op elk platform met Xamarin Forms gebruiken. Het enige dat u nodig hebt, is om het Xamarin.Forms.Maps- pakket van nuget te downloaden en op elk project te installeren (inclusief het PCL-project).

Initialisatie van kaarten

Allereerst moet u deze code toevoegen aan uw platformspecifieke projecten. Hiervoor moet u de methode-aanroep Xamarin.FormsMaps.Init toevoegen, zoals in de onderstaande voorbeelden.

iOS-project

Bestand 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);
    }
}

Android-project

Bestand 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());
    }
}

Platform configuratie

Op sommige platforms zijn extra configuratiestappen vereist voordat de kaart wordt weergegeven.

iOS-project

In iOS-project hoeft u slechts 2 vermeldingen toe te voegen aan uw Info.plist- bestand:

• NSLocationWhenInUseUsageDescription string met waarde We are using your location
• NSLocationAlwaysUsageDescription string met waarde Can we use your location

Android-project

Om Google Maps te gebruiken, moet u een API-sleutel genereren en deze aan uw project toevoegen. Volg de onderstaande instructie om deze sleutel te krijgen:

1. (Optioneel) Zoek waar de locatie van uw keytool-tool is (standaard is /System/Library/Frameworks/JavaVM.framework/Versions/Current/Commands )

2. (Optioneel) Open terminal en ga naar uw keytool-locatie:

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

3. Voer de volgende keytool-opdracht uit:

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

   Waar [USERNAME] uiteraard uw huidige gebruikersmap is. Je zou iets dergelijks in de uitvoer moeten krijgen:

   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. Het enige dat we in deze uitvoer nodig hebben, is de vingerafdruk van het SHA1-certificaat. In ons geval is dit gelijk aan:

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

   Kopieer of bewaar deze sleutel ergens. We hebben het later nodig.

5. Ga naar Google Developers Console , in ons geval moeten we Google Maps Android API toevoegen , dus kies het:

6. Google zal u vragen om een project te maken om API's in te schakelen, volg deze tip en maak het project:

7. Schakel Google Maps API in voor uw project: Nadat u api hebt ingeschakeld, moet u referenties voor uw app maken. Volg deze tip:

8. Kies op de volgende pagina het Android-platform en tik op "Welke gegevens heb ik nodig?" knop, maak een naam voor uw API-sleutel, tik op "Voeg pakketnaam en vingerafdruk toe", voer uw pakketnaam en uw SHA1-vingerafdruk in vanaf stap 4 en maak tenslotte een API-sleutel: Om uw pakketnaam in Xamarin Studio te vinden, gaat u naar uw .Droid-oplossing -> AndroidManifest.xml:

9. Na het maken kopieert u de nieuwe API-sleutel (vergeet niet om op de knop "Gereed" te drukken) en plak deze in uw AndroidManifest.xml bestand: Bestand 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>        
   

   U moet ook enkele machtigingen in uw manifest inschakelen om enkele extra functies in te schakelen:

   • Toegang tot ruwe locatie
   • Toegang fijne locatie
   • Toegang tot locatie Extra opdrachten
   • Toegang tot Mock Location
   • Toegang netwerkstatus
   • Toegang wifi staat
   • internet

   Hoewel, de laatste twee machtigingen zijn vereist om Maps-gegevens te downloaden. Lees meer over Android-machtigingen voor meer informatie. Dat zijn alle stappen voor de Android-configuratie.

   Opmerking : als u uw app op Android-simulator wilt uitvoeren, moet u Google Play Services erop installeren. Volg deze tutorial om Play Services te installeren op Xamarin Android Player. Als u de update van Google Play-services niet kunt vinden na de installatie van de Play Store, kunt u deze rechtstreeks bijwerken vanuit uw app, waar u afhankelijk bent van Maps-services

Een kaart toevoegen

Het toevoegen van kaartweergave aan uw platformoverschrijdende project is vrij eenvoudig. Hier is een voorbeeld van hoe u het kunt doen (ik gebruik PCL-project zonder XAML).

PCL-project

BestandsmapVoorbeeld.cs

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

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

        MainPage = rootPage;
    }
}

Dat is alles. Als u uw app nu op iOS of Android uitvoert, wordt de kaartweergave getoond: