第二十四章：页面导航（二）

一时失言乱红尘 2022-02-14 11:50 257阅读 0赞

**动画页面过渡**  
您看到的所有四种方法都可以使用具有bool类型的附加参数的重载：

Task PushAsync(Page page, bool animated)
    Task PushModalAsync(Page page, bool animated)
    Task<Page> PopAsync(bool animated)
    Task<Page> PopModalAsync(bool animated)

如果底层平台支持此类动画，则将此参数设置为true将启用页面过渡动画。 但是，更简单的Push和Pop方法默认启用此动画，因此如果要抑制动画，则只需要这四个重载，在这种情况下，将Boolean参数设置为false。  
在本章结束时，您将看到一些代码，用于在多页应用程序终止时保存和恢复整个页面导航堆栈。 要恢复导航堆栈，必须在程序启动期间创建并导航到这些页面。 在这种情况下，应该抑制动画，并且这些重载对此非常方便。  
如果您提供自己的页面入口动画，则还需要抑制动画，如第22章“动画”中所示。  
但是，一般情况下，您需要使用Push和Pop方法的简单形式。  
**视觉和功能变化**  
NavigationPage定义了几个属性和几个附加的可绑定属性 - 它们可以更改导航栏的外观，甚至可以完全消除它。  
在App类中实例化NavigationPage时，可以设置BarBackgroundColor和BarTextColor属性。 在ModalAndModeless程序中尝试这个：

public class App : Application
    {
        public App()
        {
            MainPage = new NavigationPage(new MainPage())
            {
                BarBackgroundColor = Color.Blue,
                BarTextColor = Color.Pink
            };
        }
    }

各种平台以不同的方式使用这些颜色。 iOS导航栏受两种颜色的影响，但在Android屏幕上，仅显示背景颜色。 所有这些屏幕截图都显示了ModelessPage，但MainPage的顶部区域以相同的方式着色：  
![2019\_04\_14\_151150][2019_04_14_151150]  
平板电脑模式下的Windows 10应用程序与Windows 10 Mobile屏幕非常相似：  
![2019\_04\_14\_151234][2019_04_14_151234]  
另外两个Windows运行时平台也使用BarTextColor，Windows 8.1页面也使用BarBackgroundColor：  
![2019\_04\_14\_151338][2019_04_14_151338]  
NavigationPage类还定义了一个Tint属性，但该属性已被弃用，应该被认为是过时的。  
NavigationPage还定义了四个附加的可绑定属性，这些属性会影响它们所在的特定Page类。 例如，假设您不希望“返回”按钮出现在无模式页面上。 以下是在ModelessPage构造函数中的代码中设置NavigationPage.HasBackButton附加可绑定属性的方法：

public class ModelessPage : ContentPage
    {
        public ModelessPage()
        {
            Title = "Modeless Page";
            NavigationPage.SetHasBackButton(this, false);
            __
        }
    }

在XAML中，您可以这样做：

当然，当您导航到ModelessPage时，导航栏中的“后退”按钮消失了：  
![2019\_04\_14\_151710][2019_04_14_151710]  
但是，Windows 10上仍然存在功能性“后退”按钮：  
![2019\_04\_14\_151816][2019_04_14_151816]  
后退按钮也从Windows 8.1屏幕消失：  
![2019\_04\_14\_151918][2019_04_14_151918]  
NavigationPage的一个更极端附加的可绑定属性完全消除了导航栏，并使页面在视觉上与模态页面无法区分：

public class ModelessPage : ContentPage
    {
        public ModelessPage()
        {
            Title = "Modeless Page";
            NavigationPage.SetHasNavigationBar(this, false);
            __
        }
    }

