フレームをHamburgerMenuにどのように読み込みますか？

私はMahApps.Metro HamburgerMenuコントロールを使って簡単なアプリケーションを作成しようとしています。例で説明したようにこれまでのところ、私は私のメインウィンドウを設定している：フレームをHamburgerMenuにどのように読み込みますか？

<Controls:MetroWindow x:Class="HamburgerDemo.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:local="clr-namespace:HamburgerDemo" 
     xmlns:Controls="http://metro.mahapps.com/winfx/xaml/controls" 
     mc:Ignorable="d" 
     Title="MainWindow" Height="350" Width="525"> 
    <Controls:MetroWindow.Resources> 
     <DataTemplate x:Key="HamburgerMenuItem" DataType="{x:Type Controls:HamburgerMenuGlyphItem}"> 
      <Grid Height="48"> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="48" /> 
        <ColumnDefinition /> 
       </Grid.ColumnDefinitions> 
       <TextBlock Margin="12" 
         HorizontalAlignment="Center" 
         VerticalAlignment="Center" 
         Text="{Binding Glyph}" /> 
       <TextBlock Grid.Column="1" 
          VerticalAlignment="Center" 
          FontSize="16" 
          Text="{Binding Label}" /> 
      </Grid> 
     </DataTemplate> 
    </Controls:MetroWindow.Resources> 
    <Grid> 
     <Controls:HamburgerMenu ItemTemplate="{StaticResource HamburgerMenuItem}"> 
      <Controls:HamburgerMenu.ItemsSource> 
       <Controls:HamburgerMenuItemCollection> 
        <Controls:HamburgerMenuGlyphItem Glyph="1" Label="Page 1"/> 
        <Controls:HamburgerMenuGlyphItem Glyph="2" Label="Page 2"/> 
       </Controls:HamburgerMenuItemCollection> 
      </Controls:HamburgerMenu.ItemsSource> 
     </Controls:HamburgerMenu> 
    </Grid> 
</Controls:MetroWindow>

私はしかし、私は」することができます、クリックされたときFrameにロードされる特定Pageにリンクする各メニューボタンが欲しいですこれを行う方法を理解していない。

HamburgerMenuGlyphItemにはプロパティーTargetPageTypeがあることに気付きましたが、これはキーと思われるかもしれませんが、これをどのように使用するかはわかりません。

このコントロールやさまざまなデザインパターンを使用してコンテンツを読み込む方法があれば、私はそれらを聞いてみたいと思います。

出典

2017-01-25 Matt Williams

私はあなたのことを正しく理解していれば、これをコードビハインドでやったことがあります。それはあなたが私に教えることを意味するものではない場合！

MainWindow.xaml

<Window x:Class="Stackoverflow.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:local="clr-namespace:Stackoverflow" 
     mc:Ignorable="d" 
     xmlns:Controls="http://metro.mahapps.com/winfx/xaml/controls" 
     Title="MainWindow" Height="350" Width="525"> 
    <Window.Resources> 
    <DataTemplate x:Key="HamburgerMenuItem" DataType="{x:Type Controls:HamburgerMenuGlyphItem}"> 
     <Grid Height="48"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="48" /> 
      <ColumnDefinition /> 
      <ColumnDefinition Width="Auto"/> 
     </Grid.ColumnDefinitions> 
     <TextBlock Margin="12" 
         HorizontalAlignment="Center" 
         VerticalAlignment="Center" 
         Text="{Binding Glyph}" /> 
     <TextBlock Grid.Column="1" 
          VerticalAlignment="Center" 
          FontSize="16" 
          Text="{Binding Label}" /> 
     <Button Grid.Column="2" Click="Button_Click" Tag="{Binding Tag}">Go</Button> 
     </Grid> 
    </DataTemplate> 
    </Window.Resources> 
    <Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto"/> 
     <ColumnDefinition /> 
    </Grid.ColumnDefinitions> 
    <Controls:HamburgerMenu ItemTemplate="{StaticResource HamburgerMenuItem}"> 
     <Controls:HamburgerMenu.ItemsSource> 
     <Controls:HamburgerMenuItemCollection> 
      <Controls:HamburgerMenuGlyphItem Glyph="1" Label="Page 1" Tag="Page1.xaml"/> 
      <Controls:HamburgerMenuGlyphItem Glyph="2" Label="Page 2" Tag="Page2.xaml"/> 
     </Controls:HamburgerMenuItemCollection> 
     </Controls:HamburgerMenu.ItemsSource> 
    </Controls:HamburgerMenu> 

    <Frame x:Name="_TheFrame" Grid.Column="2"/> 
    </Grid> 
</Window>

MainWindow.xaml.cs（コードビハインド）

