在Xamarin中使用谷歌地图

Question

我正在尝试在Xamarin中使用谷歌地图API for Android，到目前为止它已经是一个拉发经验。我对Xamarin是新手，并试图抓住它。我已经测试了一些基本的控件，它们似乎工作得很好。现在我正在尝试使用Google Map Api。根据Xamarin文档，我已经在AndroidManifest.xml中插入了Api键。我在我的Main.axml下面的代码文件

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent"> 
    <fragment 
     android:id="@+id/map" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     class="com.google.android.gms.maps.MapFragment" /> 
</LinearLayout> 

这里是我的活动类

[Activity (Label = "Testing", MainLauncher = true)] 
    public class MainActivity : Android.GoogleMaps.MapActivity 
    { 

     protected override bool IsRouteDisplayed { 
      get { 
       return false; 
      } 
     } 

     protected override void OnCreate (Bundle bundle) 
     { 
      base.OnCreate (bundle); 


      SetContentView (Resource.Layout.Main); 

      // Get our button from the layout resource, 
      // and attach an event to it 
      //Button button = FindViewById<Button> (Resource.Id.myButton); 

      //button.Click += delegate { 
      // button.Text = string.Format ("{0} clicks!", count++); 
      //}; 
     } 
    } 

当我运行它抛出一个异常

Android.Views.InflateException: Loading 

上面的代码我不没有像我们通常在VS中那样获得错误的任何细节。我不知道什么是错误的我只是在盲目追踪文档以便在屏幕上看到某些内容，然后使用它进行播放，但这种情况不会很快发生！

我针对此测试项目的Google API版本8。

请建议我在这里错过什么？

Answer 1

如果您正在使用谷歌地图V2，看看这个页面： http://components.xamarin.com/view/googleplayservices/

如果你的目标API 8，不要忘记引用Mono.Android.Support.v4 assemly，和相应地使用元素！

这里是我的布局看起来像：

<FrameLayout 
     android:id="@+id/mapView" 
     android:layout_width="fill_parent" 
     android:layout_height="match_parent" 
     android:clickable="true" 
     android:longClickable="true" 
     android:layout_below="@+id/textLayout" 
     android:layout_above="@+id/footerLayout" /> 

而我的等级：

public class GoogleMapActivity : Android.Support.V4.App.FragmentActivity 
{ 
     protected override void OnCreate(Bundle bundle) 
     { 
     var fragTx = SupportFragmentManager.BeginTransaction(); 
     var mapFragment = Android.Gms.Maps.SupportMapFragment.NewInstance(mapOptions); 
     fragTx.Add(Resource.Id.mapView, mapFragment, "mapView"); 
     fragTx.Commit(); 
     } 
} 

Answer 2

这是不完全回答你的问题，但替代;

我一直在使用OpenStreetMaps与leaflet和/或mapbox使用xamarin而不是android。虽然我不确定你是否可以过滤加油站等。

这是我用来呈现移动地图的代码片段;

public class MainActivity : Activity//, ILocationListener 
{ 
    private WebView _webView; 
    private MonkeyWebViewClient _webViewClient; 
    private MonkeyWebChromeClient _webChromeClient; 

    ... 

    protected override void OnCreate (Bundle bundle) 
    { 
     Log.Verbose (LogAppTag, "Init webview.."); 
     _webView = FindViewById<WebView> (Resource.Id.webView1); 
     _webView.Settings.JavaScriptEnabled = true; 

     _webViewClient = new MonkeyWebViewClient (this); 
     _webChromeClient = new MonkeyWebChromeClient(); 
     _webViewClient.OnLoadComplete += WebLoadComplete; 

     _webView.SetWebViewClient(_webViewClient); 
     _webView.SetWebChromeClient(_webChromeClient);  

     _webView.LoadUrl("file:///android_asset/Content/Map/Map.html"); 

    ... 

    void WebLoadComplete (object sender, EventArgs e) 
    { 
     Log.Verbose(Logging.AppTag, "WebLoadComplete()"); 
     _webView.LoadUrl("javascript:SetLocation(" + _location.Latitude + "," + _location.Longitude + ");");  
    } 
    ... 
    class MonkeyWebChromeClient : WebChromeClient { 
     public override bool OnJsAlert(WebView view, string url, string message, JsResult result) 
     { 
      // the built-in alert is pretty ugly, you could do something different here if you wanted to 
      return base.OnJsAlert(view, url, message, result); 
     } 
    } 

    class MonkeyWebViewClient : WebViewClient 
    { 
     public bool LoadingFinished { get; private set; } 

     public delegate void LoadCompleteHandler(object sender, EventArgs e); 
     public event LoadCompleteHandler OnLoadComplete; 

     Activity context; 

     public MonkeyWebViewClient(Activity context) 
     { 
      this.context = context; 
     } 
     public override bool ShouldOverrideUrlLoading(WebView view, string url) 
     { 
      view.LoadUrl (url); 
      return true; 
     } 

     public override void OnPageStarted (WebView view, string url, Android.Graphics.Bitmap favicon) 
     { 
      this.LoadingFinished = false; 
      base.OnPageStarted (view, url, favicon); 
     } 

     public override void OnPageFinished (WebView view, string url) 
     { 
      this.LoadingFinished = true; 

      var handler = OnLoadComplete; 
      if (handler != null) handler(this, EventArgs.Empty); 

      base.OnPageFinished (view, url); 
     } 
    } 

这里是我们在webview中加载的html代码;

<html> 
<head> 
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 
<!-- mapbox --> 
<script src='http://api.tiles.mapbox.com/mapbox.js/v1.3.1/mapbox.js'></script> 
<link href='http://api.tiles.mapbox.com/mapbox.js/v1.3.1/mapbox.css' rel='stylesheet' />  
<!-- mapbox --> 
    </head> 
<style> 
    body { 
     padding: 0; 
     margin: 0; 
    } 
    html, body, #map { 
     height: 100%; 
    } 
</style> 
<div id="map"></div>   
<script src="JS/Map.js"></script>   
</html> 

并且可以与C＃代码进行通信的JS代码;你可能想要在mapbox上创建一个新地图并更改raistlinthewiz.map-oukwofv3部分。

// map code.    
function SetLocation(lat, lng) 
{ 
    var latlng = new L.LatLng(parseFloat(lat), parseFloat(lng)); 

    // mapbox 
    var map = L.mapbox.map('map', 'raistlinthewiz.map-oukwofv3').setView(latlng, 18);     

    L.mapbox.markerLayer({ // this feature is in the GeoJSON format: see geojson.org for the full specification 
     type: 'Feature', 
     geometry: { 
      type: 'Point', // coordinates here are in longitude, latitude order because x, y is the standard for GeoJSON and many formats 
      coordinates: [parseFloat(lng), parseFloat(lat)] 
     }, 
     properties: { // one can customize markers by adding simplestyle properties http://mapbox.com/developers/simplestyle/ 
      title: 'A Single Marker', 
      description: 'Just one of me',    
      'marker-size': 'large' 
     } 
    }).addTo(map); 
} 

如果您还需要，我可以提供一个使用香草叶的样本。