XAMLとMVVMLightカスタムアニメーション

Question

MVVMLightを使用し、MVVMパターンを破ることなく、W10モバイルのInstagramアプリに存在するようなオープン/クローズナビゲーションを実現しようとしています。

フレームがあるシェルがあり、そのフレームに配置されたページのボタンをクリックして、右から左の「サブウィンドウ」を開きます。

ideias？

Answer 1

両方のウィンドウを持つパネルがあり、1の表示を非表示にする必要があります。
ViewModelのプロパティの可視性をバインドします。
ボタンをクリックすると、可視性をTrueに設定し、wpfアニメーションを使用して「スライド」を出し入れします。

Answer 2

あなたmainwindow.xamlに、あなたはおそらく、あなたがそれかどうかを確認するブール型プロパティを持つことができ、そこから

<Window ..  
    <Grid> 
     <ContentPresenter Content="{Binding Window1}"/> 
     <ContentPresenter Content="{Binding Window2}"/>  
    </Grid> 
/> 

のようなものを持っているでしょうので、私のアイデアの一つは、DataTemplateのを使用してウィンドウを作成することですプロパティがtrueの場合、可視性を可視に設定し、可視性を折りたたみ/非表示に設定します。ケースでは、ここで、必要booleantovisibilityするコンバータ（念のためにあなたがそれを必要とする）ここ

using System; 
using System.Windows; 
using System.Windows.Data; 

namespace FaceTheWall.converters 
{ 
    class BooleanToVisibilityConverter : IValueConverter 
    { 
     public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) 
     { 
      if (value is Boolean && (bool)value) 
      { 
       return Visibility.Visible; 
      } 
      return Visibility.Collapsed; 
     } 

     public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) 
     { 
      if (value is Visibility && (Visibility)value == Visibility.Visible) 
      { 
       return true; 
      } 
      return false; 
     } 
    } 
} 

は、あなたが持っていますが、XAML

<TextBox... 
    Visibility="{Binding ButtCancel, Converter={StaticResource BooleanToVisibilityConverter}}" 
... > 
</TextBox