Browse Source

Added toolbar and some brush reference fixes

Krzysztof Krysiński 1 year ago
parent
commit
42b7d90e72

+ 1 - 0
src/PixiEditor.AvaloniaUI/Views/Main/MainTitleBar.axaml

@@ -7,6 +7,7 @@
              xmlns:dataHolders="clr-namespace:PixiEditor.AvaloniaUI.Models.UserData"
              xmlns:dataHolders="clr-namespace:PixiEditor.AvaloniaUI.Models.UserData"
              xmlns:viewModels="clr-namespace:PixiEditor.AvaloniaUI.ViewModels"
              xmlns:viewModels="clr-namespace:PixiEditor.AvaloniaUI.ViewModels"
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
+             Background="{DynamicResource ThemeBackgroundBrush1}"
              x:Class="PixiEditor.AvaloniaUI.Views.Main.MainTitleBar">
              x:Class="PixiEditor.AvaloniaUI.Views.Main.MainTitleBar">
             <xaml:Menu
             <xaml:Menu
                 Margin="10, 0, 0, 0"
                 Margin="10, 0, 0, 0"

+ 84 - 0
src/PixiEditor.AvaloniaUI/Views/Main/Tools/Toolbar.axaml

@@ -0,0 +1,84 @@
+<UserControl xmlns="https://github.com/avaloniaui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+             xmlns:cmds="clr-namespace:PixiEditor.AvaloniaUI.Models.Commands.XAML"
+             xmlns:ui="clr-namespace:PixiEditor.Extensions.UI;assembly=PixiEditor.Extensions"
+             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
+             x:Class="PixiEditor.AvaloniaUI.Views.Main.Tools.Toolbar">
+     <StackPanel
+                Background="{DynamicResource ThemeBackgroundBrush1}"
+                Orientation="Horizontal"
+                Grid.ColumnSpan="3"
+                Grid.Column="0"
+                Grid.Row="1">
+                <Button
+                    Margin="1,0,0,0"
+                    Command="{cmds:Command PixiEditor.Undo.Undo}"
+                    ui:Translator.TooltipKey="UNDO"
+                    Classes="ToolSettingsGlyphButton"
+					Content="&#xE7A7;"/>
+                <Button
+				Command="{cmds:Command PixiEditor.Undo.Redo}"
+				ui:Translator.TooltipKey="REDO"
+                Classes="ToolSettingsGlyphButton"
+				Content="&#xE7A6;"/>
+                <ToggleButton
+				Width="30"
+				BorderThickness="0"
+				ui:Translator.TooltipKey="PEN_MODE"
+				Focusable="False"
+                IsChecked="{Binding StylusSubViewModel.IsPenModeEnabled}">
+                    <ToggleButton.Styles>
+                        <Style Selector="ToggleButton">
+                            <Setter Property="Template">
+                                <Setter.Value>
+                                    <ControlTemplate TargetType="ToggleButton">
+                                        <Border BorderBrush="{TemplateBinding BorderBrush}"
+                                            Background="{TemplateBinding Background}" Focusable="False">
+                                            <ContentPresenter HorizontalAlignment="Center"
+                                              VerticalAlignment="Center" Focusable="False"/>
+                                        </Border>
+                                    </ControlTemplate>
+                                </Setter.Value>
+                            </Setter>
+                            <!--TODO: Implement-->
+                            <!--<Style.Triggers>
+                                <Trigger Property="IsChecked" Value="False">
+                                    <Setter Property="Background" Value="Transparent"/>
+                                </Trigger>
+                                <Trigger Property="IsMouseOver" Value="True">
+                                    <Setter Property="Background" Value="#404040"/>
+                                </Trigger>
+                                <Trigger Property="IsChecked" Value="True">
+                                    <Setter Property="Background" Value="#707070"/>
+                                </Trigger>
+                            </Style.Triggers>-->
+                        </Style>
+                    </ToggleButton.Styles>
+                    <Image Height="20" Source="/Images/penMode.png"/>
+                </ToggleButton>
+                <Grid Margin="5,5,10,5" Background="{StaticResource BrighterAccentColor}" Width="5"/>
+                <Label Classes="BaseLabel" FontSize="12"
+                   VerticalAlignment="Center" ui:Translator.Key="{Binding ToolsSubViewModel.ActiveTool.DisplayName.Key}"
+                   ui:Translator.TooltipLocalizedString="{Binding ToolsSubViewModel.ActiveTool.ActionDisplay}"
+                   />
+                <ItemsControl ItemsSource="{Binding ToolsSubViewModel.ActiveTool.Toolbar.Settings}">
+                    <ItemsControl.ItemsPanel>
+                        <ItemsPanelTemplate>
+                            <StackPanel Orientation="Horizontal" Margin="10, 0, 0, 0" />
+                        </ItemsPanelTemplate>
+                    </ItemsControl.ItemsPanel>
+                    <ItemsControl.ItemTemplate>
+                        <DataTemplate>
+                            <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Margin="10,0,10,0">
+                                <Label
+                                IsVisible="{Binding HasLabel}"
+                                Foreground="White" ui:Translator.Key="{Binding Label.Key}" />
+                                <ContentControl Content="{Binding SettingControl}" />
+                            </StackPanel>
+                        </DataTemplate>
+                    </ItemsControl.ItemTemplate>
+                </ItemsControl>
+            </StackPanel>
+</UserControl>

+ 14 - 0
src/PixiEditor.AvaloniaUI/Views/Main/Tools/Toolbar.axaml.cs

