Question

如何将UI控制器添加到应用的所有页面？例如，在所有页面上的窗格中使用相同的SplitView控制器和导航菜单而不复制其xaml代码？或者可能以某种方式更改App.xaml？

或者，作为第二个选项，是否可以创建一个包含SplitView的UserControl并将此页面上的所有其他视图放入其中？我的意思是，如何将视图放入xaml中的UserControl（甚至是代码中）？

Answer 1

听起来像是杰瑞·尼克松在this article here中所建议的那样。

基本的想法是，您可以创建一个＆＃34; Shell＆＃34;而不是包含所有应用内容的Frame控件。（在文章的情况下，由SplitView构成，但实际上，它可能是任何东西），它有自己的一些内容，以及一个Frame控件（然后它托管）你的其他内容）。

Answer 2

创建自定义RootControl，其源自UserControl类，其中包含根Frame

    <SplitView DisplayMode="CompactOverlay">
      <SplitView.Pane>
        <StackPanel>
            <AppBarButton Icon="Home"
                          Width="50"
                          MinWidth="50"
                          Click="OnHomeClicked"
                          />
            <AppBarButton Icon="Shop"
                          Width="50"
                          MinWidth="50"
                          Click="OnShopClicked"/>
            <AppBarButton Icon="Setting"
                          MinWidth="50"
                          Width="50"
                          Click="OnSettingsClicked"/>
        </StackPanel>
      </SplitView.Pane>
      <SplitView.Content>
        <Grid>
            <Frame x:Name="rootFrame"/>

            <!--Put your hamburger button here-->

        </Grid>
      </SplitView.Content>
    </SplitView>

重写 OnLauched ：

    protected override void OnLaunched(LaunchActivatedEventArgs e)
    {

        var rootControl = Window.Current.Content as RootControl;

        if (rootControl == null)
        {
            // Create a Frame to act as the navigation context and navigate to the first page
            rootControl = new RootControl();

            rootControl.RootFrame.NavigationFailed += OnNavigationFailed;

            if (e.PreviousExecutionState == ApplicationExecutionState.Terminated)
            {
                //TODO: Load state from previously suspended application
            }

            // Place the frame in the current Window
            Window.Current.Content = rootControl;
        }

        if (rootControl.RootFrame.Content == null)
        {
            // When the navigation stack isn't restored navigate to the first page,
            // configuring the new page by passing required information as a navigation
            // parameter
            rootControl.RootFrame.Navigate(typeof(MainPage), e.Arguments);
        }
        // Ensure the current window is active
        Window.Current.Activate();
    }

您可以通过代码隐藏或ViewModel管理您的操作以进行导航和其他操作

    public sealed partial class RootControl : UserControl
    {
        private Type currentPage;

        public RootControl()
        {
            this.InitializeComponent();
            RootFrame.Navigated += OnNavigated;
        }

        private void OnNavigated(object sender, Windows.UI.Xaml.Navigation.NavigationEventArgs e)
        {
            currentPage = e.SourcePageType;
        }

        public Frame RootFrame
        {
            get
            {
                return rootFrame;
             }
        }

        private void OnHomeClicked(object sender, Windows.UI.Xaml.RoutedEventArgs e)
        {
            Navigate(typeof(MainPage));
        }

        private void OnShopClicked(object sender, Windows.UI.Xaml.RoutedEventArgs e)
        {
             Navigate(typeof(StorePage));
        }

        private void OnSettingsClicked(object sender, Windows.UI.Xaml.RoutedEventArgs e)
        {
             Navigate(typeof(SettingsPage));
        }

        private void Navigate(Type pageSourceType)
        {
            if (currentPage != pageSourceType)
            {
                RootFrame.Navigate(pageSourceType);
            }
        }
    }

Download样本并查看其工作原理

将控制器添加到所有页面UWP

2 个答案: