MVVMでICommandを使用してUWPでContentDialogを表示

Question

私はユーザーが写真をアップロードできるようにするUWPアプリケーションを作成しています。私は、Buttonと2つのTextBoxesを持つContentDialogを持っています。ユーザーが「写真のアップロード」を押すと、ContentDialogが表示されます。Button MVVMを使用してこれを行うにはどうすればよいですか？

ファイルを検索してデータベースにファイルを送信するロジックはすでに完了しており、UIは残ります。ここで

は私のXAMLです：

<!-- Content --> 
<Button Content="Upload a photo to gallery" Margin="40,0,0,0" x:Name="UploadPhotoButton" Command="{x:Bind MyProfileViewModel.OpenContentDialog}"/> 
<!-- More content --> 

<!-- This is the ContentDialog I want to display when the user presses the button above --> 
<ContentDialog x:Name="UploadPhotoContentDialog" 
    PrimaryButtonText="Upload" IsPrimaryButtonEnabled="{Binding IsValid}" 
    SecondaryButtonText="Cancel" IsSecondaryButtonEnabled="True"> 
    <ContentDialog.TitleTemplate> 
     <DataTemplate> 
      <StackPanel Orientation="Horizontal"> 
       <SymbolIcon Symbol="BrowsePhotos"/> 
       <TextBlock Margin="10,0,0,0" Text="Upload photo "/> 
      </StackPanel> 
     </DataTemplate> 
    </ContentDialog.TitleTemplate> 

    <Grid Padding="10" Margin="0,10,0,0"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="1*"/> 
      <RowDefinition Height="1*"/> 
      <RowDefinition Height="Auto"/> 
     </Grid.RowDefinitions> 

     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="Auto"/> 
      <ColumnDefinition Width="Auto"/> 
     </Grid.ColumnDefinitions> 

     <TextBlock Text="Photo Title:" VerticalAlignment="Center"/> 
     <TextBox Text="{Binding PhotoTitle, Mode=TwoWay}" PlaceholderText="Example: Fun in the sun" Grid.Column="1"/> 
     <TextBlock Text="Photo Caption:" Grid.Row="1" VerticalAlignment="Center"/> 
     <TextBox Text="{Binding PhotoDesc, Mode=TwoWay}" PlaceholderText="Example: Don't you just love the beach" Grid.Row="1" Grid.Column="1"/> 
     <Button Content="Browse files..." Grid.Column="0" Grid.Row="2" Margin="0,20,0,0" Command="{x:Bind MyProfileViewModel.FindFile}"/> 
     <TextBox Text="{Binding FileName, Mode=TwoWay}" Grid.Row="2" Grid.Column="1" Margin="10,20,0,0" FontSize="12" Height="32" IsReadOnly="True" /> 
    </Grid> 
</ContentDialog> 

はこれまでのところ、ここに私のC＃ファイル（MyProfileViewModel）です：メソッドの

public ICommand OpenContentDialog => new CommandHandler(async() => { 
    // What to put in here to find the ContentDialog, then display it? 
}); 

Answer 1

一つContentDialogを渡すためにBOありをCommandParameterとします。

<Button Content="Upload a photo to gallery" Margin="40,0,0,0" x:Name="UploadPhotoButton" Command="{x:Bind MyProfileViewModel.OpenContentDialog}" CommandParameter="{Binding ElementName=UploadPhotoContentDialog}"/> 

とinvokation：このようなたとえば

public RelayCommand OpenContentDialog => new RelayCommand(async (dialog) => { (dialog as ContentDialog).ShowAsync(); }); 

Answer 2

私は私の問題への答えを見つけました。 RelayCommandと呼ばれるICommand（Romaszからの入力）を実装する新しいClassを作成しました。

彼のViewModelとXAMLでのバインディングは正しいです。私はちょうど私のICommandsを調整しなければならなかった。ここで私はViewModelにロジックはアクションがパラメータを取らなかったことに不満を保持するので、アクションのための<object>を追加しなければならなかった私のRelayCommand Class

public class RelayCommand : ICommand { 
    private readonly Action<object> _execute; 
    private readonly Func<bool> _canExecute; 

    public event EventHandler CanExecuteChanged; 

    public RelayCommand(Action<object> execute) 
     : this(execute, null) { 
    } 

    public RelayCommand(Action<object> execute, Func<bool> canExecute) { 
     _execute = execute ?? throw new ArgumentNullException("execute"); 
     _canExecute = canExecute; 
    } 

    public bool CanExecute(object parameter) { 
     return _canExecute == null ? true : _canExecute(); 
    } 

    public void Execute(object parameter) { 
     _execute(parameter); 
    } 

    public void RaiseCanExecuteChanged() { 
     CanExecuteChanged?.Invoke(this, EventArgs.Empty); 
    } 
} 

です。