feat: add color preview control.

This commit is contained in:
rabbitism
2023-02-13 00:14:56 +08:00
parent 888d115ca8
commit bf87bfeb90
6 changed files with 274 additions and 71 deletions

View File

@@ -16,6 +16,7 @@
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceInclude Source="../Controls/ColorItemControl.axaml" />
<ResourceInclude Source="../Controls/ColorDetailControl.axaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
@@ -31,6 +32,7 @@
<ToggleButton
Name="toggle"
HorizontalAlignment="Right"
IsChecked="True"
Theme="{DynamicResource BorderlessToggleButton}">
<PathIcon
Width="16"
@@ -38,39 +40,34 @@
Data="M5 2H19C20.6569 2 22 3.34315 22 5V19C22 20.6569 20.6569 22 19 22H5C3.34315 22 2 20.6569 2 19V5C2 3.34315 3.34315 2 5 2ZM6 4C5.44772 4 5 4.44772 5 5V19C5 19.5523 5.44772 20 6 20H9C9.55229 20 10 19.5523 10 19V5C10 4.44772 9.55229 4 9 4H6Z" />
</ToggleButton>
<Border IsVisible="{Binding #splitView.IsPaneOpen}" Theme="{DynamicResource CardBorder}">
<StackPanel DataContext="{Binding SelectedColor}" Spacing="8">
<Border
Height="30"
HorizontalAlignment="Stretch"
Background="{Binding Color}"
CornerRadius="3" />
<Label Classes="Code" Content="{Binding ResourceKey}" />
<TextBlock Text="{Binding Color}" />
</StackPanel>
<controls:ColorDetailControl
Background="{Binding SelectedColor.Brush}"
IsVisible="{Binding SelectedColor, Converter={x:Static ObjectConverters.IsNotNull}}"
ResourceKey="{Binding SelectedColor.ResourceKey}"
ResourceName="{Binding SelectedColor.ColorDisplayName}" />
</Border>
</StackPanel>
</SplitView.Pane>
<SplitView.Content>
<ScrollViewer>
<StackPanel>
<TabControl>
<TabItem Header="Light">
<ItemsControl Margin="16" Items="{Binding LightSeries}">
<ItemsControl Margin="16" Items="{Binding LightLists}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate x:DataType="viewModels:ColorSeries">
<DataTemplate x:DataType="viewModels:ColorListViewModel">
<ItemsControl Margin="4,0" Items="{Binding Color}">
<ItemsControl.ItemTemplate>
<DataTemplate x:DataType="viewModels:ColorItemViewModel">
<controls:ColorItemControl
Background="{Binding Color}"
ColorName="{Binding Name}"
Foreground="{Binding TextColor}"
Background="{Binding Brush}"
ColorName="{Binding ColorDisplayName}"
Foreground="{Binding TextBrush}"
Hex="{Binding Hex}" />
</DataTemplate>
</ItemsControl.ItemTemplate>
@@ -80,21 +77,21 @@
</ItemsControl>
</TabItem>
<TabItem Header="Dark">
<ItemsControl Margin="16" Items="{Binding DarkSeries}">
<ItemsControl Margin="16" Items="{Binding DarkLists}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate x:DataType="viewModels:ColorSeries">
<DataTemplate x:DataType="viewModels:ColorListViewModel">
<ItemsControl Margin="4,0" Items="{Binding Color}">
<ItemsControl.ItemTemplate>
<DataTemplate x:DataType="viewModels:ColorItemViewModel">
<controls:ColorItemControl
Background="{Binding Color}"
ColorName="{Binding Name}"
Foreground="{Binding TextColor}"
Background="{Binding Brush}"
ColorName="{Binding ColorDisplayName}"
Foreground="{Binding TextBrush}"
Hex="{Binding Hex}" />
</DataTemplate>
</ItemsControl.ItemTemplate>