public partial class MainWindow : Window 
{ 
    public MainWindow() 
    { 
     InitializeComponent(); 
    } 

    private void Button_Click(object sender, RoutedEventArgs e) 
    { 
     string targetView = ((Button)sender).Tag.ToString(); 
     _TheFrame.Source = new Uri(targetView, UriKind.Relative); 
    } 
}

Page1.xaml

<Page x:Class="Stackoverflow.Page1" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:local="clr-namespace:Stackoverflow" 
     mc:Ignorable="d" 
     d:DesignHeight="300" d:DesignWidth="300" 
     Title="Page1"> 
    <Grid> 
    <TextBlock Text="PAGE 1" FontSize="24" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
    </Grid> 
</Page>

Page2.xaml

<Page x:Class="Stackoverflow.Page2" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:local="clr-namespace:Stackoverflow" 
     mc:Ignorable="d" 
     d:DesignHeight="300" d:DesignWidth="300" 
     Title="Page2"> 
    <Grid> 
    <TextBlock Text="PAGE 2" FontSize="24" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
    </Grid> 
</Page>

出典

2017-01-25 23:31:28

私は読みやすくするために別のものに答えます。

もう1つのアプローチは、MVVMを使用することです。これのために私はこれを思いついた。それがあなたのために働くと、いくつかの説明が私に教えてほしいと思う。私は怠け者なので、Prismフレームワークを使用してDelegateCommandとPropertyChangedベースオブジェクトを取得しました。

MainWindow.xaml

<Controls:MetroWindow x:Class="Stackoverflow.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:local="clr-namespace:Stackoverflow" 
     mc:Ignorable="d" 
     BorderThickness="2" 
     BorderBrush="DarkGray" 
     xmlns:Controls="http://metro.mahapps.com/winfx/xaml/controls" 
     Title="MainWindow" Height="350" Width="525"> 
    <Window.DataContext> 
    <local:MainWindowViewModel/> 
    </Window.DataContext> 
    <Window.Resources> 
    <DataTemplate x:Key="HamburgerMenuItem" DataType="{x:Type Controls:HamburgerMenuGlyphItem}"> 
     <Grid Height="48"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="48" /> 
      <ColumnDefinition /> 
      <ColumnDefinition Width="Auto"/> 
     </Grid.ColumnDefinitions> 
     <TextBlock Margin="12" 
         HorizontalAlignment="Center" 
         VerticalAlignment="Center" 
         Text="{Binding Glyph}" /> 
     <TextBlock Grid.Column="1" 
          VerticalAlignment="Center" 
          FontSize="16" 
          Text="{Binding Label}" /> 
     <Button Grid.Column="2" 
       Command="{Binding DataContext.NavigateCommand, RelativeSource={RelativeSource AncestorType=Controls:MetroWindow}}" 
      CommandParameter="{Binding Tag}">Go</Button> 
     </Grid> 
    </DataTemplate> 
    </Window.Resources> 
    <Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto"/> 
     <ColumnDefinition /> 
    </Grid.ColumnDefinitions> 
    <Controls:HamburgerMenu ItemTemplate="{StaticResource HamburgerMenuItem}"> 
     <Controls:HamburgerMenu.ItemsSource> 
     <Controls:HamburgerMenuItemCollection> 
      <Controls:HamburgerMenuGlyphItem Glyph="1" Label="Page 1" Tag="Page1.xaml"/> 
      <Controls:HamburgerMenuGlyphItem Glyph="2" Label="Page 2" Tag="Page2.xaml"/> 
     </Controls:HamburgerMenuItemCollection> 
     </Controls:HamburgerMenu.ItemsSource> 
    </Controls:HamburgerMenu> 

    <Frame Grid.Column="2" Source="{Binding FrameSource}"/> 
    </Grid> 
</Controls:MetroWindow>

MainWindowViewModel.cs

using Microsoft.Practices.Prism.Commands; 
using Microsoft.Practices.Prism.Mvvm; 
using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Threading.Tasks; 
using System.Windows.Input; 

namespace Stackoverflow 
{ 
    public class MainWindowViewModel : BindableBase 
    { 
     private string _FrameSource; 

     public MainWindowViewModel() 
     { 
      NavigateCommand = new DelegateCommand<string>(OnNavigateCommandExecute); 
     } 

     public string FrameSource 
     { 
      get { return _FrameSource; } 
      set { SetProperty(ref _FrameSource, value); } 
     } 

     public ICommand NavigateCommand { get; private set; } 

     private void OnNavigateCommandExecute(string frameSource) 
     { 
      FrameSource = frameSource; 
     } 
    } 
}

出典

2017-01-26 00:00:04

フレームをHamburgerMenuにどのように読み込みますか？

答えて

関連する問題