zhusenlin/Semi.Avalonia
1
0
Fork 0
mirror of https://gitcode.com/gh_mirrors/se/Semi.Avalonia synced 2026-03-05 09:10:50 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #499 from irihitech/contrastdoc

Browse Source 
Add high-contrast theme demo.
This commit is contained in:
Dong Bin
2024-12-24 18:40:55 +08:00
committed by GitHub
parent 5222e64197 77cd48ecfe
commit 7ba3fbcb7a
10 changed files with 563 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
demo/Semi.Avalonia.Demo/Controls/ColorDetailControl.axaml
View File

@@ -1,12 +1,9 @@
<ResourceDictionary
xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:controls="clr-namespace:Semi.Avalonia.Demo.Controls"
xmlns:viewModels="clr-namespace:Semi.Avalonia.Demo.ViewModels"
x:CompileBindings="True"
x:DataType="viewModels:ColorItemViewModel">
xmlns:controls="clr-namespace:Semi.Avalonia.Demo.Controls">
<ControlTheme x:Key="{x:Type controls:ColorDetailControl}" TargetType="controls:ColorDetailControl">
<Setter Property="controls:ColorDetailControl.Template">
<Setter Property="Template">
<ControlTemplate TargetType="controls:ColorDetailControl">
<StackPanel>
<TextBlock

54
demo/Semi.Avalonia.Demo/Controls/ColorDetailControl.cs
View File

@@ -2,29 +2,28 @@ using System.Globalization;
using Avalonia;
using Avalonia.Controls;
using Avalonia.Controls.Primitives;
using Avalonia.Input.Platform;
using Avalonia.Media;
using Avalonia.Media.Immutable;
namespace Semi.Avalonia.Demo.Controls;
public class ColorDetailControl: TemplatedControl
public class ColorDetailControl : TemplatedControl
{
public const string KEY_ResourceKey = "ResourceKey";
public const string KEY_Hex = "Hex";
public const string KEY_Opacity = "Opacity";
public const string KEY_ColorResourceKey = "ColorResourceKey";
public static readonly StyledProperty<string?> ResourceKeyProperty = AvaloniaProperty.Register<ColorDetailControl, string?>(
nameof(ResourceKey));
public static readonly StyledProperty<string?> ResourceKeyProperty =
AvaloniaProperty.Register<ColorDetailControl, string?>(nameof(ResourceKey));
public string? ResourceKey
{
get => GetValue(ResourceKeyProperty);
set => SetValue(ResourceKeyProperty, value);
}
public static readonly StyledProperty<string?> ResourceNameProperty = AvaloniaProperty.Register<ColorDetailControl, string?>(
nameof(ResourceName));
public static readonly StyledProperty<string?> ResourceNameProperty =
AvaloniaProperty.Register<ColorDetailControl, string?>(nameof(ResourceName));
public string? ResourceName
{
@@ -32,8 +31,8 @@ public class ColorDetailControl: TemplatedControl
set => SetValue(ResourceNameProperty, value);
}
public static readonly StyledProperty<string?> ColorResourceKeyProperty = AvaloniaProperty.Register<ColorDetailControl, string?>(
nameof(ColorResourceKey));
public static readonly StyledProperty<string?> ColorResourceKeyProperty =
AvaloniaProperty.Register<ColorDetailControl, string?>(nameof(ColorResourceKey));
public string? ColorResourceKey
{
@@ -41,27 +40,28 @@ public class ColorDetailControl: TemplatedControl
set => SetValue(ColorResourceKeyProperty, value);
}
public static readonly DirectProperty<ColorDetailControl, string?> HexProperty = AvaloniaProperty.RegisterDirect<ColorDetailControl, string?>(
nameof(Hex), o => o.Hex);
public static readonly DirectProperty<ColorDetailControl, string?> HexProperty =
AvaloniaProperty.RegisterDirect<ColorDetailControl, string?>(nameof(Hex), o => o.Hex);
private string? _hex;
public string? Hex
{
get => _hex;
private set => SetAndRaise(HexProperty, ref _hex, value);
}
public static readonly DirectProperty<ColorDetailControl, string?> OpacityNumberProperty = AvaloniaProperty.RegisterDirect<ColorDetailControl, string?>(
nameof(OpacityNumber), o => o.OpacityNumber);
public static readonly DirectProperty<ColorDetailControl, string?> OpacityNumberProperty =
AvaloniaProperty.RegisterDirect<ColorDetailControl, string?>(nameof(OpacityNumber), o => o.OpacityNumber);
private string? _opacityNumber;
public string? OpacityNumber
{
get => _opacityNumber;
private set => SetAndRaise(OpacityNumberProperty, ref _opacityNumber, value);
}
static ColorDetailControl()
{
BackgroundProperty.Changed.AddClassHandler<ColorDetailControl>((o, e) => o.OnBackgroundChanged(e));
@@ -84,13 +84,17 @@ public class ColorDetailControl: TemplatedControl
{
switch (s)
{
case KEY_ResourceKey: text = ResourceKey;
case KEY_ResourceKey:
text = ResourceKey;
break;
case KEY_Hex: text = Hex;
case KEY_Hex:
text = Hex;
break;
case KEY_Opacity: text = OpacityNumber;
case KEY_Opacity:
text = OpacityNumber;
break;
case KEY_ColorResourceKey: text = ColorResourceKey;
case KEY_ColorResourceKey:
text = ColorResourceKey;
break;
default: text = string.Empty; break;
}
@@ -99,9 +103,7 @@ public class ColorDetailControl: TemplatedControl
var toplevel = TopLevel.GetTopLevel(this);
if (toplevel?.Clipboard is { } c)
{
await c.SetTextAsync(text??string.Empty);
await c.SetTextAsync(text ?? string.Empty);
}
}
}

20
demo/Semi.Avalonia.Demo/Controls/ColorItemControl.axaml
View File

@@ -1,25 +1,23 @@
<ResourceDictionary
xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:controls="using:Semi.Avalonia.Demo.Controls"
xmlns:viewModels="clr-namespace:Semi.Avalonia.Demo.ViewModels"
x:CompileBindings="True"
x:DataType="viewModels:ColorItemViewModel">
xmlns:controls="using:Semi.Avalonia.Demo.Controls">
<Design.PreviewWith>
<controls:ColorItemControl />
</Design.PreviewWith>
<ControlTheme x:Key="{x:Type controls:ColorItemControl}" TargetType="controls:ColorItemControl">
<Setter Property="controls:ColorItemControl.Width" Value="120" />
<Setter Property="controls:ColorItemControl.Height" Value="60" />
<Setter Property="controls:ColorItemControl.Cursor" Value="Hand" />
<Setter Property="controls:ColorItemControl.Template">
<Setter Property="Width" Value="120" />
<Setter Property="Height" Value="60" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="Template">
<ControlTemplate TargetType="controls:ColorItemControl">
<!-- -->
<Border
Width="{TemplateBinding Width}"
Height="{TemplateBinding Height}"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}">
<Panel>
<TextBlock
@@ -42,7 +40,7 @@
</ControlTemplate>
</Setter>
<Style Selector="^:pointerover /template/ TextBlock#PART_HexTextBlock">
<Setter Property="TextBlock.IsVisible" Value="True" />
<Setter Property="IsVisible" Value="True" />
</Style>
</ControlTheme>
</ResourceDictionary>
</ResourceDictionary>

