We Keep Coding

Display a ToolBar in a Xamarin.Forms modal page

The "new" and recommended way to display a modal page with the Xamarin.Forms Shell uri-based navigation is to set this tag in the XAML file (source): Shell.PresentationMode="ModalAnimated"
and to navigate to it by using a standard route and invoking it with the function Shell.Current.GoToAsync("routeToMyPage").
However, this displays the modal page without a toolbar. Without Shell navigation, I would have wrapped this page in a NavigationPage, but since the pages are initialized through reflection (at least that's what it looks like - don't quote me on this), I don't know how to do that.
Adding a ToolbarItem in the page's XAML code doesn't solve this, neither does the Shell.NavBarIsVisible="True" property, and adding a Button in the Shell.TitleView tag doesn't display a toolbar either.
Is there a way to display the default navigation toolbar without rendering a custom one myself?
Here is the XAML code I used to try to have the Toolbar displayed:
<ContentPage
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
Shell.PresentationMode="ModalAnimated"
Shell.NavBarIsVisible="True"
x:Class="StackOverflow.Views.MyModalPage">
<ContentPage.ToolbarItems >
<ToolbarItem Text="Hi"/>
</ContentPage.ToolbarItems>
<Shell.TitleView>
<Button Text="Toolbar Button"/>
</Shell.TitleView>
<ContentPage.Content>
</ContentPage.Content>
</ContentPage>
Edit: I have created a small sample project to showcase my issue: https://github.com/Kuurse/StackOverflowExample

You can first create the NavigationPage root page in the app class:
public partial class App : Application
{
public App()
{
InitializeComponent();
MainPage = new NavigationPage(new MainPage());
}
}
Then set like this in your mainpage.xaml:
<?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="StackOverflow.Views.MyModalPage"
NavigationPage.HasNavigationBar="True">
<ContentPage.ToolbarItems>
<ToolbarItem Text="Hi"/>
</ContentPage.ToolbarItems>
</ContentPage>
By the way, do you want to display only the default navigation toolbar?

Load a Popup Page with a gif while pushing a page stops its movement - Xamarin Forms

