UWP:两个 Splitview 窗格
UWP: Two Splitview pane
我目前正在使用 UWP、XAML
和 C#
为 Windows 10 构建应用。我有一个应用程序,其中我需要有一个菜单和一个左窗格。请参阅左侧菜单的示例:
图片 - 下一个网络
窗格需要始终打开。这是我目前在 MainPage.xaml
:
中的内容
<SplitView x:Name="MySplitView" DisplayMode="CompactOverlay" IsPaneOpen="False"
CompactPaneLength="50" OpenPaneLength="200">
<SplitView.Pane>
<StackPanel Background="Gray">
<Button x:Name="HamburgerButton" FontFamily="Segoe MDL2 Assets" Content=""
Width="50" Height="50" Background="Transparent" Click="HamburgerButton_Click"/>
<StackPanel Orientation="Horizontal">
<Button x:Name="HomeButton" FontFamily="Segoe MDL2 Assets" Content=""
Width="50" Height="50" Background="Transparent" Click="HomeButton_Click"/>
<TextBlock Text="Accueil" FontSize="18" VerticalAlignment="Center" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<Button x:Name="CommisButton" FontFamily="Segoe MDL2 Assets" Content=""
Width="50" Height="50" Background="Transparent" Click="CommisButton_Click"/>
<TextBlock Text="Commis" FontSize="18" VerticalAlignment="Center" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<Button x:Name="CommentsButton" FontFamily="Segoe MDL2 Assets" Content=""
Width="50" Height="50" Background="Transparent" Click="CommentsButton_Click"/>
<TextBlock Text="Commentaires" FontSize="18" VerticalAlignment="Center" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<Button x:Name="SettingsButton" FontFamily="Segoe MDL2 Assets" Content=""
Width="50" Height="50" Background="Transparent" Click="SettingsButton_Click"/>
<TextBlock Text="Paramètres" FontSize="18" VerticalAlignment="Center" />
</StackPanel>
</StackPanel>
</SplitView.Pane>
<SplitView.Content>
<!-- My Content -->
</SplitView.Content>
</SplitView>
我试过再做一个 SplitView.Pane
但没有成功。我需要一种制作左面板的方法,仅此而已!
谢谢
在您的 SplitView.Content
中,添加另一个 SplitView
。
<SplitView.Content>
<!-- My Content -->
<SplitView x:Name="MyRisksPane" IsPaneOpen="True" OpenPaneLength="350" Background="White" DisplayMode="Inline">
<SplitView.Pane>
<!-- Your SplitView.Pane content goes here -->
</SplitView.Pane>
<SplitView.Content>
<Frame x:Name="FrameDetailPane"/>
</SplitView.Content>
</SplitView>
</SplitView.Content>
我目前正在使用 UWP、XAML
和 C#
为 Windows 10 构建应用。我有一个应用程序,其中我需要有一个菜单和一个左窗格。请参阅左侧菜单的示例:
图片 - 下一个网络
窗格需要始终打开。这是我目前在 MainPage.xaml
:
<SplitView x:Name="MySplitView" DisplayMode="CompactOverlay" IsPaneOpen="False"
CompactPaneLength="50" OpenPaneLength="200">
<SplitView.Pane>
<StackPanel Background="Gray">
<Button x:Name="HamburgerButton" FontFamily="Segoe MDL2 Assets" Content=""
Width="50" Height="50" Background="Transparent" Click="HamburgerButton_Click"/>
<StackPanel Orientation="Horizontal">
<Button x:Name="HomeButton" FontFamily="Segoe MDL2 Assets" Content=""
Width="50" Height="50" Background="Transparent" Click="HomeButton_Click"/>
<TextBlock Text="Accueil" FontSize="18" VerticalAlignment="Center" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<Button x:Name="CommisButton" FontFamily="Segoe MDL2 Assets" Content=""
Width="50" Height="50" Background="Transparent" Click="CommisButton_Click"/>
<TextBlock Text="Commis" FontSize="18" VerticalAlignment="Center" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<Button x:Name="CommentsButton" FontFamily="Segoe MDL2 Assets" Content=""
Width="50" Height="50" Background="Transparent" Click="CommentsButton_Click"/>
<TextBlock Text="Commentaires" FontSize="18" VerticalAlignment="Center" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<Button x:Name="SettingsButton" FontFamily="Segoe MDL2 Assets" Content=""
Width="50" Height="50" Background="Transparent" Click="SettingsButton_Click"/>
<TextBlock Text="Paramètres" FontSize="18" VerticalAlignment="Center" />
</StackPanel>
</StackPanel>
</SplitView.Pane>
<SplitView.Content>
<!-- My Content -->
</SplitView.Content>
</SplitView>
我试过再做一个 SplitView.Pane
但没有成功。我需要一种制作左面板的方法,仅此而已!
谢谢
在您的 SplitView.Content
中,添加另一个 SplitView
。
<SplitView.Content>
<!-- My Content -->
<SplitView x:Name="MyRisksPane" IsPaneOpen="True" OpenPaneLength="350" Background="White" DisplayMode="Inline">
<SplitView.Pane>
<!-- Your SplitView.Pane content goes here -->
</SplitView.Pane>
<SplitView.Content>
<Frame x:Name="FrameDetailPane"/>
</SplitView.Content>
</SplitView>
</SplitView.Content>