Moved Menu into SplitView - Added Button to open SplitView
This commit is contained in:
Ano-sys
+2
-2
@@ -19,7 +19,7 @@
|
||||
<PackageReference Include="Avalonia.Fonts.Inter" Version="11.2.4" />
|
||||
<!--Condition below is needed to remove Avalonia.Diagnostics package from build output in Release configuration.-->
|
||||
<PackageReference Condition="'$(Configuration)' == 'Debug'" Include="Avalonia.Diagnostics" Version="11.2.4" />
|
||||
<PackageReference Include="Avalonia.Xaml.Interactions" Version="11.2.0.8" />
|
||||
<PackageReference Include="CommunityToolkit.Mvvm" Version="8.2.1"/>
|
||||
<PackageReference Include="Avalonia.Xaml.Interactions" Version="11.2.0.9" />
|
||||
<PackageReference Include="CommunityToolkit.Mvvm" Version="8.4.0" />
|
||||
</ItemGroup>
|
||||
</Project>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
using Avalonia;
|
||||
using System;
|
||||
using Avalonia;
|
||||
using Avalonia.Input;
|
||||
using Avalonia.Media;
|
||||
using CommunityToolkit.Mvvm.Input;
|
||||
@@ -11,6 +12,8 @@ public class MainWindowViewModel : ViewModelBase
|
||||
#pragma warning disable CA1822 // Mark members as static
|
||||
public MainWindowViewModel()
|
||||
{
|
||||
DisplaySplitEvent = new RelayCommand(DisplaySplit);
|
||||
|
||||
ColorPalette =
|
||||
[
|
||||
new ColorPickerButton
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
using System.Collections.ObjectModel;
|
||||
using System;
|
||||
using System.Collections.ObjectModel;
|
||||
using System.ComponentModel.DataAnnotations;
|
||||
using Avalonia.Input;
|
||||
using Avalonia.Media;
|
||||
@@ -36,4 +37,26 @@ public class ViewModelBase : ObservableObject
|
||||
get => _brushThickness;
|
||||
set => SetProperty(ref _brushThickness, value);
|
||||
}
|
||||
|
||||
private double _buttonOffset = 0;
|
||||
|
||||
public double ButtonOffset
|
||||
{
|
||||
get => _buttonOffset;
|
||||
set => SetProperty(ref _buttonOffset, value);
|
||||
}
|
||||
|
||||
private bool _isSplitOpen = false;
|
||||
|
||||
public bool IsSplitOpen
|
||||
{
|
||||
get => _isSplitOpen;
|
||||
set => SetProperty(ref _isSplitOpen, value);
|
||||
}
|
||||
|
||||
public IRelayCommand DisplaySplitEvent { get; protected set; }
|
||||
protected void DisplaySplit()
|
||||
{
|
||||
IsSplitOpen = !IsSplitOpen;
|
||||
}
|
||||
}
|
||||
|
||||
+100
-84
@@ -11,6 +11,9 @@
|
||||
xmlns:componentModel="clr-namespace:CommunityToolkit.Mvvm.ComponentModel;assembly=CommunityToolkit.Mvvm"
|
||||
xmlns:system="clr-namespace:System;assembly=System.Runtime"
|
||||
x:DataType="vm:MainWindowViewModel"
|
||||
TransparencyLevelHint="Transparent"
|
||||
TransparencyBackgroundFallback="DimGray"
|
||||
Background="Transparent"
|
||||
Icon="/Assets/avalonia-logo.ico"
|
||||
Title="SimpleDraw"
|
||||
Width="{Binding WindowWidth}"
|
||||
@@ -28,96 +31,109 @@
|
||||
to set the actual DataContext for runtime, set the DataContext property in code (look at App.axaml.cs) -->
|
||||
<vm:MainWindowViewModel/>
|
||||
</Design.DataContext>
|
||||
|
||||
<DockPanel>
|
||||
<Menu DockPanel.Dock="Top">
|
||||
<MenuItem Header="_File">
|
||||
<MenuItem Header="_Open..."/>
|
||||
<Separator/>
|
||||
<MenuItem Header="_Exit"/>
|
||||
</MenuItem>
|
||||
<MenuItem Header="_Edit">
|
||||
<MenuItem Header="Copy"/>
|
||||
<MenuItem Header="Paste"/>
|
||||
</MenuItem>
|
||||
</Menu>
|
||||
<Grid Background="Gray">
|
||||
<Grid.ColumnDefinitions>
|
||||
<ColumnDefinition Width="105"></ColumnDefinition>
|
||||
<ColumnDefinition Width="1*" MinWidth="300"></ColumnDefinition>
|
||||
</Grid.ColumnDefinitions>
|
||||
<Grid Grid.Column="0" Background="LightGray">
|
||||
<Grid.RowDefinitions>
|
||||
<RowDefinition Height="50*"></RowDefinition>
|
||||
<RowDefinition Height="50*"></RowDefinition>
|
||||
<RowDefinition Height="50*"></RowDefinition>
|
||||
</Grid.RowDefinitions>
|
||||
<StackPanel Grid.Row="0">
|
||||
<TextBox Text="Select Color:" IsHitTestVisible="False" IsReadOnly="True" BorderThickness="0" Background="Transparent"/>
|
||||
<ItemsControl ItemsSource="{Binding ColorPalette}">
|
||||
|
||||
<Panel Background="Transparent">
|
||||
<SplitView Background="Transparent" IsPaneOpen="{Binding IsSplitOpen, Mode=TwoWay}" DisplayMode="Overlay" OpenPaneLength="250">
|
||||
<SplitView.Pane>
|
||||
<Border Background="Transparent" BorderBrush="Gray" BorderThickness="2">
|
||||
<Grid Background="Transparent">
|
||||
<Grid Background="Transparent">
|
||||
<Grid.RowDefinitions>
|
||||
<RowDefinition Height="25"></RowDefinition>
|
||||
<RowDefinition Height="50*"></RowDefinition>
|
||||
<RowDefinition Height="50*"></RowDefinition>
|
||||
<RowDefinition Height="50*"></RowDefinition>
|
||||
</Grid.RowDefinitions>
|
||||
<DockPanel Grid.Row="0" Background="Transparent">
|
||||
<Menu DockPanel.Dock="Top" Background="Transparent" HorizontalAlignment="Left">
|
||||
<MenuItem Header="_File">
|
||||
<MenuItem Header="_Open..."/>
|
||||
<Separator/>
|
||||
<MenuItem Header="_Exit"/>
|
||||
</MenuItem>
|
||||
<MenuItem Header="_Edit">
|
||||
<MenuItem Header="Copy"/>
|
||||
<MenuItem Header="Paste"/>
|
||||
</MenuItem>
|
||||
</Menu>
|
||||
</DockPanel>
|
||||
|
||||
<StackPanel Grid.Row="1">
|
||||
<TextBox Text="Select Color:" IsHitTestVisible="False" IsReadOnly="True" BorderThickness="0" Background="Transparent"/>
|
||||
<ItemsControl ItemsSource="{Binding ColorPalette}">
|
||||
<ItemsControl.ItemsPanel>
|
||||
<ItemsPanelTemplate>
|
||||
<WrapPanel Orientation="Horizontal" />
|
||||
</ItemsPanelTemplate>
|
||||
</ItemsControl.ItemsPanel>
|
||||
<ItemsControl.ItemTemplate>
|
||||
<DataTemplate x:DataType="models:ColorPickerButton">
|
||||
<Button Margin="5,0,0,5"
|
||||
BorderBrush="DimGray"
|
||||
BorderThickness="2"
|
||||
CornerRadius="12.5"
|
||||
Background="{Binding Color}"
|
||||
Width="20"
|
||||
Height="20"
|
||||
Command="{Binding SelectColorCommand}"
|
||||
CommandParameter="{Binding}"
|
||||
/>
|
||||
</DataTemplate>
|
||||
</ItemsControl.ItemTemplate>
|
||||
</ItemsControl>
|
||||
<TextBox HorizontalAlignment="Left" TextAlignment="Left" Margin="5,5,5,0" IsHitTestVisible="False" IsReadOnly="True" BorderThickness="0" Background="Transparent">
|
||||
Brush Size:
|
||||
</TextBox>
|
||||
<TextBox Text="{Binding BrushThickness, Mode=TwoWay}" Margin="5,0" HorizontalAlignment="Stretch" TextAlignment="Left" BorderThickness="2" Background="Transparent"></TextBox>
|
||||
<Slider Margin="5, 0" Value="{Binding BrushThickness}" Maximum="50" Minimum="0.5"></Slider>
|
||||
</StackPanel>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Border>
|
||||
</SplitView.Pane>
|
||||
<Canvas Grid.Column="1" Background="White" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
|
||||
<i:Interaction.Behaviors>
|
||||
<behaviors:EventTriggerBehavior EventName="PointerPressed">
|
||||
<behaviors:InvokeCommandAction
|
||||
Command="{Binding CanvasPointerPressedCommand}"
|
||||
PassEventArgsToCommand="True" />
|
||||
</behaviors:EventTriggerBehavior>
|
||||
<behaviors:EventTriggerBehavior EventName="PointerMoved">
|
||||
<behaviors:InvokeCommandAction
|
||||
Command="{Binding CanvasPointerMovedCommand}"
|
||||
PassEventArgsToCommand="True" />
|
||||
</behaviors:EventTriggerBehavior>
|
||||
<behaviors:EventTriggerBehavior EventName="PointerReleased">
|
||||
<behaviors:InvokeCommandAction
|
||||
Command="{Binding CanvasPointerReleasedCommand}"
|
||||
PassEventArgsToCommand="True" />
|
||||
</behaviors:EventTriggerBehavior>
|
||||
</i:Interaction.Behaviors>
|
||||
|
||||
<ItemsControl ItemsSource="{Binding DrawingPoints}">
|
||||
<ItemsControl.ItemsPanel>
|
||||
<ItemsPanelTemplate>
|
||||
<WrapPanel Orientation="Horizontal" />
|
||||
<Panel HorizontalAlignment="Stretch" VerticalAlignment="Stretch" MinWidth="{Binding WindowWidth}" MinHeight="{Binding WindowHeight}"/>
|
||||
</ItemsPanelTemplate>
|
||||
</ItemsControl.ItemsPanel>
|
||||
<ItemsControl.ItemTemplate>
|
||||
<DataTemplate x:DataType="models:ColorPickerButton">
|
||||
<Button Margin="5,0,0,5"
|
||||
BorderBrush="DimGray"
|
||||
BorderThickness="2"
|
||||
CornerRadius="12.5"
|
||||
Background="{Binding Color}"
|
||||
Width="20"
|
||||
Height="20"
|
||||
Command="{Binding SelectColorCommand}"
|
||||
CommandParameter="{Binding}"
|
||||
/>
|
||||
<DataTemplate>
|
||||
<Polyline Points="{Binding CurrentDrawingPoints}"
|
||||
Stroke="{Binding Brush}"
|
||||
StrokeThickness="{Binding BrushThickness}"
|
||||
>
|
||||
</Polyline>
|
||||
</DataTemplate>
|
||||
</ItemsControl.ItemTemplate>
|
||||
</ItemsControl>
|
||||
<TextBox HorizontalAlignment="Left" TextAlignment="Left" Margin="5,5,5,0" IsHitTestVisible="False" IsReadOnly="True" BorderThickness="0" Background="Transparent">
|
||||
Brush Size:
|
||||
</TextBox>
|
||||
<TextBox Text="{Binding BrushThickness, Mode=TwoWay}" Margin="5,0" HorizontalAlignment="Stretch" TextAlignment="Left" BorderThickness="2" Background="Transparent"></TextBox>
|
||||
<Slider Margin="5, 0" Value="{Binding BrushThickness}" Maximum="50" Minimum="0.5"></Slider>
|
||||
</StackPanel>
|
||||
</Grid>
|
||||
<Canvas Grid.Column="1" Background="White" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
|
||||
<i:Interaction.Behaviors>
|
||||
<behaviors:EventTriggerBehavior EventName="PointerPressed">
|
||||
<behaviors:InvokeCommandAction
|
||||
Command="{Binding CanvasPointerPressedCommand}"
|
||||
PassEventArgsToCommand="True" />
|
||||
</behaviors:EventTriggerBehavior>
|
||||
<behaviors:EventTriggerBehavior EventName="PointerMoved">
|
||||
<behaviors:InvokeCommandAction
|
||||
Command="{Binding CanvasPointerMovedCommand}"
|
||||
PassEventArgsToCommand="True" />
|
||||
</behaviors:EventTriggerBehavior>
|
||||
<behaviors:EventTriggerBehavior EventName="PointerReleased">
|
||||
<behaviors:InvokeCommandAction
|
||||
Command="{Binding CanvasPointerReleasedCommand}"
|
||||
PassEventArgsToCommand="True" />
|
||||
</behaviors:EventTriggerBehavior>
|
||||
</i:Interaction.Behaviors>
|
||||
|
||||
<ItemsControl ItemsSource="{Binding DrawingPoints}">
|
||||
<ItemsControl.ItemsPanel>
|
||||
<ItemsPanelTemplate>
|
||||
<Panel HorizontalAlignment="Stretch" VerticalAlignment="Stretch" MinWidth="{Binding WindowWidth}" MinHeight="{Binding WindowHeight}"/>
|
||||
</ItemsPanelTemplate>
|
||||
</ItemsControl.ItemsPanel>
|
||||
<ItemsControl.ItemTemplate>
|
||||
<DataTemplate>
|
||||
<Polyline Points="{Binding CurrentDrawingPoints}"
|
||||
Stroke="{Binding Brush}"
|
||||
StrokeThickness="{Binding BrushThickness}"
|
||||
>
|
||||
</Polyline>
|
||||
</DataTemplate>
|
||||
</ItemsControl.ItemTemplate>
|
||||
</ItemsControl>
|
||||
</Canvas>
|
||||
</Grid>
|
||||
</DockPanel>
|
||||
</Canvas>
|
||||
</SplitView>
|
||||
<Button Content="≡" Command="{Binding DisplaySplitEvent}" HorizontalAlignment="Left" VerticalAlignment="Top">
|
||||
<Button.RenderTransform>
|
||||
<TranslateTransform X="{Binding ButtonOffset}" />
|
||||
</Button.RenderTransform>
|
||||
<Button.Transitions>
|
||||
</Button.Transitions>
|
||||
</Button>
|
||||
</Panel>
|
||||
</Window>
|
||||
|
||||
Reference in New Issue
Block a user