I have the following MainActivity.cs class:
Xamarin.Forms.Forms.Init(this, bundle);
Xamarin.FormsMaps.Init(this, bundle);
FormsAppCompatActivity.ToolbarResource = Resource.Layout.toolbar;
FormsAppCompatActivity.TabLayoutResource = Resource.Layout.tabs;
ViewerApplication a = new ViewerApplication();
App = a;
ViewerApplication.cs class:
public class ViewerApplication : Application, IMapApplication, IJobApplication
{
// The root page of your application
this.MainPage = new MapManagerPage();
}
MapManagerPage.xaml:
<?xml version="1.0" encoding="UTF-8"?>
<MasterDetailPage
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:app="clr-namespace:Synchronoss.Platform.Gui.Forms.Views;assembly=Synchronoss.Platform.Gui.Forms"
x:Class="ROAMviewer.Views.MapManagerPage">
<MasterDetailPage.Resources>
<ResourceDictionary>
<FileImageSource x:Key="EntitiesIcon" File="searchtoolbar.png" />
<FileImageSource x:Key="FieldJobsIcon" File="browserwindowstoolbar.png" />
<FileImageSource x:Key="PlacesIcon" File="maptoolbar.png" />
<FileImageSource x:Key="LayersIcon" File="layers2toolbar.png" />
</ResourceDictionary>
</MasterDetailPage.Resources>
<MasterDetailPage.Master>
<TabbedPage x:Name="Tabs" Title="Detail">
<TabbedPage.Children>
<NavigationPage Title="Features" Icon="{StaticResource EntitiesIcon}">
<x:Arguments>
<app:EntityPage x:Name="EntityPage" Title="Search" Icon="{StaticResource EntitiesIcon}" />
</x:Arguments>
</NavigationPage>
<NavigationPage Title="Field Jobs" Icon="{StaticResource FieldJobsIcon}">
<x:Arguments>
<app:FieldJobsPage x:Name="FieldJobsPage" Title="Field Jobs" Icon="{StaticResource FieldJobsIcon}" />
</x:Arguments>
</NavigationPage>
<NavigationPage Title="Places" Icon="{StaticResource PlacesIcon}">
<x:Arguments>
<app:PlacesPage x:Name="PlacesPage" Title="Places" Icon="{StaticResource PlacesIcon}" />
</x:Arguments>
</NavigationPage>
<NavigationPage Title="Layers" Icon="{StaticResource LayersIcon}">
<x:Arguments>
<app:LayerPage x:Name="LayerPage" Title="Layers" Icon="{StaticResource LayersIcon}" />
</x:Arguments>
</NavigationPage>
</TabbedPage.Children>
</TabbedPage>
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
<NavigationPage Title="Map">
<x:Arguments>
<app:MapPage Title="Map" />
</x:Arguments>
</NavigationPage>
</MasterDetailPage.Detail>
</MasterDetailPage>
MapPage.xaml (which is the MasterDetailPage.Detail):
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="Platform.Gui.Forms.Views.MapPage">
<ContentPage.Resources>
<ResourceDictionary>
<FileImageSource x:Key="SettingsIcon" File="geartoolbar.png"/>
<FileImageSource x:Key="LocateIcon" File="locationtoolbar.png"/>
<FileImageSource x:Key="HelpButton" File="questiontoolbar.png"/>
</ResourceDictionary>
</ContentPage.Resources>
<ContentPage.ToolbarItems>
<ToolbarItem x:Name="SettingsButton" Icon="{StaticResource SettingsIcon}" Order="Default"/>
<ToolbarItem x:Name="LocateButton" Icon="{StaticResource LocateIcon}" Order="Default"/>
<ToolbarItem x:Name="HelpButton" Icon="{StaticResource HelpButton}" Order="Default"/>
</ContentPage.ToolbarItems>
</ContentPage>
MapPage.xaml.cs class (this is how I'm rendering the map):
DroidMap map = new DroidMap(MapSpan.FromCenterAndRadius(new Position(-37.814107, 144.814107), Distance.FromMiles(0.3)))
{
IsShowingUser = true,
HeightRequest = 100,
WidthRequest = 960,
VerticalOptions = LayoutOptions.FillAndExpand
};
Content = _droidMap;
This is what happens if I don't load the Google Map (all the controls and the ListView
work properly - see image below this one):
ListView
controls work properly without the map loaded:
And then this is what happens when I do load the map (notice the search bar appearing over the map? That's not the only problem):
When the map is loaded none of the ListView
controls work at all in Master
, it also throws exceptions when I move around in that section. See the video below:
Notice in the video that I can't scroll the map below that strangely rendered search control (almost as if there's a transparent area below that doesn't allow clicks).
Any help would be appreciated as to how to fix this issue. I've tried setting the DroidMap
to a StackLayout
rather than Content
and it has the same issue as well as playing around with Horizontal
and Vertical
options.
To add to this there's a problem where the ContentPage.ToolbarItems
don't appear in Landscape in the MapPage.xaml
. They appear fine when in Portrait though as you can see here (this is regardless of whether the map has been loaded or not):
These ContentPage.ToolbarItems
don't appear in Landscape but appear fine in Portrait:
NOTE: These rendering issues occur on the device and in the Xamarin Android Player.
Here's an update:
When I move the controls around in MapManagerPage.xaml
it renders them on the map (for example I've moved the search bar and placed the ListView
in place of that and it's rendering in the same place):