1
0
mirror of https://github.com/Artemis-RGB/Artemis synced 2026-01-01 18:23:32 +00:00

Finished profile editor panels structure

This commit is contained in:
SpoinkyNL 2019-11-26 20:20:15 +01:00
parent 06f014a294
commit 8c9144a136
2 changed files with 47 additions and 48 deletions

View File

@ -8,7 +8,7 @@
xmlns:profileEditor="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor" xmlns:profileEditor="clr-namespace:Artemis.UI.Screens.Module.ProfileEditor"
mc:Ignorable="d" mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800" d:DesignHeight="450" d:DesignWidth="800"
d:DataContext="{x:Type profileEditor:ProfileEditorViewModel}"> d:DataContext="{d:DesignInstance Type=profileEditor:ProfileEditorViewModel, IsDesignTimeCreatable=False}">
<UserControl.Resources> <UserControl.Resources>
<ResourceDictionary> <ResourceDictionary>
<ResourceDictionary.MergedDictionaries> <ResourceDictionary.MergedDictionaries>
@ -20,37 +20,36 @@
</ResourceDictionary> </ResourceDictionary>
</UserControl.Resources> </UserControl.Resources>
<!-- Blue -->
<Grid Margin="16"> <Grid Margin="16">
<Grid.ColumnDefinitions> <Grid.ColumnDefinitions>
<!-- Left side -->
<ColumnDefinition Width="*" MinWidth="100" /> <ColumnDefinition Width="*" MinWidth="100" />
<!-- Side panels resize -->
<ColumnDefinition Width="Auto" /> <ColumnDefinition Width="Auto" />
<ColumnDefinition Width="{Binding ProfileElementsWidth.Value, Mode=TwoWay}" MinWidth="100" /> <!-- Side panels -->
<ColumnDefinition Width="{Binding SidePanelsWidth.Value, Mode=TwoWay}" MinWidth="100" />
</Grid.ColumnDefinitions> </Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*" MinHeight="100" />
<RowDefinition Height="Auto" />
<RowDefinition Height="{Binding LayerElementsHeight.Value, Mode=TwoWay}" MinHeight="100" />
</Grid.RowDefinitions>
<!-- Left side --> <!-- Left side (orange) -->
<Grid Grid.Row="0" Grid.Column="0"> <Grid Grid.Row="0" Grid.Column="0">
<Grid.RowDefinitions> <Grid.RowDefinitions>
<!-- Introduction --> <!-- Introduction -->
<RowDefinition Height="Auto"/> <RowDefinition Height="35" />
<!-- Design area --> <!-- Design area -->
<RowDefinition Height="*" MinHeight="200"/> <RowDefinition Height="*" MinHeight="200" />
<!-- Bottom panels resize --> <!-- Bottom panels resize -->
<RowDefinition Height="Auto"/> <RowDefinition Height="Auto" />
<!-- Bottom panels --> <!-- Bottom panels -->
<RowDefinition Height="{Binding BottomPanelsHeight.Value, Mode=TwoWay}" MinHeight="100"/> <RowDefinition Height="{Binding BottomPanelsHeight.Value, Mode=TwoWay}" MinHeight="100" />
</Grid.RowDefinitions> </Grid.RowDefinitions>
<!-- Introduction --> <!-- Introduction -->
<StackPanel Grid.Row="0" Margin="0 0 15 0"> <StackPanel Grid.Row="0">
<TextBlock> <TextBlock>
<materialDesign:PackIcon Kind="AboutOutline" Margin="0 0 0 -4" /> The profile defines what colors the LEDs will have. Multiple groups of LEDs are defined into layers. On these layers you can apply effects. <materialDesign:PackIcon Kind="AboutOutline" /> The profile defines what colors the LEDs will have. Multiple groups of LEDs are defined into layers. On these layers you can apply effects.
</TextBlock> </TextBlock>
<Separator Style="{StaticResource MaterialDesignDarkSeparator}" /> <Separator Style="{StaticResource MaterialDesignDarkSeparator}" Margin="0 -2.5 0 0" />
</StackPanel> </StackPanel>
<!-- Design area --> <!-- Design area -->
@ -61,11 +60,14 @@
<!-- Bottom panels resize --> <!-- Bottom panels resize -->
<GridSplitter Grid.Row="2" Grid.Column="0" Height="5" HorizontalAlignment="Stretch" Cursor="SizeNS" Margin="0 5" /> <GridSplitter Grid.Row="2" Grid.Column="0" Height="5" HorizontalAlignment="Stretch" Cursor="SizeNS" Margin="0 5" />
<!-- Bottom panels --> <!-- Bottom panels (green) -->
<Grid Grid.Row="3"> <Grid Grid.Row="3">
<Grid.ColumnDefinitions> <Grid.ColumnDefinitions>
<!-- Layer elements -->
<ColumnDefinition Width="*" MinWidth="100" /> <ColumnDefinition Width="*" MinWidth="100" />
<!-- Element properties resize -->
<ColumnDefinition Width="Auto" /> <ColumnDefinition Width="Auto" />
<!-- Element properties -->
<ColumnDefinition Width="{Binding ElementPropertiesWidth.Value, Mode=TwoWay}" MinWidth="100" /> <ColumnDefinition Width="{Binding ElementPropertiesWidth.Value, Mode=TwoWay}" MinWidth="100" />
</Grid.ColumnDefinitions> </Grid.ColumnDefinitions>
@ -84,11 +86,22 @@
</Grid> </Grid>
</Grid> </Grid>
<!-- Right panels resize --> <!-- Side panels resize -->
<GridSplitter Grid.Row="0" Grid.Column="1" Width="5" HorizontalAlignment="Stretch" Cursor="SizeWE" Margin="5 0" /> <GridSplitter Grid.Row="0" Grid.Column="1" Width="5" HorizontalAlignment="Stretch" Cursor="SizeWE" Margin="5 35 5 0" />
<!-- Right side --> <!-- Side panels (orange) -->
<Grid Grid.Row="0" Grid.Column="2"> <Grid Grid.Row="0" Grid.Column="2">
<Grid.RowDefinitions>
<!-- Profile selection -->
<RowDefinition Height="35" />
<!-- Profile elements -->
<RowDefinition Height="*" MinHeight="100" />
<!-- Conditions resize -->
<RowDefinition Height="Auto" />
<!-- Display conditions -->
<RowDefinition Height="{Binding DisplayConditionsHeight.Value, Mode=TwoWay}" MinHeight="100" />
</Grid.RowDefinitions>
<!-- Profile selection --> <!-- Profile selection -->
<Grid Grid.Row="0"> <Grid Grid.Row="0">
<Grid.ColumnDefinitions> <Grid.ColumnDefinitions>
@ -127,32 +140,18 @@
</Button> </Button>
</Grid> </Grid>
</Grid> <!-- Profile elements -->
<materialDesign:Card Grid.Row="1" materialDesign:ShadowAssist.ShadowDepth="Depth1" VerticalAlignment="Stretch">
<ContentControl s:View.Model="{Binding ProfileElementsViewModel}" Margin="0,-1,-0.2,1" />
<GridSplitter Grid.Row="1" Grid.Column="1" Width="5" HorizontalAlignment="Stretch" Cursor="SizeWE" Margin="5 0" />
<!-- Right panels -->
<Grid Grid.Row="1" Grid.Column="2">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
<RowDefinition Height="{Binding DisplayConditionsHeight.Value, Mode=TwoWay}" MinHeight="100" />
</Grid.RowDefinitions>
<materialDesign:Card Grid.Row="0" materialDesign:ShadowAssist.ShadowDepth="Depth1" VerticalAlignment="Stretch">
<ContentControl s:View.Model="{Binding ProfileElementsViewModel}" />
</materialDesign:Card> </materialDesign:Card>
<GridSplitter Grid.Row="1" Height="5" HorizontalAlignment="Stretch" Cursor="SizeNS" Margin="0 5" /> <!-- Conditions resize -->
<GridSplitter Grid.Row="2" Height="5" HorizontalAlignment="Stretch" Cursor="SizeNS" Margin="0 5" />
<materialDesign:Card Grid.Row="2" materialDesign:ShadowAssist.ShadowDepth="Depth1" VerticalAlignment="Stretch"> <!-- Display conditions -->
<materialDesign:Card Grid.Row="3" materialDesign:ShadowAssist.ShadowDepth="Depth1" VerticalAlignment="Stretch">
<ContentControl s:View.Model="{Binding DisplayConditionsViewModel}" /> <ContentControl s:View.Model="{Binding DisplayConditionsViewModel}" />
</materialDesign:Card> </materialDesign:Card>
</Grid> </Grid>
<GridSplitter Grid.Row="2" Grid.Column="0" Height="5" HorizontalAlignment="Stretch" Cursor="SizeNS" Margin="0 5" />
</Grid> </Grid>
</UserControl> </UserControl>