17
demo/Semi.Avalonia.Demo/Controls/ColorItemControl.cs
View File

@@ -1,5 +1,4 @@
using Avalonia;
using Avalonia.Controls;
using Avalonia.Controls.Primitives;
using Avalonia.Input;
using CommunityToolkit.Mvvm.Messaging;
@@ -9,8 +8,8 @@ namespace Semi.Avalonia.Demo.Controls;
public class ColorItemControl : TemplatedControl
{
public static readonly StyledProperty<string?> ColorNameProperty = AvaloniaProperty.Register<ColorItemControl, string?>(
nameof(ColorName));
public static readonly StyledProperty<string?> ColorNameProperty =
AvaloniaProperty.Register<ColorItemControl, string?>(nameof(ColorName));
public string? ColorName
{
@@ -26,14 +25,18 @@ public class ColorItemControl : TemplatedControl
get => GetValue(HexProperty);
set => SetValue(HexProperty, value);
}
protected override void OnPointerPressed(PointerPressedEventArgs e)
{
base.OnPointerPressed(e);
if (this.DataContext is ColorItemViewModel v)
switch (this.DataContext)
{
WeakReferenceMessenger.Default.Send(v);
case ColorItemViewModel colorItemViewModel:
WeakReferenceMessenger.Default.Send(colorItemViewModel);
break;
case ColorResource colorResource:
WeakReferenceMessenger.Default.Send(colorResource);
break;
}
}
}

320
demo/Semi.Avalonia.Demo/Pages/HighContrastDemo.axaml Normal file
View File

