Added a option to change the background of the preview window

PixiEditor/Views/UserControls/PreviewWindow.xaml

@@ -19,11 +19,12 @@
             <RowDefinition Height="5"/>
             <RowDefinition Height="Auto"/>
         </Grid.RowDefinitions>
+        
         <Viewbox Margin="30" VerticalAlignment="Top">
             <Grid x:Name="imageGrid"
               Visibility="{Binding Document, Converter={StaticResource NullToVisibiltyConverter}, ElementName=uc}"
               Height="{Binding Document.Height, ElementName=uc}" Width="{Binding Document.Width, ElementName=uc}"
-                  Background="Transparent">
+              Background="{Binding SelectedItem.Tag, ElementName=backgroundComboBox}" d:Width="8" d:Height="8">
                 <ItemsControl ItemsSource="{Binding Document.Layers, ElementName=uc}">
                     <ItemsControl.ItemsPanel>
                         <ItemsPanelTemplate>
@@ -49,6 +50,7 @@
                 </Border>
             </Grid>
         </Viewbox>
+
         <Grid Grid.Row="1">
             <Grid.Background>
                 <SolidColorBrush Color="{Binding ColorCursorColor, ElementName=uc, FallbackValue=Black}"/>
@@ -74,5 +76,77 @@
 
             <local:PrependTextBlock Prepend="  (" Text="{Binding ColorCursorColor, ElementName=uc, FallbackValue=#00000000}" Append=")"/>
         </StackPanel>
+
+
+        <StackPanel Visibility="{Binding OptionsOpen, ElementName=uc, Converter={StaticResource BoolToVisibilityConverter}, FallbackValue=Hidden}"
+                    Background="{StaticResource AccentColor}" Grid.RowSpan="3">
+            <Grid Margin="5">
+                <Grid.ColumnDefinitions>
+                    <ColumnDefinition Width="Auto"/>
+                    <ColumnDefinition Width="*"/>
+                    <ColumnDefinition Width="50"/>
+                </Grid.ColumnDefinitions>
+                <TextBlock Text="Background: " VerticalAlignment="Center"/>
+                <ComboBox SelectedIndex="1" x:Name="backgroundComboBox" Grid.Column="1">
+                    <ComboBoxItem Content="None">
+                        <ComboBoxItem.Tag>
+                            <SolidColorBrush Color="Transparent"/>
+                        </ComboBoxItem.Tag>
+                    </ComboBoxItem>
+                    <ComboBoxItem Content="Checkered">
+                        <ComboBoxItem.Tag>
+                            <ImageBrush ImageSource="/Images/transparentbg.png"/>
+                        </ComboBoxItem.Tag>
+                    </ComboBoxItem>
+                    <ComboBoxItem Content="Black">
+                        <ComboBoxItem.Tag>
+                            <SolidColorBrush Color="Black"/>
+                        </ComboBoxItem.Tag>
+                    </ComboBoxItem>
+                    <ComboBoxItem Content="White">
+                        <ComboBoxItem.Tag>
+                            <SolidColorBrush Color="White"/>
+                        </ComboBoxItem.Tag>
+                    </ComboBoxItem>
+                </ComboBox>
+            </Grid>
+        </StackPanel>
+
+        <ToggleButton Height="28" VerticalAlignment="Top" HorizontalAlignment="Right"
+                 Margin="5" Background="Transparent" BorderThickness="0" IsChecked="{Binding OptionsOpen, ElementName=uc, Mode=TwoWay, FallbackValue=True}">
+            <ToggleButton.Style>
+                <Style TargetType="ToggleButton">
+                    <Setter Property="Template">
+                        <Setter.Value>
+                            <ControlTemplate TargetType="ToggleButton">
+                                <Border BorderBrush="{TemplateBinding BorderBrush}" 
+                                        Background="{TemplateBinding Background}">
+                                    <ContentPresenter HorizontalAlignment="Center"
+                                              VerticalAlignment="Center"/>
+                                </Border>
+                            </ControlTemplate>
+                        </Setter.Value>
+                    </Setter>
+                    <Style.Triggers>
+                        <Trigger Property="IsChecked" Value="False">
+                            <Setter Property="Foreground" Value="LightGray"/>
+                        </Trigger>
+                        <Trigger Property="IsChecked" Value="True">
+                            <Setter Property="Foreground" Value="White"/>
+                        </Trigger>
+                        <Trigger Property="IsMouseOver" Value="True">
+                            <Setter Property="Foreground" Value="Gray"/>
+                        </Trigger>
+                    </Style.Triggers>
+                </Style>
+            </ToggleButton.Style>
+            <Viewbox>
+                <Grid>
+                    <Path Stroke="{Binding Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType=ToggleButton}, Mode=OneWay}" Data="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"/>
+                    <Ellipse Stroke="{Binding Foreground, RelativeSource={RelativeSource FindAncestor, AncestorType=ToggleButton}, Mode=OneWay}" Height="12" Width="12" HorizontalAlignment="Center" VerticalAlignment="Stretch"/>
+                </Grid>
+            </Viewbox>
+        </ToggleButton>
+
     </Grid>
 </UserControl>

PixiEditor/Views/UserControls/PreviewWindow.xaml.cs

@@ -50,17 +50,26 @@ namespace PixiEditor.Views.UserControls
             set => SetValue(PrimaryColorProperty, value);
         }
 
+        public static readonly DependencyProperty OptionsOpenProperty =
+            DependencyProperty.Register(nameof(OptionsOpen), typeof(bool), typeof(PreviewWindow));
+
+        public bool OptionsOpen
+        {
+            get => (bool)GetValue(OptionsOpenProperty);
+            set => SetValue(OptionsOpenProperty, value);
+        }
+
         public PreviewWindow()
         {
             InitializeComponent();
 
-            MouseMove += PreviewWindow_MouseMove;
-            MouseRightButtonDown += PreviewWindow_MouseRightButtonDown;
-            MouseEnter += PreviewWindow_MouseEnter;
-            MouseLeave += PreviewWindow_MouseLeave;
+            imageGrid.MouseMove += ImageGrid_MouseMove;
+            imageGrid.MouseRightButtonDown += ImageGrid_MouseRightButtonDown;
+            imageGrid.MouseEnter += ImageGrid_MouseEnter;
+            imageGrid.MouseLeave += ImageGrid_MouseLeave;
         }
 
-        private void PreviewWindow_MouseLeave(object sender, MouseEventArgs e)
+        private void ImageGrid_MouseLeave(object sender, MouseEventArgs e)
         {
             if (ViewModelMain.Current != null)
             {
@@ -68,7 +77,7 @@ namespace PixiEditor.Views.UserControls
             }
         }
 
-        private void PreviewWindow_MouseEnter(object sender, MouseEventArgs e)
+        private void ImageGrid_MouseEnter(object sender, MouseEventArgs e)
         {
             if (ViewModelMain.Current != null)
             {
@@ -77,7 +86,7 @@ namespace PixiEditor.Views.UserControls
             }
         }
 
-        private void PreviewWindow_MouseRightButtonDown(object sender, MouseButtonEventArgs e)
+        private void ImageGrid_MouseRightButtonDown(object sender, MouseButtonEventArgs e)
         {
             if (Keyboard.IsKeyDown(Key.LeftShift))
             {
@@ -106,7 +115,7 @@ namespace PixiEditor.Views.UserControls
             }
         }
 
-        private void PreviewWindow_MouseMove(object sender, MouseEventArgs e)
+        private void ImageGrid_MouseMove(object sender, MouseEventArgs e)
         {
             if (Document == null)
             {