I am trying to push a page that is a TabbedPage with 3 tabs that are pages with SfSchedule (a SyncFusion control that take a bit to load).
Becouse it takes long to load, I am using the Rg.Plugins.Popup plugin to push a modal page with a GIF(some characters moving). The problem is that while the TabbedPage is being pushed, the gif stops moving, and once it loads it keeps moving.
I have tried to use another thread to instantiate the page but becouse I have to end up using Device.BeginInvokeOnMainThread to push the page it blocks the gif movement anyway. Also I got to instantiate the page in another thread and then push it using Device.BeginInvokeOnMainThread and what takes time is pushing the page, not instantiating it.
The method that pushes the page and the Popup:
public async void Navegar(Type page)
{
_tipoPagina = page;
await Rg.Plugins.Popup.Services.PopupNavigation.Instance.PushAsync(new LoadingPopUp());
var pagina = (Page)Activator.CreateInstance(_tipoPagina);
await ((NavigationPage)this.Detail).PushAsync(pagina);
await Rg.Plugins.Popup.Services.PopupNavigation.Instance.PopAllAsync();
}
The Popup page:
<?xml version="1.0" encoding="utf-8" ?>
<pages:PopupPage
xmlns:pages="clr-namespace:Rg.Plugins.Popup.Pages;assembly=Rg.Plugins.Popup"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
x:Class="XXXXX.LoadingPopUp">
<StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" BackgroundColor="White">
<Image VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand" Source="loading.gif" IsAnimationPlaying="True"></Image>
</StackLayout>
</pages:PopupPage>
The Page that takes a long time to push:
<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:plugin="clr-namespace:Plugin.Badge.Abstractions;assembly=Plugin.Badge.Abstractions"
xmlns:calendario_vistas="clr-namespace:XXXXX.Calendario_Vistas"
mc:Ignorable="d"
x:Class="XXXXX.Calendario"
Title="Calendario"
NavigationPage.HasNavigationBar="False">
<TabbedPage.Children>
<NavigationPage Title="Día">
<NavigationPage.IconImageSource>
<FontImageSource FontFamily="{StaticResource FASolido}" Glyph="" Size="45"></FontImageSource>
</NavigationPage.IconImageSource>
<x:Arguments>
<calendario_vistas:CalendarioDiario plugin:TabBadge.BadgeText="3"></calendario_vistas:CalendarioDiario>
</x:Arguments>
</NavigationPage>
<NavigationPage Title="Semanal">
<NavigationPage.IconImageSource>
<FontImageSource FontFamily="{StaticResource FASolido}" Glyph="" Size="45"></FontImageSource>
</NavigationPage.IconImageSource>
<x:Arguments>
<calendario_vistas:CalendarioSemanal plugin:TabBadge.BadgeText="10"></calendario_vistas:CalendarioSemanal>
</x:Arguments>
</NavigationPage>
<NavigationPage Title="Listado">
<NavigationPage.IconImageSource>
<FontImageSource FontFamily="{StaticResource FASolido}" Glyph="" Size="45"></FontImageSource>
</NavigationPage.IconImageSource>
<x:Arguments>
<calendario_vistas:CalendarioLista></calendario_vistas:CalendarioLista>
</x:Arguments>
</NavigationPage>
</TabbedPage.Children>
</TabbedPage>
Any help is appreciated.
Thank You.
P.D.: I just realised, if I use the ActivityIndicator, it stays moving all the time, it doesn't stop.
With the activity indicator it works perfect. I just can't get it to play the gif without stopping.
P.D.2: I posted this twice on Xamarin Forms forums and got no answers :(

XAML WebView binding to string not working in Xamarin Forms

I'm new to C# and Xamarin Forms. I'm having a webview and getting source url from an API. (For this question , I have hardcode the value). I binded source url instead of adding the value to Source in XAML. But it's not working. There are few solutions in stack and forums. I tried. But didn't work. Someone please help me to sovle this.
This is my XAML
<?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="MyProject.Views.NewRegistration.PrivacyWebView">
<ContentPage.Content>
<AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<WebView Source="{Binding WebViewSource}" HeightRequest= "300" WidthRequest="250" Navigated="Handle_Navigated" VerticalOptions="FillAndExpand" AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1" />
<ActivityIndicator x:Name="loader" IsRunning="true" IsVisible="true" AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1"/>
</AbsoluteLayout>
</ContentPage.Content>
</ContentPage>
This is how I bind the source. (Tried this in Codebehind and ViewModel too)
public HtmlWebViewSource WebViewSource
{
get
{
return new HtmlWebViewSource { Html = "https://www.stackoverflow.com" };
}
}

You're using it wrong, when using the HtmlWebViewSource you need to specify actual HTML instead of the URL where you want to go to. If you want to navigate to a URL, specify it in the Source property.
If you want to bind it, you have to implement something like this.
In your view model create a string property:
public string UrlToGoTo { get; set; }
Then set it like you normally would, make sure to have INotifyPropertyChanged is implemented somehow.
Then, wire up your WebView like this:
<WebView Source="{Binding UrlToGoTo}"
HeightRequest= "300"
WidthRequest="250"
Navigated="Handle_Navigated"
VerticalOptions="FillAndExpand"
AbsoluteLayout.LayoutFlags="All"
AbsoluteLayout.LayoutBounds="0,0,1,1" />

Xamarin forms maps error :"Not compatable code running

I am trying to create a simple map page using Xamarin forms maps checking this project only on Andorid.
I Installed the Xamarin forms map. and added the Xaml Below,
in addition I've added the in the Android manifest XML all the relavent
premiisions and Key.
however I am getting this error:Not compatable code running the selected debug engine does not support any code executing on the current thread
would appericate any help
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:maps="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps"
x:Class="MashamApp.mapPage" Title="מפה" >
<ContentPage.Content>
</ContentPage.Content>
<Grid>
<maps:Map x:Name="LocationMap"
IsEnabled="True" IsVisible="True"
MapType="Hybrid"
HasScrollEnabled="True"
HasZoomEnabled="True"
HeightRequest="480"
WidthRequest="480"
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand" >
</maps:Map>
</Grid>

As pointed out by Yuri, a content page should only have a single view or layout.
Change your page to look like this:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:maps="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps"
x:Class="MashamApp.mapPage" Title="מפה" >
<Grid>
<maps:Map x:Name="LocationMap"
IsEnabled="True" IsVisible="True"
MapType="Hybrid"
HasScrollEnabled="True"
HasZoomEnabled="True"
HeightRequest="480"
WidthRequest="480"
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand" >
</maps:Map>
</Grid>
</ContentPage>
You don't even need the Grid unless you are going to add more views inside it.
See here for more details

Xamarin Forms: System.Reflection.TargetInvocationException: Exception has been thrown by the target of an invocation

I am struggling with this issue. I created just a simple cross platform page here is XAML code:
<?xml version="1.0" encoding="utf-8" ?>
<CarouselPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="ForTesting.TestPage">
<Label Text="{Binding MainText}" VerticalOptions="Center" HorizontalOptions="Center" />
<ContentPage>
<ContentPage.Padding>
<OnPlatform x:TypeArguments="Thickness" iOS="0,40,0,0" Android="0,40,0,0" />
</ContentPage.Padding>
</ContentPage>
</CarouselPage>
And here is same cross platform page class:
public partial class TestPage: CarouselPage
{
public TestPage()
{
InitializeComponent();
new Label
{
Text = "heelow",
FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label)),
HorizontalOptions = LayoutOptions.Center
};
}
}
For testing I created simple label, but even without label it is doesn't work.
I am calling this page in my MainPage.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:local="clr-namespace:ForTesting;assembly=ForTesting"
x:Class="ForTesting.MainPage"
MasterBehavior="Popover">
<ContentPage.ToolbarItems>
<ToolbarItem x:Name="CClick"
Text="C :"
Order="Primary">
</ToolbarItem>
</ContentPage.ToolbarItems>
<MasterDetailPage.Master>
<local:MasterPage x:Name="masterPage" />
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
<NavigationPage>
<x:Arguments>
<local:TestPage/>
</x:Arguments>
</NavigationPage>
</MasterDetailPage.Detail>
</MasterDetailPage>
And on this line of class: ForTesting.MainPage.xaml.g.cs I am getting error when I am executing program:
public partial class MainPage : global::Xamarin.Forms.MasterDetailPage {
[System.CodeDom.Compiler.GeneratedCodeAttribute("Xamarin.Forms.Build.Tasks.XamlG", "0.0.0.0")]
private global::Xamarin.Forms.ToolbarItem CClick;
[System.CodeDom.Compiler.GeneratedCodeAttribute("Xamarin.Forms.Build.Tasks.XamlG", "0.0.0.0")]
private global::ForTesting.MasterPage masterPage;
[System.CodeDom.Compiler.GeneratedCodeAttribute("Xamarin.Forms.Build.Tasks.XamlG", "0.0.0.0")]
private void InitializeComponent() {
--> this.LoadFromXaml(typeof(MainPage));
}
}
Error:
Unhandled Exception: System.Reflection.TargetInvocationException:
Exception has been thrown by the target of an invocation.
And I have another cross platform page which is same as TestPage.xaml , but it is working when I am executing.

To build upon #Wes answer, you can make the error message clearer by telling Visual Studio to automatically break at any exception:
Go to Debug > Windows > Exception Settings to open the Exception Settings window
Select the checkbox for the base exception System.Exception
Start debugging again.

In general, I've noticed that any syntax errors in XAML may show up as this exception.

You have mistake in your Carousel page
<?xml version="1.0" encoding="utf-8" ?>
<CarouselPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="ForTesting.TestPage">
<Label Text="{Binding MainText}" VerticalOptions="Center" HorizontalOptions="Center" />
<ContentPage>
<ContentPage.Padding>
<OnPlatform x:TypeArguments="Thickness" iOS="0,40,0,0" Android="0,40,0,0" />
</ContentPage.Padding>
</ContentPage>
</CarouselPage>
Carousel page should have only one child, and it should be a ContentPage, you won't be able to add both label and content page. Remove this line
<Label Text="{Binding MainText}" VerticalOptions="Center" HorizontalOptions="Center" />
If you want to have both label and content in a Carousel, I would suggest using something like CarouselView.
EDIT 1
I've create a sample Carousel project with latest Xamarin.Forms (2.2.0.31), I've tested it on iOS and Android and it works. You can use it as a starter to implement your version. I use this control in production app.