@@ -0,0 +1,14 @@
+using Avalonia;
+using Avalonia.Controls;
+using Avalonia.Markup.Xaml;
+
+namespace PixiEditor.AvaloniaUI.Views.Main.Tools;
+
+public partial class Toolbar : UserControl
+{
+    public Toolbar()
+    {
+        InitializeComponent();
+    }
+}
+

+ 1 - 0
src/PixiEditor.AvaloniaUI/Views/Main/Viewport.axaml

@@ -142,6 +142,7 @@
                 RenderOptions.BitmapInterpolationMode="None">
                 RenderOptions.BitmapInterpolationMode="None">
                 <Border.Background>
                 <Border.Background>
                     <!--TODO: Seems like DestinationRect of anything with size below and equal to 1 is tiling texture wrong-->
                     <!--TODO: Seems like DestinationRect of anything with size below and equal to 1 is tiling texture wrong-->
+                    <!--Update: Seems like it depends on screen DPI and scaling, value of 2 also produces artifacts on high DPI device-->
                     <ImageBrush Source="/Images/CheckerTile.png" TileMode="Tile">
                     <ImageBrush Source="/Images/CheckerTile.png" TileMode="Tile">
                         <ImageBrush.Transform>
                         <ImageBrush.Transform>
                             <ScaleTransform ScaleX="0.5" ScaleY="0.5"/>
                             <ScaleTransform ScaleX="0.5" ScaleY="0.5"/>

+ 5 - 2
src/PixiEditor.AvaloniaUI/Views/MainView.axaml

@@ -11,6 +11,7 @@
              xmlns:dock="clr-namespace:PixiEditor.AvaloniaUI.ViewModels.Dock"
              xmlns:dock="clr-namespace:PixiEditor.AvaloniaUI.ViewModels.Dock"
              xmlns:zoombox="clr-namespace:PixiEditor.Zoombox;assembly=PixiEditor.Zoombox"
              xmlns:zoombox="clr-namespace:PixiEditor.Zoombox;assembly=PixiEditor.Zoombox"
              xmlns:layers="clr-namespace:PixiEditor.AvaloniaUI.Views.Layers"
              xmlns:layers="clr-namespace:PixiEditor.AvaloniaUI.Views.Layers"
+             xmlns:tools="clr-namespace:PixiEditor.AvaloniaUI.Views.Main.Tools"
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
              mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
              x:Class="PixiEditor.AvaloniaUI.Views.MainView"
              x:Class="PixiEditor.AvaloniaUI.Views.MainView"
              x:DataType="viewModels1:ViewModelMain" Background="{DynamicResource ThemeBackgroundBrush}">
              x:DataType="viewModels1:ViewModelMain" Background="{DynamicResource ThemeBackgroundBrush}">
@@ -22,14 +23,16 @@
     <Grid Focusable="True">
     <Grid Focusable="True">
         <Grid.RowDefinitions>
         <Grid.RowDefinitions>
             <RowDefinition Height="25"/>
             <RowDefinition Height="25"/>
+            <RowDefinition Height="45"/>
             <RowDefinition Height="*"/>
             <RowDefinition Height="*"/>
         </Grid.RowDefinitions>
         </Grid.RowDefinitions>
         <main1:MainTitleBar/>
         <main1:MainTitleBar/>
-        <main1:ToolsPicker ZIndex="2" Grid.Row="1"
+        <tools:Toolbar Grid.Row="1" DataContext="{Binding .}"/>
+        <main1:ToolsPicker ZIndex="2" Grid.Row="2"
                            Margin="10 0 0 0"
                            Margin="10 0 0 0"
                            HorizontalAlignment="Left"
                            HorizontalAlignment="Left"
                            VerticalAlignment="Center"
                            VerticalAlignment="Center"
                            Tools="{Binding Path=ToolsSubViewModel.ToolSet}"/>
                            Tools="{Binding Path=ToolsSubViewModel.ToolSet}"/>
-        <DockControl Grid.Row="1" Layout="{Binding LayoutDockSubViewModel.Layout}"/>
+        <DockControl Grid.Row="2" Layout="{Binding LayoutDockSubViewModel.Layout}"/>
     </Grid>
     </Grid>
 </UserControl>
 </UserControl>

+ 1 - 1
src/PixiEditor.AvaloniaUI/Views/Palettes/PaletteColorControl.axaml

@@ -36,7 +36,7 @@
         </Border>
         </Border>
         <Border HorizontalAlignment="Right" VerticalAlignment="Bottom" Width="15" Margin="0 0 0 -1"
         <Border HorizontalAlignment="Right" VerticalAlignment="Bottom" Width="15" Margin="0 0 0 -1"
                 IsVisible="{Binding ElementName=uc, Path=AssociatedKey, Converter={converters:NotNullToVisibilityConverter}}"
                 IsVisible="{Binding ElementName=uc, Path=AssociatedKey, Converter={converters:NotNullToVisibilityConverter}}"
-                Background="{DynamicResource ThemeBackground1Brush}" CornerRadius="3.5 0 3.5 0">
+                Background="{DynamicResource ThemeBackgroundBrush1}" CornerRadius="3.5 0 3.5 0">
             <TextBlock Foreground="White" FontSize="16" HorizontalAlignment="Center" Margin="1 0 0 0"
             <TextBlock Foreground="White" FontSize="16" HorizontalAlignment="Center" Margin="1 0 0 0"
                                         Text="{Binding AssociatedKey, ElementName=uc}"/>
                                         Text="{Binding AssociatedKey, ElementName=uc}"/>
         </Border>
         </Border>