I am trying to get a TabbedPage to work correctly, i.e. I want the menu to be shown at the bottom:
<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="App.View.TabbedPageNavigation"
xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
xmlns:tabView="clr-namespace:Syncfusion.XForms.TabView;assembly=Syncfusion.SfTabView.XForms"
android:TabbedPage.ToolbarPlacement="Bottom"
xmlns:local="clr-namespace:App.View">
<TabbedPage.Children>
<local:HikeList Title="My Hikes">
<local:HikeList.Icon>
<OnPlatform x:TypeArguments="FileImageSource">
<On Platform="iOS, Android" Value="iconmydiaries.png"/>
</OnPlatform>
</local:HikeList.Icon>
</local:HikeList>
<local:HikeList Title="Friends">
<local:HikeList.Icon>
<OnPlatform x:TypeArguments="FileImageSource">
<On Platform="iOS, Android" Value="iconfriendsdiaries.png"/>
</OnPlatform>
</local:HikeList.Icon>
</local:HikeList>
<local:SettingsPage Title="Settings" Icon="iconsettings.png">
<local:SettingsPage.Icon>
<OnPlatform x:TypeArguments="FileImageSource">
<On Platform="iOS, Android" Value="iconsettings.png"/>
</OnPlatform>
</local:SettingsPage.Icon>
</local:SettingsPage>
</TabbedPage.Children>
</TabbedPage>
The problem is, that the icons look like in the following image: TabbedMenu Bottom
The interesting thing is that if I remove the line with the "ToolbarPlacement", the images are being rendered just fine (except they of course appear at the top of the page). Note also that the size of the menu items is different, so it seems as if the images are actually being loaded however they are rendered incorrectly. Does anyone know what happens there and how I can fix the problem?
Thanks in advance!