Navigation PushModalAsync not working inside of event inside ListView - xamarin

Question

I have a list view with item template formed of several elements, one of them is a frame with TapGestureRecognizer added to it as the following example:
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid Margin="10,5" HorizontalOptions="FillAndExpand" RowSpacing="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<!-- Other Element -->
<Frame x:Name="SampleFrame" Grid.Column="1"/>
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
public TVEntryItem()
{
InitializeComponent();
var TapGesture = new TapGestureRecognizer();
TapGesture.Tapped += TapGesture_Tapped;
SampleFrame.GestureRecognizers.Add(TapGesture);
}
private void TapGesture_Tapped(object sender, EventArgs e)
{
Navigation.PushModalAsync(new DetailedView());
}
Now when I tap on the frame the event is called indeed and a new instance of DetailedView is created -Verified by break point in the DetailedView constructor function-, but the page itself is never displayed, and the break point inside the DetailedView OnAppearing is never hit.
What am I missing here ?! Any suggestions ?! Thanks in advance ^^.

Answer 1

In your case , the Frame is in a ViewCell , so it will never if you handle it in ContentPage directly .
Firstly , make sure that the MainPage of the App is a NavigationPage
in App.xaml.cs
public App()
{
InitializeComponent();
MainPage = new NavigationPage(new xxxPage());
}
If you want to add a TapGesture on the frame , you could check the following code .
in 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"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
x:Name="Page" // set the name of contentpage here
x:Class="xxx.xxxPage">
<Frame Grid.Column="1" BackgroundColor="Red">
<Frame.GestureRecognizers>
<TapGestureRecognizer Command="{Binding Source={x:Reference Page}, Path=BindingContext.TapCommand}" />
</Frame.GestureRecognizers>
</Frame>
in ContentPage
public xxxPage()
{
InitializeComponent();
BindingContext = new xxxViewModel(this.Navigation);
}
in ViewModel
public class xxxViewModel
{
public ICommand TapCommand { get; private set; }
INavigation Navigation;
public MyViewModel(INavigation navigation)
{
this.Navigation = navigation;
TapCommand = new Command(()=> {
Navigation.PushModalAsync(new Page1());
});
// other code ,like setting itemsource of listview
}
}

Answer 2

Thanks to Lucas Zhang - MSFT's answer, I could come up with a solution. As he described, I cannot call navigation service inside a ViewCell, so, simply, I called the navigation service from the main page instead.
private void TapGesture_Tapped(object sender, EventArgs e)
{
App.Current.MainPage.Navigation.PushModalAsync(new DetailedView());
}

Answer 3

Try this one
Navigation.PushModalAsync(new NavigationPage(new DetailedView()));