Xamarin.forms: [Spec] Shell Scenarios

Created on 15 Nov 2019 · 2Comments · Source: xamarin/Xamarin.Forms

Shell Scenarios

Currently the shell Xaml structure isn't as declarative as it could be when putting together your structures. It would be ideal to enable the ability to create scenarios that allow developers to describe workflows.

https://github.com/xamarin/Xamarin.Forms/issues/6950
https://github.com/xamarin/Xamarin.Forms/issues/6139
https://github.com/xamarin/Xamarin.Forms/issues/5272

Currently if users want to represent a Login scenario (very typical) they do so like this

<!-- When the user is on this Login Page they won't see a flyout menu-->
<TabBar Route="LoginPage">
    <local:LoginPage/>
</TabBar>

<!-- When the user is here they won't be able to get back to the Login Page-->
<FlyoutItem Route="LoggedIn">
     <UserPages/>
</FlyoutItem>
<FlyoutItem>
     <UserPages/>
</FlyoutItem>

It's very confusing that the top part and the bottom part are mutually exclusive. Out of the box we could provide a default layout scenario that just indicates what layouts you want active

<LayoutScenario Route="Anonymous">
     <!-- When the user is on this Login Page they won't see a flyout menu-->
     <TabBar Route="LoginPage">
         <local:LoginPage/>
     </TabBar>
</LayoutScenario>

<LayoutScenario Route="Employee">
     <!-- When the user is here they won't be able to get back to the Login Page-->
     <FlyoutItem Route="LoggedIn">
          <UserPages/>
     </FlyoutItem>
     <FlyoutItem>
          <UserPages/>
     </FlyoutItem>
</LayoutScenario>

<LayoutScenario Route="Admin">
     <!-- When the user is here they won't be able to get back to the Login Page-->
     <FlyoutItem Route="LoggedIn">
          <UserPages/>
     </FlyoutItem>
     <FlyoutItem>
          <UserPages/>
     </FlyoutItem>
     <FlyoutItem>
          <AdminPages />
     </FlyoutItem>
</LayoutScenario>

Then we would enable these scenarios along the same line as the MVVM hooks we are building here
https://github.com/xamarin/Xamarin.Forms/issues/5166

So users could register a service for a Scenario and then that service could handle everything outlined in #5166 before it passes things up to the NavigationService

Scenarios

Authentication Scenario (this would not be part of core it's just demonstrating capabilities)

<AuthenticationScenario Route="Anonymous">
     <!-- When the user is on this Login Page they won't see a flyout menu-->
     <TabBar Route="LoginPage">
         <local:LoginPage/>
     </TabBar>
</AuthenticationScenario>

<LayoutScenario Route="Employee">
     <!-- When the user is here they won't be able to get back to the Login Page-->
     <FlyoutItem Route="LoggedIn">
          <UserPages/>
     </FlyoutItem>
     <FlyoutItem>
          <UserPages/>
     </FlyoutItem>
</LayoutScenario>

See https://github.com/xamarin/Xamarin.Forms/issues/5166 for description of these interfaces
```C#
public class ShellScenario : IShellNavigationRequest, IShellContentCreator, IShellApplyParameters, IShellPartAppearing, IShellPartAppeared, IShellPartDisappeared
{

}

///third part scenario
public class AuthenticationScenario : ShellScenario
{

}

## Custom Scenarios with custom Xaml types

```XAML
<Shell>
  <StackScenario>
    <ShellContent Route="Login" ContentTemplate="{DataTemplate LoginPage}"/>
    <ShellContent Route="Registration" ContentTemplate="{DataTemplate RegistrationPage}"/>
    <ShellContent Route="ForgotPassword" ContentTemplate="{DataTemplate ForgotPasswordPage}"/>
  </StackScenario>
</Shell>

In this scenario we would provide a custom XAML type and then developers could just control all the interactions themselves inside DrillDownNavigationScenario

<DrillDownNavigationScenario>
    <DrillDownContent ContentTemplate="{ShellItem1}">
        <DrillDownContent ContentTemplate="{ShellItem2}">
            <DrillDownContent ContentTemplate="{ShellItem3}">
                <DrillDownContent ContentTemplate="{ShellContent4}"/>
            </DrillDownContent >
        </DrillDownContent >
    </DrillDownContent >
</DrillDownNavigationScenario>