question

GloryDiv-9453 avatar image
1 Vote"
GloryDiv-9453 asked njurunjoroge rolled back

Navigating to another shell page outside AppShell in .Net MAUI

I have a project with 5 Bottomtabs. The first tab shows a CollectionView of items users have to select. After selecting an item i want the user to be navigated onto another page, shellPage, which has 3 top tabs. Navigating onto a single Contentpage works fine but another shell or even a TabbedPage is not working. Below are the errors or feedbacks i got solving the problem of navigating onto the other shellPage.

The efforts i made
I wrapped AppShell in a NavigationPage as MainPage =new NavigationPage( new AppShell());
1. using `App.Current.MainPage.Navigation.PushModalAsync(new anotherShellPage());' or Shell.Current.Navigation.PushAsync($"{typeof(anotherShellPage)}"); to
navigate.
error : System.InvalidCastException: 'Specified cast is not valid.'
2. using Navigation.PushAsync(new NavigationPage(new anotherShellPage())); or App.Current.MainPage.Navigation.PushModalAsync(new anotherShellPage());
error :Java.Lang.IllegalArgumentException: 'DrawerLayout must be measured with MeasureSpec.EXACTLY.'. Here the new AppShell was without new NavigationPage() wrap.

What seems to be working
3. Using App.Current.MainPage.Navigation.PushAsync(new anotherShellPage()); navigates alright. But when the backbutton is pressed to navigate back to the ShellApp i get this error :Java.Lang.IllegalArgumentException: 'No view found for id 0x3 (unknown) for fragment ShellSectionRenderer{cce9fa} (143e32bb-f7d2-4698-bfcd-2d94c8d7d6bc id=0x3)'

  1. using App.Current.MainPage.Navigation.PushModalAsync(new anotherShellPage()); also navigates but before navigating the navigation bar of the AppShell pulls down before navigating and after pressing the back button app closes without moving back to the AppShell/root page.

  2. I aslso tried to create <tab> 3 top pages here </tab> outside the main <TabBar> in the AppShell.xaml so i forget about the anotherShellPage. This also navigates alright but the back buttom closes the app.


I just want to be able to move from one shellPage to another shellPage or TabbedPage and back. In real world an app with navigation like Besoccer app. Thank you.



dotnet-maui
· 6
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Navigating onto a single Contentpage works fine but another shell or even a TabbedPage is not working.

I don't quite understand what you mean by words but another shell or even a TabbedPage is not working. What's wrong or not working? Can you explain that in detail? And how can we reproduce your problem? If it is convinient for you, could you please post a basic demo so that we can try to reproduce this problem on our side?
0 Votes 0 ·

@ JessieZhang-2116 hi. My whole problem is to navigate from one shell page onto another shell page with a button click

Codes from App.xaml.cs

 public App()
  {
  InitializeComponent();
  MainPage = new NavigationPage(new AppShell()); // Without this experience is very bad
  }

Codes from AppShell.xaml.cs

  public AppShell()
     {
         InitializeComponent();
       //  Routing.RegisterRoute(nameof(AnotherShellPage), typeof(AnotherShellPage));               
         myTab.CurrentItem = mon;        
     }

Codes from AppShell.xaml

 <TabBar x:Name="myTabBar" >
         <Tab x:Name="myTab"  Route="homeTab" >            
             <ShellContent x:Name="mon" Title="Tue" ContentTemplate="{DataTemplate days:MondayPage}" />
             <ShellContent Title="Wed" ContentTemplate="{DataTemplate days:TuesdayPage}" />            
         </Tab>
    <TabBar>

Codes from MondayPage.xaml.cs
Here MondayPage has just a button to navigate unto AnotherShellPage

 private void Navigate_To_AnotherShellPage_Clicked(object sender, EventArgs e)
     {     /*What should be here to make navigation successfull unto AnotherShellPage and also smooth back button navigation unto AppShell.xaml*/
        // Shell.Current.GoToAsync($"{typeof(AnotherShellPage)}");
         Application.Current.MainPage.Navigation.PushModalAsync( new AnotherShellPage);  //This worsk but i will need the nav panel and there is back button problem      
     }

AnotherShellPage is a shell page with both button and top tabs for different activites. I've tried many ways a few are those i have commented.

0 Votes 0 ·

Do you mean you want to navigate to another app from current app ?If yes, you can use dependency injection to achieve this.

0 Votes 0 ·

No not a different app. Am talking about same app

0 Votes 0 ·
Show more comments

1 Answer

JamesMontemagno-7652 avatar image
0 Votes"
JamesMontemagno-7652 answered njurunjoroge rolled back

You will want to use Shell navigation which is based on URI's https://docs.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/shell/navigation

and also here is a video I did on it https://www.youtube.com/watch?v=8iYpLMKE_ws

· 1
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

@JamesMontemagno-7652 Thank you for your answer . Inside MyCofeeApp navigating unto AddMyCoffePage is perfect since it is a single page(ContentPage). Assuming AddMyCoffePage is another shellPage / TabbedPage thats where my problem comes. I just changed AddMyCoffePage to a Shell and i got this error.Java.Lang.IllegalArgumentException: 'DrawerLayout must be measured with MeasureSpec.EXACTLY.'. And under what i stated above as What seems to be working after navigating onto the second shell page the Navigation.NavigationStack value is 1 so u cant go back and a whole lot if you still work around that. Results from .Net Maui is different and better than that of Xamarin anyway.

2 Votes 2 ·