Xamarin Forms Master Detail Page Icon, and Menu Icon - master-detail

Question

I'm following the instructions here;
https://www.syntaxismyui.com/xamarin-forms-masterdetail-page-navigation-recipe/
The navigation bar icon is placed too far to the right by default. Is there a way to center it on the navigation bar? The hamburger menu icon is also pushed far to the right.
EDIT: I added a picture for an example of what I have. Funny thing, in another app the icon is all the way to the left.
EDIT:
Here's the code:
public class RootPage : MasterDetailPage
{
MenuPage menuPage;
public RootPage()
{
menuPage = new MenuPage();
menuPage.Menu.ItemSelected += (sender, e) => NavigateTo(e.SelectedItem as MenuItem);
Master = menuPage;
NavigationPage page = new NavigationPage(new Home());
page.BarBackgroundColor = Color.FromHex("#56198E");
Detail = page;
}
void NavigateTo(MenuItem menu)
{
if (menu == null)
return;
Page displayPage = (Page)Activator.CreateInstance(menu.TargetType);
NavigationPage page = new NavigationPage(displayPage);
page.BarBackgroundColor = Color.FromHex("#56198E");
Detail = page;
menuPage.Menu.SelectedItem = null;
IsPresented = false;
}
}
public class MenuPage : ContentPage
{
public ListView Menu { get; set; }
public MenuPage()
{
Icon = "settings.png";
Title = "menu"; // The Title property must be set.
BackgroundColor = Color.FromHex("#56198E");
Menu = new MenuListView();
var menuLabel = new ContentView
{
Padding = new Thickness(10, 36, 0, 5),
Content = new Label
{
TextColor = Color.FromHex("#C8C8C8"),
Text = "MENU",
}
};
var layout = new StackLayout
{
Spacing = 0,
VerticalOptions = LayoutOptions.FillAndExpand
};
layout.Children.Add(menuLabel);
layout.Children.Add(Menu);
Content = layout;
}
}
public class MenuListView : ListView
{
public MenuListView()
{
List<MenuItem> data = new MenuListData();
ItemsSource = data;
VerticalOptions = LayoutOptions.FillAndExpand;
BackgroundColor = Color.Transparent;
// SeparatorVisibility = SeparatorVisibility.None;
var cell = new DataTemplate(typeof(MenuCell));
cell.SetBinding(MenuCell.TextProperty, "Title");
cell.SetBinding(MenuCell.ImageSourceProperty, "IconSource");
ItemTemplate = cell;
}
}
public class MenuListData : List<MenuItem>
{
public MenuListData()
{
this.Add(new MenuItem()
{
Title = " Home",
IconSource = "Home.png",
TargetType = typeof(Home)
});
this.Add(new MenuItem()
{
Title = " Register for Classes",
IconSource = "Calendar.png",
TargetType = typeof(Register)
});
this.Add(new MenuItem()
{
Title = " Search Instructors",
IconSource = "ContactsSearch.png",
TargetType = typeof(SearchInstructors)
});
}
}
public class MenuItem
{
public string Title { get; set; }
public string IconSource { get; set; }
public Type TargetType { get; set; }
}

Answer 1

I would recommend trying different icon sizes. I was having some issues myself when the image was too large. In my tests I was originally using a 144x144 image and it worked correctly most of the time. When I attempted a 700x700 pixel image it was dead center and I would lose my title.
Screen Resolution - 768x1280
App Icon
144x144 - Slightly away from flush next to the Menu Icon
700x700 - Center
Menu Icon -44x44 (and always flush to the left)