Verwenden eines DataTriggers zum Ändern Nur der linke oder rechte Rand (oder beide)

Question

So habe ich ein Raster, das seinen Rand basierend auf Flag in der VM ändern muss. Scheint wie Datatriggers der richtige Weg ist, damit umzugehen.

Also habe ich auf den Punkt:

<Grid x:Name="myGrid" Grid.Row="1" Margin="30,0"> 
    <Grid.Style> 
     <Style TargetType="Grid"> 
      <Style.Triggers> 
       <DataTrigger Binding="{Binding UI_Preferences.RightPanelPinned}" Value="true" > 
        <Setter Property="Margin" value="200" /> 
       </DataTrigger> 
       <DataTrigger Binding="{Binding UI_Preferences.LeftPanelPinned}" Value="true" > 
        <Setter Property="Margin" value="200" /> 
       </DataTrigger> 
      </Style.Triggers> 
     </Style> 
    </Grid.Style> 
</Grid> 

Welche funktioniert, aber ich kann nicht herausfinden, wie individuell nur mit der linken oder rechten Rand zu ändern.

Answer 1

Ein Rand ist eigentlich ein Thickness Element, so dass Sie es wie folgt tun:

EDIT - hinzugefügt Zustand, in dem Bot gesetzt sind:

<Grid x:Name="myGrid" Grid.Row="1" Margin="30,0"> 
<Grid.Style> 
    <Style TargetType="Grid"> 
    <Style.Triggers> 
     <DataTrigger Binding="{Binding UI_Preferences.RightPanelPinned}" Value="true" > 
     <Setter Property="Margin"> 
      <Setter.Value> 
      <Thickness Left="200"/> 
      </Setter.Value> 
     </Setter> 
     </DataTrigger> 
     <DataTrigger Binding="{Binding UI_Preferences.LeftPanelPinned}" Value="true" > 
     <Setter Property="Margin"> 
      <Setter.Value> 
      <Thickness Right="200"/> 
      </Setter.Value> 
     </Setter> 
     </DataTrigger> 
     <MultiDataTrigger> 
     <MultiDataTrigger.Conditions> 
      <Condition Binding="{Binding UI_Preferences.LeftPanelPinned}" Value="true" /> 
      <Condition Binding="{Binding UI_Preferences.RightPanelPinned}" Value="true" /> 
     </MultiDataTrigger.Conditions> 
     <Setter Property="Margin"> 
      <Setter.Value> 
      <Thickness Right="200" Left="200"/> 
      </Setter.Value> 
     </Setter> 
     </MultiDataTrigger> 
    </Style.Triggers> 
    </Style> 
</Grid.Style> 

Answer 2

Nun, das nicht verwendet DataTriggers, aber es funktioniert sehr gut, und ich denke, dass es das tut, was Sie suchen:

MainWindow.xaml

<Window x:Class="Wpf1.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="MainWindow" Height="350" Width="525"> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="200" /> 
      <RowDefinition Height="*" /> 
     </Grid.RowDefinitions> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*" /> 
      <ColumnDefinition Width="*" /> 
     </Grid.ColumnDefinitions> 
     <Grid x:Name="myGrid" Grid.Row="0" Grid.ColumnSpan="2" Background="AliceBlue"> 
      <Grid.Style> 
       <Style TargetType="Grid"> 
        <Setter Property="Margin" Value="{Binding Margin}" /> 
       </Style> 
      </Grid.Style> 
     </Grid> 
     <Button Content="Left Toggle" Name="LeftButton" Grid.Row="1" Grid.Column="0" /> 
     <Button Content="Right Toggle" Name="RightButton" Grid.Row="1" Grid.Column="1" /> 
    </Grid> 
</Window> 

MainWindow.xaml.cs

using System.Windows; 

namespace Wpf1 
{ 
    /// <summary> 
    /// Interaction logic for MainWindow.xaml 
    /// </summary> 
    public partial class MainWindow : Window 
    { 
     public MainWindow() 
     { 
      InitializeComponent(); 

      MainWindowVM mainWindowVM = new MainWindowVM(this); 
      this.LeftButton.Click += mainWindowVM.LeftButton_Click; 
      this.RightButton.Click += mainWindowVM.RightButton_Click; 

      DataContext = mainWindowVM; 
     } 
    } 
} 

Und die Aussicht Modell: MainWindowVM.cs

using System.Windows; 
using System.ComponentModel; 

namespace Wpf1 
{ 
    class MainWindowVM : INotifyPropertyChanged 
    { 
     public MainWindow MainWindow { get; set; } 

     private Thickness _margin; 
     public Thickness Margin 
     { 
      get { return _margin; } 
      set { 
       if (_margin != value) 
       { 
        _margin = value; 
        OnPropertyChanged("Margin"); 
       } 
      } 
     } 

     private bool _rightPanelPinned; 
     public bool RightPanelPinned 
     { 
      get { return _rightPanelPinned; } 
      set 
      { 
       if (_rightPanelPinned != value) 
       { 
        _rightPanelPinned = value; 

        if (_rightPanelPinned == true) 
        { 
         Thickness thickness = Margin; 
         thickness.Right = 30.0; 
         Margin = thickness; 
        } 
        else 
        { 
         Thickness thickness = Margin; 
         thickness.Right = 0.0; 
         Margin = thickness; 
        } 
       } 
      } 
     } 

     private bool _leftPanelPinned; 
     public bool LeftPanelPinned 
     { 
      get { return _leftPanelPinned; } 
      set 
      { 
       if (_leftPanelPinned != value) 
       { 
        _leftPanelPinned = value; 

        if (_leftPanelPinned == true) 
        { 
         Thickness thickness = Margin; 
         thickness.Left = 30.0; 
         Margin = thickness; 
        } 
        else 
        { 
         Thickness thickness = Margin; 
         thickness.Left = 0.0; 
         Margin = thickness; 
        } 
       } 
      } 
     } 

     public MainWindowVM(MainWindow mainWindow) 
     { 
      MainWindow = mainWindow; 

      LeftPanelPinned = false; 
      RightPanelPinned = false; 
     } 

     public void LeftButton_Click(object sender, RoutedEventArgs e) 
     { 
      MainWindow.BeginInit(); 
      LeftPanelPinned = (!LeftPanelPinned); 
      MainWindow.EndInit(); 
      MainWindow.UpdateLayout(); 
     } 

     public void RightButton_Click(object sender, RoutedEventArgs e) 
     { 
      MainWindow.BeginInit(); 
      RightPanelPinned = (!RightPanelPinned); 
      MainWindow.EndInit(); 
      MainWindow.UpdateLayout(); 
     } 

     public event PropertyChangedEventHandler PropertyChanged; 
     protected void OnPropertyChanged(string propertyName) 
     { 
      if (PropertyChanged != null) 
       PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); 
     } 
    } 
} 

Ich fand es am einfachsten, einfach den Rand des Gitters an eine Eigenschaft im Ansichtsmodell zu binden. Hoffe das hilft!

Cheers,

Andrew