使用xamarin form shell创建bet188地址流

shellloginapp.

自发布以来Xamarin Forms 4.5,shell现在支持模态导航。因为我的一个排名最高的博客帖子如何使用Xamarin表单创建bet188地址页面。我以为是时候重新审视主题并查看如何使用shell实现bet188地址页面。

那么bet188地址页面是如此特别?好吧,要说明,用户应该只能在输入正确的bet188地址后退出它。此外,用户不应该能够离开bet188地址页面,即导航回上一页。最后一次成功认证,用户在导航时不应找到bet188地址页面。如果您正在寻找具有后端的身份验证方案,请查看此内容Blogpost..

所以,让我们看看我们如何在页面上捕获用户,然后确保使用shell的导航堆栈中不再在导航堆栈上。所以,让我们参加可能的bet188地址体验的UI流程。我们的应用程序有以下屏幕流程:

pageflow.

All of our pages have to be registered with the Shell. Note that the first ContentPage in the Shell.xaml file is the one getting displayed after start-up. So our Shell is structured accordingly:



    








我们的加载屏幕主要模拟用户是否具有有效凭据。如果该应用程序在业务逻辑方面并不伪造。它可能是使用基于令牌的流程;这是一个人检查应用程序是否仍然具有有效令牌,并且可以直接转到主屏幕或用户bet188地址。

loadingpage.

美丽的载荷动画,对吗? ðÿ〜‰,这里是视图模型中的缩减逻辑:

// Called by the views OnAppearing method
public async void Init()
{
    var isAuthenticated = await this.identityService.VerifyRegistration();
    if (isAuthenticated)
    {
        await this.routingService.NavigateTo("///main");
    }
    else
    {
        await this.routingService.NavigateTo("///login");
    }
}

注意,我们只告诉shell导航到bet188地址屏幕。使用shell时,您可以定义目标页面上的导航类型。所以对于bet188地址页面,我们会像这样设置:



    ...

无论何时,当您重模播放时,它总是一个好主意,覆盖目标页面后面的代码中的后按钮导航,如下所示:

protected override bool OnBackButtonPressed()
{
    return true;
}

为什么?好吧,因为否则所有的Android用户都可以只需按下Android Back按钮,并将其仔细制作的bet188地址过程中的方式。现在让...添加注册页面。在这里,我们定义了标准推送导航:

?xml version="1.0" encoding="utf-8" ?>

    
        
    
    ...

Before we can navigate to the registration page, we have to register the page with the Shell. We can do this in the code behind of the AppShell.xaml.cs file:

Routing.RegisterRoute("registration", typeof(RegistrationPage));

现在我们可以按如下方式从bet188地址页面导航到注册页面:

Shell.Current.GoToAsync("//login/registration");

The code above implements the default navigation behaviour, i.e. a back button on the top left or by using the back button on Android. So as soon as the user has logged in, we display the main page of the app. Which is again defined in the AppShell.xaml as follows:



    

由于它不是bet188地址页面的一部分,Shell自动删除bet188地址页面形成导航堆栈。

So now that we are in the app. Sometimes you will want to present the user with the option to logout. Shell gives us an easy way to define a flyout menu. In Non-Shell apps, this is usually done with the MasterDetailPage. So a nice place to add our logout is as a new entry in the flyout right? Instead of defining a flyout item, it will be better to use a menu item. In general think of flyout items as areas of your app and menu items as actions in the menu. The logout is less an area and more an action. So for our logout, we define a menu item like this:


The Command and Binding context get defined in the code behind, i.e. the App.xaml.cs:

public AppShell()
{
    InitializeComponent();// ... routes and stuff
    BindingContext = this;
}

public ICommand ExecuteLogout => new Command(async () => await GoToAsync("main/login"));

根据您的应用程序的要求,您可能希望强制使用用户在不同时间bet188地址。这可能是在启动期间,恢复或周二下雨。无论要求如何,您只需调用类似于上述导航,并且用户将导航到bet188地址屏幕。一旦成功bet188地址,用户将返回到打开bet188地址页面的页面。

结论

With the new modal navigation mode of Shell, the implementation of a Login screen can be done quite nicely and with a lot less worrying about the state of the navigation stack. One of the main differences between using a NavigationPage compared to the Shell is how you configure the different parts within the AppShell.xaml. The Xamarin team has mentioned that more goodness should come to Shell, so be sure to stay tuned and watch out for news on the Xamarin博客关于新的更新和功能。

您可以找到整个样本GitHub.。并退房大卫奥提南™样本启发了这篇文章。

Hth.

更新: