UWP include/require XAML 如 PHP

Question

所以我一直在努力解决这个问题，我不明白任何找到的 "answers"...我有一个菜单，我想在多个页面上使用，但不是全部他们。所以我有一个 "index" 页面，里面有一个 splitview，旁边有一个菜单，右边有内容。但我希望能够 "include" 菜单，能够只编辑一个文件而不是在每一页中再次写入菜单...下面你可以找到我一页的代码;

<Page
    x:Class="RittensportRekenSoftware.Views.Index"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:RittensportRekenSoftware.Views"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" RequestedTheme="Dark">

    <SplitView x:Name="MySplitView" DisplayMode="CompactOverlay" IsPaneOpen="False" CompactPaneLength="50" OpenPaneLength="150">
        <SplitView.Pane>
            <!-- Here will the menu be included, so we don't have to re-render it every time again and it's changeable from withing one file -->
            <StackPanel Background="#202225" RequestedTheme="Dark">
                <Button x:Name="HamburgerButton" FontFamily="Segoe MDL2 Assets" Content="&#xE700;" Width="50" Height="50" Background="Transparent"/>
                <StackPanel Orientation="Horizontal">
                    <Button x:Name="MenuButton1" FontFamily="Segoe MDL2 Assets" Content="&#xE825;"
                    Width="50" Height="50" Background="Transparent"/>
                    <TextBlock Text="Button 1" FontSize="18" VerticalAlignment="Center" />
                </StackPanel>
                <StackPanel Orientation="Horizontal">
                    <Button x:Name="MenuButton2" FontFamily="Segoe MDL2 Assets" Content="&#xE10F;"
                        Width="50" Height="50" Background="Transparent"/>
                    <TextBlock Text="Button 2" FontSize="18" VerticalAlignment="Center" />
                </StackPanel>
                <StackPanel Orientation="Horizontal">
                    <Button x:Name="MenuButton3" FontFamily="Segoe MDL2 Assets" Content="&#xE1D6;"
                        Width="50" Height="50" Background="Transparent"/>
                    <TextBlock Text="Button 3" FontSize="18" VerticalAlignment="Center" />
                </StackPanel>
            </StackPanel>

        </SplitView.Pane>
        <SplitView.Content>
            <Grid>
                <TextBlock Text="Content here :D" FontSize="54" Foreground="White" HorizontalAlignment="Center" VerticalAlignment="Center"/>
            </Grid>
        </SplitView.Content>
    </SplitView>

</Page>

现在，如果有类似 "include menu" 的东西可以从 Views.Layouts.Menu.xaml 中的文件中获取内容，那就太好了，只是我不知道应该如何制作这样的文件以及如何包含。

最诚挚的问候

罗宾

Answer 1

Now, It would be great to have something like "include menu" that gets the content from a file in Views.Layouts.Menu.xaml, except I have no idea how such file should be made and how to include.

制作 UserControl 的方向是正确的。请按照我的以下步骤尝试一下：

右击你的项目-添加-新建项-SelectUser Control

将您的代码复制到此 UserControl XAML 页面中，如下所示：

<UserControl
x:Class="AppSplit.MyUserControl1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:AppSplit"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="400">

<SplitView x:Name="MySplitView" DisplayMode="CompactOverlay" IsPaneOpen="False" CompactPaneLength="50" OpenPaneLength="150">
    <SplitView.Pane>
    <!-- Here will the menu be included, so we don't have to re-render it every time again and it's changeable from withing one file -->
        <StackPanel Background="#202225" RequestedTheme="Dark">
            <Button x:Name="HamburgerButton" FontFamily="Segoe MDL2 Assets" Content="&#xE700;" Width="50" Height="50" Background="Transparent" Click="HamburgerButton_Click"/>
            <StackPanel Orientation="Horizontal">
                <Button x:Name="MenuButton1" FontFamily="Segoe MDL2 Assets" Content="&#xE825;"
            Width="50" Height="50" Background="Transparent"/>
                <TextBlock Text="Button 1" FontSize="18" VerticalAlignment="Center" />
            </StackPanel>
            <StackPanel Orientation="Horizontal">
                <Button x:Name="MenuButton2" FontFamily="Segoe MDL2 Assets" Content="&#xE10F;"
                Width="50" Height="50" Background="Transparent"/>
                <TextBlock Text="Button 2" FontSize="18" VerticalAlignment="Center" />
            </StackPanel>
            <StackPanel Orientation="Horizontal">
                <Button x:Name="MenuButton3" FontFamily="Segoe MDL2 Assets" Content="&#xE1D6;"
                Width="50" Height="50" Background="Transparent"/>
                <TextBlock Text="Button 3" FontSize="18" VerticalAlignment="Center" />
            </StackPanel>
        </StackPanel>

    </SplitView.Pane>
    <SplitView.Content>
        <Grid>
            <TextBlock Text="Content here :D" FontSize="54" Foreground="Black" HorizontalAlignment="Center" VerticalAlignment="Center"/>
        </Grid>
    </SplitView.Content>
</SplitView>
</UserControl>

public sealed partial class MyUserControl1 : UserControl
{
    public MyUserControl1()
    {
        this.InitializeComponent();
    }

    private void HamburgerButton_Click(object sender, RoutedEventArgs e)
    {
        MySplitView.IsPaneOpen = MySplitView.IsPaneOpen == true ? false : true;
    }
}

如果你想在其他 XAML 页面上包含这个 UserControl，你可以这样做：

<Page
x:Class="AppSplit.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:AppSplit"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <local:MyUserControl1></local:MyUserControl1>
</Page>

UWP include/require XAML 如 PHP

UWP include/require XAML as in PHP

xaml

include

uwp

uwp-xaml