另外两个附加的可绑定属性会影响导航栏中的文本和图标。 如您所见，所有平台都在主页面顶部显示Title属性和无模式页面。 但是，在无模式页面上，iOS屏幕还会显示上一页的标题属性 - 您导航到无模式页面的页面。 NavigationPage.BackButtonTitle附加的可绑定属性可以更改iOS页面上的该文本。 您需要在导航到无模式页面的页面上进行设置。 在ModelessAndModal程序中，您可以在MainPage上设置属性，如下所示：

public class MainPage : ContentPage
    {
        public MainPage()
        {
            Title = "Main Page";
            NavigationPage.SetBackButtonTitle(this, "go back");
            __
        }
    }

这不会影响MainPage本身的标题，只会影响ModelessPage导航栏上的Back按钮附带的文本，然后仅影响iOS。你很快就会看到截图。  
第二个附加的可绑定属性是NavigationPage.TitleIcon，它替换Android导航栏上的应用程序图标，并用iOS页面上的图标替换标题。该属性的类型为FileImageSource，它引用平台项目中的位图文件。在使用中，它类似于MenuItem和ToolbarItem的Icon属性。  
为了让您体验这一点，我们在ModelessAndModal解决方案中为iOS和Android项目添加了一些合适的图标。这些图标来自第13章“位图”中讨论的Android Action Bar Icon Pack。（在第13章中，查找“特定于平台的位图”部分，然后是“工具栏及其图标”，最后是“Android的图标” “。）  
对于iOS，图标来自ActionBarIcons / holo\_light / 08\_camera\_flash\_on目录。这些图标显示闪电。 mdpi，xdpi和xxdpi目录中的图像分别为32,64和96像素的正方形。在iOS项目的Resources文件夹中，32像素方形位图的原始名称为ic\_action\_flash\_on.png，两个较大的文件分别使用@ 2和@ 3后缀重命名。  
对于Android，图标来自ActionBarIcons / holo\_dark / 08\_camera\_flash\_on目录;这些是透明背景上的白色前景。 mdpi，hdpi，xdpi和xxdpi目录中的文件已添加到Android项目中。  
您可以通过将以下代码添加到ModelessPage构造函数来在无模式页面上显示这些图标：

public class ModelessPage : ContentPage
    {
        public ModelessPage()
        {
            Title = "Modeless Page";
            if (Device.OS == TargetPlatform.iOS || Device.OS == TargetPlatform.Android)
                NavigationPage.SetTitleIcon(this, "ic_action_flash_on.png");
            __
        }
    }

这是ModelessPage，在MainPage上设置了“返回”的备用后退按钮文本，在ModelessPage上设置了图标：  
![2019\_04\_14\_152817][2019_04_14_152817]  
如您所见，该图标取代了iOS页面上的普通标题文本。  
NavigationPage.BackButtonTitle和NavigationPage.TitleIcon附加的可绑定属性都不会影响任何Windows或Windows Phone平台。  
熟悉Android架构的程序员有时会对Xamarin.Forms页面导航如何与Android应用程序架构（称为活动）的方面进行集成感到好奇。 一个  
在Android设备上运行的Xamarin.Forms应用程序仅包含一个活动，并且页面导航基于此构建。 ContentPage是一个Xamarin.Forms对象; 它不是Android活动，也不是活动的片段。

[2019_04_14_151150]: /images/20220214/fb3b640c5ac042a8b9cedb39c09dc156.png
[2019_04_14_151234]: /images/20220214/d0e9f303d76846f098fbf9bc6a0174bb.png
[2019_04_14_151338]: /images/20220214/bed2aa3f063d4937a20f3211a2fb7210.png
[2019_04_14_151710]: /images/20220214/a0f82f3269a9438dbda46c21c4ffb980.png
[2019_04_14_151816]: /images/20220214/934063b8054e41b8ac1ea161c60c9d95.png
[2019_04_14_151918]: /images/20220214/17ca1c4bc65c46eca8d8691f3278fda9.png
[2019_04_14_152817]: /images/20220214/2642c26c972f424ba73916c3816657c4.png