@@ -0,0 +1,320 @@
<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:vm="clr-namespace:Semi.Avalonia.Demo.ViewModels"
xmlns:controls="clr-namespace:Semi.Avalonia.Demo.Controls"
mc:Ignorable="d" d:DesignWidth="1000" d:DesignHeight="1450"
x:DataType="vm:HighContrastDemoViewModel"
x:Class="Semi.Avalonia.Demo.Pages.HighContrastDemo">
<Design.DataContext>
<vm:HighContrastDemoViewModel />
</Design.DataContext>
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceInclude Source="../Themes/ToggleSwitch.axaml" />
<ResourceInclude Source="../Controls/ColorItemControl.axaml" />
<ResourceInclude Source="../Controls/ColorDetailControl.axaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
<SplitView
Name="splitView"
CompactPaneLength="50"
DisplayMode="CompactInline"
IsPaneOpen="{Binding #toggle.IsChecked, Mode=TwoWay}"
OpenPaneLength="300"
PanePlacement="Right">
<SplitView.Pane>
<StackPanel>
<ToggleSwitch
Name="toggle"
HorizontalAlignment="Right"
IsChecked="True"
Theme="{DynamicResource SplitViewToggleSwitch}" />
<Border IsVisible="{Binding #splitView.IsPaneOpen}" Theme="{DynamicResource CardBorder}">
<Panel>
<TextBlock
IsVisible="{Binding SelectedColorResource, Converter={x:Static ObjectConverters.IsNull}}"
Text="Click on Color to Check Details"
TextWrapping="Wrap" />
<controls:ColorDetailControl
Background="{Binding SelectedColorResource.Brush}"
IsVisible="{Binding SelectedColorResource, Converter={x:Static ObjectConverters.IsNotNull}}"
ResourceKey="{Binding SelectedColorResource.ResourceKey}"
ResourceName="{Binding SelectedColorResource.ResourceKey}" />
</Panel>
</Border>
</StackPanel>
</SplitView.Pane>
<SplitView.Content>
<ScrollViewer>
<StackPanel Spacing="10">
<TextBlock Text="Theme Preview" FontWeight="SemiBold" />
<ListBox
Theme="{StaticResource PureCardRadioGroupListBox}"
ItemsSource="{Binding ThemeVariants}"
SelectedItem="{Binding SelectedThemeVariant}">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel Orientation="Horizontal" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel HorizontalAlignment="Left" Spacing="5" MinWidth="200">
<ThemeVariantScope RequestedThemeVariant="{Binding}">
<Border
Padding="5 25 5 5"
HorizontalAlignment="Left"
Background="{DynamicResource WindowColor}"
BorderBrush="{DynamicResource WindowTextColor}"
BorderThickness="1"
CornerRadius="3">
<StackPanel Spacing="10">
<StackPanel Orientation="Horizontal" Spacing="50">
<StackPanel Spacing="5">
<TextBlock
FontSize="50"
Text="Aa" />
<StackPanel Orientation="Horizontal" Spacing="3">
<StackPanel.Styles>
<Style Selector="Border">
<Setter Property="BorderThickness" Value="1" />
<Setter Property="BorderBrush" Value="{DynamicResource WindowTextColor}" />
<Setter Property="CornerRadius" Value="5" />
<Setter Property="Width" Value="10" />
<Setter Property="Height" Value="{Binding $self.Width}" />
</Style>
</StackPanel.Styles>
<Border Background="{DynamicResource WindowColor}" />
<Border Background="{DynamicResource HotlightColor}" />
<Border Background="{DynamicResource GrayTextColor}" />
<Border Background="{DynamicResource HighlightTextColor}" />
<Border Background="{DynamicResource HighlightColor}" />
</StackPanel>
</StackPanel>
<Border
BorderThickness="1"
BorderBrush="{DynamicResource WindowTextColor}"
CornerRadius="3"
Padding="8">
<Panel>
<StackPanel Spacing="5">
<Border
Width="50"
Height="1"
Background="{DynamicResource WindowTextColor}" />
<Border
Height="1"
Background="{DynamicResource WindowTextColor}" />
<Border
Height="1"
Background="{DynamicResource WindowTextColor}" />
</StackPanel>
<StackPanel
HorizontalAlignment="Right"
VerticalAlignment="Bottom"
Orientation="Horizontal"
Spacing="2">
<Border
Width="20"
Height="5"
Background="{DynamicResource HighlightColor}"
CornerRadius="1" />
<Border
Width="20"
Height="5"
BorderThickness="1"
BorderBrush="{DynamicResource ButtonTextColor}"
CornerRadius="1" />
</StackPanel>
</Panel>
</Border>
</StackPanel>
<Border
Height="1"
Background="{DynamicResource WindowTextColor}" />
</StackPanel>
</Border>
</ThemeVariantScope>
<TextBlock Text="{Binding}" FontWeight="SemiBold" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<ThemeVariantScope
MinWidth="400"
RequestedThemeVariant="{Binding SelectedThemeVariant}">
<Border Padding="10" Background="{DynamicResource WindowColor}">
<StackPanel Spacing="16">
<StackPanel.Styles>
<Style Selector="TextBlock">
<Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="FontWeight" Value="SemiBold" />
</Style>
<Style Selector="controls|ColorItemControl.ColorBlock">
<Setter Property="Width" Value="44" />
<Setter Property="Height" Value="{Binding $self.Width}" />
<Setter Property="HorizontalAlignment" Value="Right" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="BorderBrush" Value="{DynamicResource WindowTextColor}" />
<Setter Property="CornerRadius" Value="3" />
</Style>
</StackPanel.Styles>
<Panel>
<TextBlock
Foreground="{DynamicResource WindowTextColor}"
Text="Background" />
<controls:ColorItemControl
Classes="ColorBlock"
DataContext="{Binding ColorResources[0]}"
Background="{DynamicResource WindowColor}" />
</Panel>
<Panel>
<TextBlock
Foreground="{DynamicResource WindowTextColor}"
Text="Text" />
<controls:ColorItemControl
Classes="ColorBlock"
DataContext="{Binding ColorResources[1]}"
Background="{DynamicResource WindowTextColor}" />
</Panel>
<Panel>
<TextBlock
Foreground="{DynamicResource HotlightColor}"
TextDecorations="Underline"
Text="Hyperlink" />
<controls:ColorItemControl
Classes="ColorBlock"
DataContext="{Binding ColorResources[2]}"
Background="{DynamicResource HotlightColor}" />
</Panel>
<Panel>
<TextBlock
Foreground="{DynamicResource GrayTextColor}"
Text="Inactive Text" />
<controls:ColorItemControl
Classes="ColorBlock"
DataContext="{Binding ColorResources[3]}"
Background="{DynamicResource GrayTextColor}" />
</Panel>
<Panel>
<TextBlock
Foreground="{DynamicResource HighlightTextColor}"
Background="{DynamicResource HighlightColor}"
Text="Selected text" />
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Spacing="4">
<controls:ColorItemControl
Classes="ColorBlock"
DataContext="{Binding ColorResources[4]}"
Background="{DynamicResource HighlightTextColor}" />
<controls:ColorItemControl
Classes="ColorBlock"
DataContext="{Binding ColorResources[5]}"
Background="{DynamicResource HighlightColor}" />
</StackPanel>
</Panel>
<Panel>
<Border
HorizontalAlignment="Left"
VerticalAlignment="Center"
BorderBrush="{DynamicResource ButtonTextColor}"
Background="{DynamicResource ButtonFaceColor}"
BorderThickness="2"
CornerRadius="3">
<TextBlock
Foreground="{DynamicResource ButtonTextColor}"
Padding="16 6"
Text="Button text" />
</Border>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right" Spacing="4">
<controls:ColorItemControl
Classes="ColorBlock"
DataContext="{Binding ColorResources[6]}"
Background="{DynamicResource ButtonTextColor}" />
<controls:ColorItemControl
Classes="ColorBlock"
DataContext="{Binding ColorResources[7]}"
Background="{DynamicResource ButtonFaceColor}" />
</StackPanel>
</Panel>
</StackPanel>
</Border>
</ThemeVariantScope>
<DataGrid
HorizontalAlignment="Left"
CanUserSortColumns="False"
AutoGenerateColumns="False"
ItemsSource="{Binding ColorResources}"
GridLinesVisibility="All"
BorderBrush="{DynamicResource SemiColorBorder}"
BorderThickness="1"
Padding="5">
<DataGrid.Columns>
<DataGridTemplateColumn Header="Color">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<controls:ColorItemControl
Width="40"
Height="20"
CornerRadius="3"
Background="{Binding Brush}" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTemplateColumn Header="ResourceKey">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<SelectableTextBlock
Margin="12 0"
VerticalAlignment="Center"
Text="{Binding ResourceKey}" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTemplateColumn Header="Hex">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<SelectableTextBlock
Margin="12 0"
VerticalAlignment="Center"
Text="{Binding Hex}" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTemplateColumn Header="Description">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<SelectableTextBlock
Margin="12 0"
VerticalAlignment="Center"
Text="{Binding Description}" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
<DataGridTemplateColumn Header="Pair With">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<SelectableTextBlock
Margin="12 0"
VerticalAlignment="Center"
Text="{Binding PairWith}" />
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
</StackPanel>
</ScrollViewer>
</SplitView.Content>
</SplitView>
</UserControl>

