title: MVVM Manipulating the view, using code-behind or viewmodel
body: <p>I'm coding application using MVVM and I have a question, if I should manipulate View using code-behind or I should leave it empty. What I want to do is, when user click a button a hidden view slides out. At the moment I'm doing this in view model. Here is my code:</p>
  
  <p>This is my View: </p>
  
  <pre><code>&lt;Window.DataContext&gt;
          &lt;ViewModels:MainWindowViewModel/&gt;
      &lt;/Window.DataContext&gt;
      &lt;Window.Resources&gt;
      &lt;Style x:Key="DockPanelStyle" TargetType="{x:Type DockPanel}" &gt;
          &lt;Setter Property="OverridesDefaultStyle" Value="true"/&gt;
          &lt;Setter Property="Background" Value="AliceBlue"/&gt;
          &lt;Style.Triggers&gt;
              &lt;DataTrigger 
                           Binding="{Binding showView}" 
                           Value="true"&gt;
                  &lt;DataTrigger.EnterActions&gt;
                      &lt;BeginStoryboard&gt;
                          &lt;Storyboard&gt;
                              &lt;ThicknessAnimation
                                                  Storyboard.TargetProperty="Margin" 
                                                  To="0,0,0,0" 
                                                  AccelerationRatio=".25" 
                                                  DecelerationRatio=".25" 
                                                  Duration="0:0:0.5" 
                                                   /&gt;
                          &lt;/Storyboard&gt;
                      &lt;/BeginStoryboard&gt;
                  &lt;/DataTrigger.EnterActions&gt;
                  &lt;DataTrigger.ExitActions&gt;
                      &lt;BeginStoryboard&gt;
                          &lt;Storyboard&gt;
                              &lt;ThicknessAnimation
                                                  Storyboard.TargetProperty="Margin" 
                                                  To="0,0,-400,0" 
                                                  DecelerationRatio=".25" 
                                                  AccelerationRatio=".25" 
                                                  Duration="0:0:0.5" 
                                                  /&gt;
                          &lt;/Storyboard&gt;
                      &lt;/BeginStoryboard&gt;
                  &lt;/DataTrigger.ExitActions&gt;
              &lt;/DataTrigger&gt;
          &lt;/Style.Triggers&gt;
      &lt;/Style&gt;
      &lt;/Window.Resources&gt;
  
      &lt;Grid&gt;
          &lt;Grid.ColumnDefinitions&gt;
              &lt;ColumnDefinition Width="*"/&gt;
              &lt;ColumnDefinition Width="Auto"/&gt;
          &lt;/Grid.ColumnDefinitions&gt;
          &lt;StackPanel
              Grid.Column="0"&gt;
              &lt;Label Content="Main view" HorizontalAlignment="Center" FontSize="42"/&gt;
              &lt;Button Command="{Binding SlideOutCommand}" Content="Show view" FontSize="42"/&gt;
          &lt;/StackPanel&gt;
          &lt;DockPanel
              Grid.Column="1"
              Margin="0,0,-400,0"
              Style="{StaticResource DockPanelStyle}"&gt;
              &lt;Label Content="Sliding view" HorizontalAlignment="Center" FontSize="42"/&gt;
          &lt;/DockPanel&gt;
      &lt;/Grid&gt;
  &lt;/Window&gt;
  </code></pre>
  
  <p>Code-behind is empty.
  This is my ViewModel:</p>
  
  <pre><code>public class MainWindowViewModel : INotifyPropertyChanged
      {    
          public MainWindowViewModel()
          {
              showView = false;
          }
  
          public ICommand SlideOutCommand
          {
              get { return new ActionCommand(action =&gt; ShowView()); }
          }
  
          private void ShowView()
          {
              showView = true;
              //Do some extra logic
          }
  
          private bool _showView;
          public bool showView
          {
              get { return _showView; }
              set
              {
                  _showView = value;
                  OnPropertyChanged();
              }
          }
  
          public event PropertyChangedEventHandler PropertyChanged;
          virtual protected void OnPropertyChanged([CallerMemberName]string propName = "")
          {
              PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propName));
          }
  
  
      }
  </code></pre>
  
  <p>Or should I go with solution like this:</p>
  
  <p>View:</p>
  
  <pre><code> &lt;Window.DataContext&gt;
          &lt;ViewModels:MainWindowViewModel/&gt;
      &lt;/Window.DataContext&gt;
      &lt;Window.Resources&gt;
      &lt;Style x:Key="DockPanelStyle" TargetType="{x:Type DockPanel}" &gt;
          &lt;Setter Property="OverridesDefaultStyle" Value="true"/&gt;
          &lt;Setter Property="Background" Value="AliceBlue"/&gt;
          &lt;Style.Triggers&gt;
              &lt;DataTrigger 
                           Binding="{Binding Path=Tag, RelativeSource={RelativeSource Self}}" 
                           Value="true"&gt;
                  &lt;DataTrigger.EnterActions&gt;
                      &lt;BeginStoryboard&gt;
                          &lt;Storyboard&gt;
                              &lt;ThicknessAnimation
                                                  Storyboard.TargetProperty="Margin" 
                                                  To="0,0,0,0" 
                                                  AccelerationRatio=".25" 
                                                  DecelerationRatio=".25" 
                                                  Duration="0:0:0.5" 
                                                   /&gt;
                          &lt;/Storyboard&gt;
                      &lt;/BeginStoryboard&gt;
                  &lt;/DataTrigger.EnterActions&gt;
                  &lt;DataTrigger.ExitActions&gt;
                      &lt;BeginStoryboard&gt;
                          &lt;Storyboard&gt;
                              &lt;ThicknessAnimation
                                                  Storyboard.TargetProperty="Margin" 
                                                  To="0,0,-400,0" 
                                                  DecelerationRatio=".25" 
                                                  AccelerationRatio=".25" 
                                                  Duration="0:0:0.5" 
                                                  /&gt;
                          &lt;/Storyboard&gt;
                      &lt;/BeginStoryboard&gt;
                  &lt;/DataTrigger.ExitActions&gt;
              &lt;/DataTrigger&gt;
          &lt;/Style.Triggers&gt;
      &lt;/Style&gt;
      &lt;/Window.Resources&gt;
  
      &lt;Grid&gt;
          &lt;Grid.ColumnDefinitions&gt;
              &lt;ColumnDefinition Width="*"/&gt;
              &lt;ColumnDefinition Width="Auto"/&gt;
          &lt;/Grid.ColumnDefinitions&gt;
          &lt;StackPanel
              Grid.Column="0"&gt;
              &lt;Label Content="Main view" HorizontalAlignment="Center" FontSize="42"/&gt;
              &lt;Button Command="{Binding SlideOutCommand}" Content="Show view" FontSize="42" Click="Button_Click"/&gt;
          &lt;/StackPanel&gt;
          &lt;DockPanel
              x:Name="SlideView"
              Grid.Column="1"
              Margin="0,0,-400,0"
              Style="{StaticResource DockPanelStyle}"
              Tag="{Binding Path=showView,RelativeSource={RelativeSource AncestorType=Window}}"&gt;
              &lt;Label Content="Sliding view" HorizontalAlignment="Center" FontSize="42"/&gt;
          &lt;/DockPanel&gt;
      &lt;/Grid&gt;
  &lt;/Window&gt;
  </code></pre>
  
  <p>Code-behind:</p>
  
  <pre><code>public partial class MainWindowView : Window, INotifyPropertyChanged
      {
          public MainWindowView()
          {
              InitializeComponent();
              showView = false;
          }
  
          private void Button_Click(object sender, RoutedEventArgs e)
          {
              showView = true;
          }
  
          private bool _showView;
          public bool showView
          {
              get { return _showView; }
              set
              {
                  _showView = value;
                  OnPropertyChanged();
              }
          }
  
  
          public event PropertyChangedEventHandler PropertyChanged;
          virtual protected void OnPropertyChanged([CallerMemberName]string propName = "")
          {
              PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propName));
          }
      }
  </code></pre>
  
  <p>And ViewModel:</p>
  
  <pre><code>public class MainWindowViewModel : INotifyPropertyChanged
      {
  
          public MainWindowViewModel()
          {
          }
  
          public ICommand SlideOutCommand
          {
              get { return new ActionCommand(action =&gt; ShowView()); }
          }
  
          private void ShowView()
          {
              //Do some extra logic
          }
  
  
          public event PropertyChangedEventHandler PropertyChanged;
          virtual protected void OnPropertyChanged([CallerMemberName]string propName = "")
          {
              PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propName));
          }
  
  
      }
  </code></pre>
  
  <p>What is better approach in MVVM pattern?</p>