2

我正在使用标签导航和页面，并且想要打开一个新页面。

在我的 app.xaml.cs 中，我创建了导航页面：

public App()
{
    InitializeComponent();
    MainPage = new NavigationPage(new RootPage());
}

在 RootPage 我填写导航：

public RootPage()
{
        NavigationPage.SetHasNavigationBar(this, false);

        Children.Add(new TestPage1
        {
            Title = "TestPage1"
        });

        Children.Add(new TestPage2
        {
            Title = "TestPage2"
        });
        Children.Add(new TestPage3
        {
            Title = "TestPage3"
        });
}

这种类型的导航已经很好地工作并且看起来不错。现在我想在 TestPage3 中打开一个新页面：TestPage3.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"
             x:Class="DemoApplication.TestPage3">
  <Button x:Name="openSetup"  Clicked="ItemClicked" Text="open Settings"/>
</ContentPage>

TestPage3.xaml.cs：

namespace DemoApplication
{
    public partial class TestPage3 : ContentPage
    {
        public TestPage3()
        {
            InitializeComponent();
        }
        void ItemClicked(object sender, EventArgs e)
        {
            Navigation.PushAsync(new TestPage4());
        }
    }
}

这也有效，但看起来不太好。

新内容加载在原始选项卡导航下方，加载后选项卡导航消失 - 所以 Page4 的内容有点跳跃:)

在 soundcloud 等其他应用程序中，它们的功能相同，但看起来更流畅。

有没有什么办法可以让tab-navigation在back-navigation之间切换更顺畅？

谢谢你的帮助 ：）

4

3 回答 3

4

如果你想在一个选项卡中导航，每个选项卡都应该有它自己的 NavigationPage。TabbedPage 本身不应位于 NavigationPage 中。

MainPage = new RootPage();

和

Children.Add(new NavigationPage(new TestPage3
        {
            Title = "TestPage3"
        }));
于 2016-10-30T20:35:21.890 回答
1

正如 Jason 所说：如果您想在一个选项卡内导航同时维护选项卡，那么每个选项卡都应该有自己的 NavigationPage。TabbedPage 本身不应位于 NavigationPage 中。

这就是它在 XAML 中的完成方式：

应用程序.xaml.cs

public App()
{
    InitializeComponent();
    MainPage = new RootPage();
}

RootPage.xaml

<?xml version="1.0" encoding="UTF-8"?>
<TabbedPage xmlns:Pages="clr-namespace:AppName"
            xmlns="http://xamarin.com/schemas/2014/forms"
            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
            x:Class="AppName.Rootpage">
    <NavigationPage Title="TestPage1">
        <x:Arguments>
            <Pages:TestPage1/>
        </x:Arguments>
    </NavigationPage>
</TabbedPage>

TestPage1.xaml

<?xml version="1.0" encoding="UTF-8"?>
<ContentPage NavigationPage.HasNavigationBar="false"
             xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="AppName.TestPage1">
    <Button Clicked="ButtonClicked"/>
</ContentPage>

TestPage1.xaml.cs

public TestPage1()
{
    InitializeComponent();
}

void ButtonClicked(object sender, EventArgs e)
{
    Navigation.PushAsync(new TestPage2());
}

请注意，使用此设置，您必须应用NavigationPage.HasNavigationBar="false"到您不希望显示导航栏的所有页面，就像我在TestPage1.xaml中所做的那样。将其应用于您<TabbedPage>的RootPage.xaml将不起作用。

于 2018-08-19T11:41:07.880 回答
0 
public partial class Home : TabbedPage
{
    public Home()
    {
        var alphaPage = new NavigationPage(new ExistingAlphaPage());
        alphaPage .Title = "Alpha";

        var betaPage = new NavigationPage(new ExistingBetaPage());
        betaPage.Title = "Beta";

        var gamaPage = new NavigationPage(new ExistingGamaPage());
        gamaPage .Title = "Gama";

        Children.Add(alphaPage);
        Children.Add(betaPage);
        Children.Add(gamaPage);
    }
}
于 2018-07-30T22:32:12.823 回答