13
demo/Semi.Avalonia.Demo/Pages/HighContrastDemo.axaml.cs Normal file
View File

@@ -0,0 +1,13 @@
using Avalonia.Controls;
using Semi.Avalonia.Demo.ViewModels;
namespace Semi.Avalonia.Demo.Pages;
public partial class HighContrastDemo : UserControl
{
public HighContrastDemo()
{
InitializeComponent();
this.DataContext = new HighContrastDemoViewModel();
}
}

28
demo/Semi.Avalonia.Demo/Pages/ThemeVariantDemo.axaml
View File

@@ -4,18 +4,36 @@
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:vm="clr-namespace:Semi.Avalonia.Demo.Pages"
x:DataType="vm:ThemeVariantDemoViewModel"
d:DesignHeight="450"
d:DesignWidth="800"
mc:Ignorable="d">
<Grid>
<ThemeVariantScope Name="scope">
<Design.DataContext>
<vm:ThemeVariantDemoViewModel />
</Design.DataContext>
<StackPanel>
<Border Theme="{StaticResource CardBorder}">
<StackPanel>
<ListBox
Theme="{StaticResource CardRadioGroupListBox}"
ItemsSource="{Binding ThemeVariants}"
SelectedItem="{Binding SelectedThemeVariant}" />
<DatePicker />
<CalendarDatePicker />
</StackPanel>
</Border>
<ThemeVariantScope RequestedThemeVariant="{Binding SelectedThemeVariant}">
<Border Theme="{StaticResource CardBorder}">
<StackPanel>
<ListBox
Theme="{StaticResource CardRadioGroupListBox}"
ItemsSource="{Binding ThemeVariants}"
SelectedItem="{Binding SelectedThemeVariant}" />
<DatePicker />
<CalendarDatePicker />
<ToggleSwitch Content="Switch Theme" IsCheckedChanged="Switch_OnIsCheckedChanged" />
</StackPanel>
</Border>
</ThemeVariantScope>
</Grid>
</UserControl>
</StackPanel>
</UserControl>