View File

@ -55,9 +55,9 @@ namespace Artemis.UI.Screens.Module.ProfileEditor
public ProfileViewModel ProfileViewModel { get; } public ProfileViewModel ProfileViewModel { get; }
public BindableCollection<Profile> Profiles { get; set; } public BindableCollection<Profile> Profiles { get; set; }
public PluginSetting<GridLength> ProfileElementsWidth { get; set; } public PluginSetting<GridLength> SidePanelsWidth { get; set; }
public PluginSetting<GridLength> DisplayConditionsHeight { get; set; } public PluginSetting<GridLength> DisplayConditionsHeight { get; set; }
public PluginSetting<GridLength> LayerElementsHeight { get; set; } public PluginSetting<GridLength> BottomPanelsHeight { get; set; }
public PluginSetting<GridLength> ElementPropertiesWidth { get; set; } public PluginSetting<GridLength> ElementPropertiesWidth { get; set; }
public Profile SelectedProfile public Profile SelectedProfile
@ -157,17 +157,17 @@ namespace Artemis.UI.Screens.Module.ProfileEditor
private void LoadWorkspaceSettings() private void LoadWorkspaceSettings()
{ {
ProfileElementsWidth = _settingsService.GetSetting("ProfileEditor.ProfileElementsWidth", new GridLength(550)); SidePanelsWidth = _settingsService.GetSetting("ProfileEditor.SidePanelsWidth", new GridLength(385));
DisplayConditionsHeight = _settingsService.GetSetting("ProfileEditor.DisplayConditionsHeight", new GridLength(320)); DisplayConditionsHeight = _settingsService.GetSetting("ProfileEditor.DisplayConditionsHeight", new GridLength(345));
LayerElementsHeight = _settingsService.GetSetting("ProfileEditor.LayerElementsHeight", new GridLength(350)); BottomPanelsHeight = _settingsService.GetSetting("ProfileEditor.BottomPanelsHeight", new GridLength(265));
ElementPropertiesWidth = _settingsService.GetSetting("ProfileEditor.ElementPropertiesWidth", new GridLength(920)); ElementPropertiesWidth = _settingsService.GetSetting("ProfileEditor.ElementPropertiesWidth", new GridLength(545));
} }
private void SaveWorkspaceSettings() private void SaveWorkspaceSettings()
{ {
ProfileElementsWidth.Save(); SidePanelsWidth.Save();
DisplayConditionsHeight.Save(); DisplayConditionsHeight.Save();
LayerElementsHeight.Save(); BottomPanelsHeight.Save();
ElementPropertiesWidth.Save(); ElementPropertiesWidth.Save();
} }