2016-04-28 10 views
2

XAML - UWPの上部と下部にハンバーガーメニューを作成するにはどうすればいいですか?UWPハンバーガーメニューの上と下

これは私のSplitView.Pane

 <SplitView.Pane> 
      <Grid> 
       <Border Background="{StaticResource PanelBackground}"/> 
       <ListView x:Name="navMenuList" 
          SelectionMode="Single" 
          IsItemClickEnabled="True" 
          Margin="0,0,0,0" ItemsSource="{Binding Menus}"> 
        <ListView.ItemTemplate> 
         <DataTemplate> 
          <StackPanel Orientation="Horizontal" Width="240" HorizontalAlignment="Left" Height="48"> 
           <SymbolIcon Margin="2,0,0,0" Symbol="{Binding Symbol}" Foreground="White"/> 
           <TextBlock Margin="24,0,0,0" Text="{Binding Text}" VerticalAlignment="Center" Foreground="White"/> 
          </StackPanel> 
         </DataTemplate> 
        </ListView.ItemTemplate> 
        <interactivity:Interaction.Behaviors> 
         <core:EventTriggerBehavior EventName="ItemClick"> 
          <core:InvokeCommandAction Command="{Binding Path=MenuCommand}" CommandParameter="{Binding Target}"/> 
         </core:EventTriggerBehavior> 
        </interactivity:Interaction.Behaviors> 
       </ListView> 
      </Grid> 
     </SplitView.Pane> 

であるが、他の結合と全体ListViewをdupliciteための良い方法ですか?

// EDIT

私は(しかし:)より多くのメニュー項目で)このようなものが必要:

enter image description here

+0

うを試すことができます2つのメニューペインが好きですか?私はあなたが達成したいと思っているものがわからないので。 –

+0

@danny私のQ – Kicker

+1

を編集しました[テンプレート10](https://github.com/Windows-XAML/Template10) – SWilko

答えて

0
<SplitView x:Name"RootSplitView"> 
</SplitView> 
<ToggleButton x:Name="TogglePaneButton" 
         TabIndex="1" 
         Style="{StaticResource SplitViewTogglePaneButtonStyle}" 
         IsChecked="{Binding IsPaneOpen, ElementName=RootSplitView, Mode=TwoWay}" 
         Unchecked="TogglePaneButton_Checked" 
         AutomationProperties.Name="Menu" 
         ToolTipService.ToolTip="Menu" Background="#E53DAFBD" Foreground="#FFF9EAEA" /> 

あなたはこのコード

0
<SplitView.Pane> 
    <Grid> 
     <StackPanel> 
      <ToggleButton x:Name="HamburgerButton" FontFamily="Segoe MDL2 Assets" Content="&#xE700;" 
       Width="50" Height="50" Background="Transparent" Tapped="HamburgerButton_Tapped" Foreground="White" 
       FontSize="16" FontWeight="Bold" Style="{StaticResource HamburgerToggleButtonStyle}" /> 

      <RadioButton Content="Top 1" x:Name="btn1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" IsChecked="False" Foreground="White" GroupName="HamMenu"/> 
      <RadioButton Content="Top 2" x:Name="btn2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" IsChecked="True" Foreground="White" GroupName="HamMenu"/> 
      <RadioButton Content="Top 3" x:Name="btn3" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" IsChecked="False" Foreground="White" GroupName="HamMenu"/> 

     </StackPanel> 
     <StackPanel VerticalAlignment="Bottom"> 
      <RadioButton Content="Bottom 1" x:Name="btn4" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" IsChecked="False" Foreground="White" GroupName="HamMenu"/> 
      <RadioButton Content="Bottom 2" x:Name="btn5" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" IsChecked="False" Foreground="White" GroupName="HamMenu"/> 
     </StackPanel> 
    </Grid> 
</SplitView.Pane> 
関連する問題