25
demo/Semi.Avalonia.Demo/Pages/ThemeVariantDemo.axaml.cs
View File

@@ -1,8 +1,7 @@
using Avalonia;
using System.Collections.Generic;
using Avalonia.Controls;
using Avalonia.Interactivity;
using Avalonia.Markup.Xaml;
using Avalonia.Styling;
using CommunityToolkit.Mvvm.ComponentModel;
namespace Semi.Avalonia.Demo.Pages;
@@ -11,10 +10,22 @@ public partial class ThemeVariantDemo : UserControl
public ThemeVariantDemo()
{
InitializeComponent();
this.DataContext = new ThemeVariantDemoViewModel();
}
}
private void Switch_OnIsCheckedChanged(object sender, RoutedEventArgs e)
{
scope.RequestedThemeVariant = scope.ActualThemeVariant == ThemeVariant.Dark ? ThemeVariant.Light : ThemeVariant.Dark;
}
public partial class ThemeVariantDemoViewModel : ObservableObject
{
[ObservableProperty] private ThemeVariant? _selectedThemeVariant;
public IEnumerable<ThemeVariant> ThemeVariants =>
[
ThemeVariant.Default,
ThemeVariant.Light,
ThemeVariant.Dark,
SemiTheme.Aquatic,
SemiTheme.Desert,
SemiTheme.Dust,
SemiTheme.NightSky,
];
}

137
demo/Semi.Avalonia.Demo/ViewModels/HighContrastDemoViewModel.cs Normal file
View File

@@ -0,0 +1,137 @@
using System.Collections.Generic;
using System.Collections.ObjectModel;
using Avalonia;
using Avalonia.Controls;
using Avalonia.Controls.ApplicationLifetimes;
using Avalonia.Media;
using Avalonia.Styling;
using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Messaging;
namespace Semi.Avalonia.Demo.ViewModels;
public partial class HighContrastDemoViewModel : ObservableObject
{
[ObservableProperty] private ThemeVariant? _selectedThemeVariant;
[ObservableProperty] private ColorResource _selectedColorResource = null!;
public IEnumerable<ThemeVariant> ThemeVariants { get; }
public ObservableCollection<ColorResource> ColorResources { get; set; }
public HighContrastDemoViewModel()
{
ThemeVariants =
[
SemiTheme.Aquatic,
SemiTheme.Desert,
SemiTheme.Dust,
SemiTheme.NightSky,
];
ColorResources =
[
new ColorResource
{
ResourceKey = "WindowColor",
Brush = new SolidColorBrush(Color.Parse("#202020")),
Hex = "#FF202020",
Description = "Background of pages, panes, popups, and windows.",
PairWith = "WindowTextColor"
},
new ColorResource
{
ResourceKey = "WindowTextColor",
Brush = new SolidColorBrush(Color.Parse("#FFFFFF")),
Hex = "WHITE",
Description = "Headings, body copy, lists, placeholder text, app and window borders.",
PairWith = "WindowColor"
},
new ColorResource
{
ResourceKey = "HotlightColor",
Brush = new SolidColorBrush(Color.Parse("#75E9FC")),
Hex = "#FF75E9FC",
Description = "Hyperlinks.",
PairWith = "WindowColor"
},
new ColorResource
{
ResourceKey = "GrayTextColor",
Brush = new SolidColorBrush(Color.Parse("#A6A6A6")),
Hex = "#FFA6A6A6",
Description = "Inactive (disabled) UI.",
PairWith = "WindowColor"
},
new ColorResource
{
ResourceKey = "HighlightTextColor",
Brush = new SolidColorBrush(Color.Parse("#263B50")),
Hex = "#FF263B50",
Description =
"Foreground color for text or UI that is in selected, interacted with (hover, pressed), or in progress.",
PairWith = "HighlightColor"
},
new ColorResource
{
ResourceKey = "HighlightColor",
Brush = new SolidColorBrush(Color.Parse("#8EE3F0")),
Hex = "#FF8EE3F0",
Description =
"Background or accent color for UI that is in selected, interacted with (hover, pressed), or in progress.",
PairWith = "HighlightTextColor"
},
new ColorResource
{
ResourceKey = "ButtonTextColor",
Brush = new SolidColorBrush(Color.Parse("#FFFFFF")),
Hex = "WHITE",
Description = "Foreground color for buttons and any UI that can be interacted with.",
PairWith = "ButtonFaceColor"
},
new ColorResource
{
ResourceKey = "ButtonFaceColor",
Brush = new SolidColorBrush(Color.Parse("#202020")),
Hex = "#FF202020",
Description = "Background color for buttons and any UI that can be interacted with.",
PairWith = "ButtonTextColor"
},
];
WeakReferenceMessenger.Default.Register<HighContrastDemoViewModel, ColorResource>
(this, (_, item) => SelectedColorResource = item);
SelectedThemeVariant = SemiTheme.Aquatic;
}
partial void OnSelectedThemeVariantChanged(ThemeVariant? value)
{
var topLevel = ResolveDefaultTopLevel();
if (value is null) return;
foreach (var colorResource in ColorResources)
{
if (colorResource.ResourceKey is null) continue;
if (topLevel?.TryFindResource(colorResource.ResourceKey, value, out var o) == true && o is Color color)
{
colorResource.Brush = new SolidColorBrush(color);
colorResource.Hex = color.ToString().ToUpperInvariant();
}
}
}
private static TopLevel? ResolveDefaultTopLevel()
{
return Application.Current?.ApplicationLifetime switch
{
IClassicDesktopStyleApplicationLifetime desktopLifetime => desktopLifetime.MainWindow,
ISingleViewApplicationLifetime singleView => TopLevel.GetTopLevel(singleView.MainView),
_ => null
};
}
}
public partial class ColorResource : ObservableObject
{
[ObservableProperty] private string? _resourceKey;
[ObservableProperty] private SolidColorBrush? _brush;
[ObservableProperty] private string? _hex;
[ObservableProperty] private string? _description;
[ObservableProperty] private string? _pairWith;
}

3
demo/Semi.Avalonia.Demo/Views/MainView.axaml
View File

@@ -104,6 +104,9 @@
<TabItem Header="Palette">
<pages:PaletteDemo />
</TabItem>
<TabItem Header="HighContrastTheme">
<pages:HighContrastDemo />
</TabItem>
<TabItem Header="Icon">
<pages:IconDemo />
</TabItem>