Updates for v23.1.2.

Actipro · Dec 4, 2023 · fd2c926 · fd2c926
1 parent 8031041
commit fd2c926
Show file tree

Hide file tree

Showing 11 changed files with 59 additions and 12 deletions.
diff --git a/.nuke/build.schema.json b/.nuke/build.schema.json
@@ -65,9 +65,13 @@
           "type": "string",
           "description": "Root directory during build execution"
         },
-        "SampleBrowserSolution": {
+        "SampleBrowserDesktopSolution": {
           "type": "string",
-          "description": "Path to a solution file that is automatically loaded. Default is Samples/SampleBrowser/SampleBrowser.sln"
+          "description": "Path to a solution file that is automatically loaded. Default is Samples/SampleBrowser/SampleBrowser.Desktop.sln"
+        },
+        "SampleBrowserWebSolution": {
+          "type": "string",
+          "description": "Path to a solution file that is automatically loaded. Default is Samples/SampleBrowser/SampleBrowser.Web.sln"
         },
         "Skip": {
           "type": "array",

diff --git a/Documentation/topics/shared/media.md b/Documentation/topics/shared/media.md
@@ -5,7 +5,7 @@ order: 9
 ---
 # Media
 
-The [ActiproSoftware.UI.Avalonia.Media](xref:@ActiproUIRoot.Media) namespace defines a [UIColor](xref:@ActiproUIRoot.Media.UIColor) structure for working with colors.
+The [ActiproSoftware.UI.Avalonia.Media](xref:@ActiproUIRoot.Media) namespace defines a [UIColor](xref:@ActiproUIRoot.Media.UIColor) structure for working with colors and an extension method to easily convert `Avalonia.Media.Color` to a [UIColor](xref:@ActiproUIRoot.Media.UIColor).
 
 ## UIColor Structure
 
@@ -34,6 +34,8 @@ These instance members are found in the structure:
 | [RbgBlue](xref:@ActiproUIRoot.Media.UIColor.RgbBlue) Property | The RGB blue component of the color, which is a byte value in the range `0` to `255`. |
 | [RbgGreen](xref:@ActiproUIRoot.Media.UIColor.RgbGreen) Property | The RGB green component of the color, which is a byte value in the range `0` to `255`. |
 | [RbgRed](xref:@ActiproUIRoot.Media.UIColor.RgbRed) Property | The RGB red component of the color, which is a byte value in the range `0` to `255`. |
+| [ToChromaticAdaptation](xref:@ActiproUIRoot.Media.UIColor.ToChromaticAdaptation*) Method | Uses chromatic adaptation to create a new [UIColor](xref:@ActiproUIRoot.Media.UIColor) that renders clearly on the specified background color.  Chromatic adaptation is commonly used to adapt a color that was intended for use with light backgrounds to render properly on dark backgrounds.  |
+| [ToGrayscale](xref:@ActiproUIRoot.Media.UIColor.ToGrayscale*) Method | Creates a new [UIColor](xref:@ActiproUIRoot.Media.UIColor) that is a grayscale transformation of the specified color. |
 | [ToHexString](xref:@ActiproUIRoot.Media.UIColor.ToHexString*) Method | Converts the color value to an RGB hexadecimal string (e.g., `"#ff00ff"`, `"#80ff00ff"`). |
 | [ToHsl](xref:@ActiproUIRoot.Media.UIColor.ToHsl*) Method | Converts the color value to an `HslColor` instance that represents the color in the HSL (hue, saturation, and lightness) color model. |
 | [ToHsv](xref:@ActiproUIRoot.Media.UIColor.ToHsv*) Method | Converts the color value to an `HsvColor` instance that represents the color in the HSV (hue, saturation, and value) color model. |
@@ -53,4 +55,18 @@ These static members are found in the structure:
 | [FromOklch](xref:@ActiproUIRoot.Media.UIColor.FromOklch*) Method | Creates a `UIColor` instance from the specified OKLCH (lightness, chroma, and hue) and optional alpha components. |
 | [FromRgb](xref:@ActiproUIRoot.Media.UIColor.FromRgb*) Method | Creates a `UIColor` instance from the specified RGB (red, green, and blue) and optional alpha components, or `Color` instance. |
 | [Parse](xref:@ActiproUIRoot.Media.UIColor.Parse*) Method | Creates a `UIColor` instance from the specified color name, RGB hexadecimal string, or any other color string supported by `Color.Parse`. |
-| [TryParse](xref:@ActiproUIRoot.Media.UIColor.Parse*) Method | Tries to creates a `UIColor` instance from the specified color name, RGB hexadecimal string, or any other color string supported by `Color.Parse`. |
+| [TryParse](xref:@ActiproUIRoot.Media.UIColor.Parse*) Method | Tries to creates a `UIColor` instance from the specified color name, RGB hexadecimal string, or any other color string supported by `Color.Parse`. |
+
+> [!TIP]
+> [UIColor](xref:@ActiproUIRoot.Media.UIColor) defines several implicit cast overloads to easily convert to/from [UIColor](xref:@ActiproUIRoot.Media.UIColor) and the Avalonia types for `Color`, `HslColor`, and `HsvColor`.
+
+## Color Extensions
+
+The following extension methods to `Avalonia.Media.Color` are defined on [ColorExtensions](xref:@ActiproUIRoot.Media.ColorExtensions):
+
+| Member | Description |
+|-----|-----|
+| [ToUIColor](xref:@ActiproUIRoot.Media.ColorExtensions.ToUIColor*) Method | Creates a new [UIColor](xref:@ActiproUIRoot.Media.UIColor) initialized from the `Color` for easily accessing the additional capabilities of [UIColor](xref:@ActiproUIRoot.Media.UIColor).  |
+
+> [!IMPORTANT]
+> The [ActiproSoftware.UI.Avalonia.Media](xref:@ActiproUIRoot.Media) namespace must be imported with a `using` statement to access the extensions.
diff --git a/Documentation/topics/themes/native-control-themes.md b/Documentation/topics/themes/native-control-themes.md
@@ -183,6 +183,8 @@ These style class names trigger special behaviors:
 - [ButtonSpinnerOutline](xref:@ActiproUIRoot.Themes.ControlThemeKind.ButtonSpinnerOutline) (`theme-outline`) - Has an outline appearance.
 - [ButtonSpinnerSoft](xref:@ActiproUIRoot.Themes.ControlThemeKind.ButtonSpinnerSoft) (`theme-soft`) - Has a soft fill appearance.
 
+Set the [ThemeProperties](xref:@ActiproUIRoot.Themes.ThemeProperties).[SpinnerHasHorizontalOrientation](xref:@ActiproUIRoot.Themes.ThemeProperties.SpinnerHasHorizontalOrientationProperty) attached property on a `ButtonSpinner` to `true` to arrange spinner buttons horizontally instead of vertically.  Horizontal arrangement is better for touch-friendly user interfaces since each button gets twice the amount of surface area.  [Theme Definitions](theme-definitions.md) also provide a global default value for this attached property that can be altered.
+
 The following additional control theme is available for the `Button` used by the default control theme:
 
 - [SpinnerButton](xref:@ActiproUIRoot.Themes.ControlThemeKind.SpinnerButton)
@@ -243,6 +245,8 @@ The following additional control theme is used by the default control theme:
 - [NumericUpDownOutline](xref:@ActiproUIRoot.Themes.ControlThemeKind.NumericUpDownOutline) (`theme-outline`) - Has an outline appearance.
 - [NumericUpDownSoft](xref:@ActiproUIRoot.Themes.ControlThemeKind.NumericUpDownSoft) (`theme-soft`) - Has a soft fill appearance.
 
+Set the [ThemeProperties](xref:@ActiproUIRoot.Themes.ThemeProperties).[SpinnerHasHorizontalOrientation](xref:@ActiproUIRoot.Themes.ThemeProperties.SpinnerHasHorizontalOrientationProperty) attached property on a `NumericUpDown` to `true` to arrange spinner buttons horizontally instead of vertically.  Horizontal arrangement is better for touch-friendly user interfaces since each button gets twice the amount of surface area.  [Theme Definitions](theme-definitions.md) also provide a global default value for this attached property that can be altered.
+
 #### TextBox Type
 
 ![Screenshot](images/text-box-themes.png)

diff --git a/Documentation/topics/themes/theme-definitions.md b/Documentation/topics/themes/theme-definitions.md
@@ -85,6 +85,7 @@ Color ramp name properties should be set to [Hue](xref:@ActiproUIRoot.Themes.Gen
 |-----|-----|
 | [ButtonAppearanceKind](xref:@ActiproUIRoot.Themes.Generation.ThemeDefinition.ButtonAppearanceKind) | The [ButtonAppearanceKind](xref:@ActiproUIRoot.Themes.Generation.ButtonAppearanceKind) that indicates the default appearance for various button controls (e.g., `Button`, `SplitButton`). |
 | [EditAppearanceKind](xref:@ActiproUIRoot.Themes.Generation.ThemeDefinition.EditAppearanceKind) | The [EditAppearanceKind](xref:@ActiproUIRoot.Themes.Generation.EditAppearanceKind) that indicates the default appearance for various edit controls (e.g., `ComboBox`, `TextBox`). |
+| [SpinnerHasHorizontalOrientation](xref:@ActiproUIRoot.Themes.Generation.ThemeDefinition.SpinnerHasHorizontalOrientation) | Whether to arrange `ButtonSpinner` buttons horizontally.
 | [TabAppearanceKind](xref:@ActiproUIRoot.Themes.Generation.ThemeDefinition.TabAppearanceKind) | The [TabAppearanceKind](xref:@ActiproUIRoot.Themes.Generation.TabAppearanceKind) that indicates the default appearance for various tab controls (e.g., `TabControl`). |
 
 ## Custom Theme Generators

diff --git a/Documentation/topics/themes/user-interface-density.md b/Documentation/topics/themes/user-interface-density.md
@@ -74,6 +74,9 @@ if (ModernTheme.TryGetCurrent(out var modernTheme) && (modernTheme.Definition is
 		_ => 14.0,  // Normal, Spacious
 	};
 
+	// Arrange spinner buttons horizontally in Spacious density
+	definition.SpinnerHasHorizontalOrientation = (density == UserInterfaceDensity.Spacious);
+
 	// Set the new UI density
 	modernTheme.Definition.UserInterfaceDensity = newDensity;
 

diff --git a/Samples/SampleBrowser/Directory.Build.props b/Samples/SampleBrowser/Directory.Build.props
@@ -8,7 +8,7 @@
 		<AvaloniaUseCompiledBindingsByDefault>true</AvaloniaUseCompiledBindingsByDefault>
 
 		<Version>23.1.2.0</Version>
-		<InformationalVersion>23.1.0.0 - 20231128</InformationalVersion>
+		<InformationalVersion>23.1.0.0 - 20231204</InformationalVersion>
 
 		<Product>Actipro Avalonia UI Controls Sample Browser</Product>
 		<Title>$(Product)</Title>

diff --git a/Samples/SampleBrowser/References/ActiproSoftware.References.props b/Samples/SampleBrowser/References/ActiproSoftware.References.props
@@ -2,7 +2,7 @@
 <Project>
 
 	<PropertyGroup>
-		<ActiproVersion>23.1.2-beta.1</ActiproVersion>
+		<ActiproVersion>23.1.2</ActiproVersion>
 	</PropertyGroup>
 
 	<ItemGroup>

diff --git a/...mpleBrowser.Common/ProductSamples/ThemesSamples/NativeControls/ButtonSpinnerSamples.axaml b/...mpleBrowser.Common/ProductSamples/ThemesSamples/NativeControls/ButtonSpinnerSamples.axaml
@@ -57,14 +57,15 @@
 						<ComboBox SelectedIndex="0" ItemsSource="{actipro:DelimitedArray Type={x:Type Location}}" SelectedItem="{Binding ButtonSpinnerLocation}" />
 					</StackPanel>
 					<CheckBox IsChecked="{Binding ShowButtonSpinner}">Show buttons</CheckBox>
+					<CheckBox IsChecked="{Binding (actipro:ThemeProperties.SpinnerHasHorizontalOrientation)}">Horizontal buttons</CheckBox>
 					<CheckBox IsChecked="{Binding AllowSpin}">Allow spin</CheckBox>
 					<CheckBox IsChecked="{Binding IsEnabled}">Enabled</CheckBox>
 				</StackPanel>
 			</sampleBrowser:ControlExample.Options>
 			<sampleBrowser:ControlExample.CodeExamples>
 				<sampleBrowser:CodeExample xml:space="preserve">
 					<![CDATA[
-<ButtonSpinner$(ClassesAttribute)$(AllowSpinAttribute)$(ShowButtonSpinnerAttribute)$(ButtonSpinnerLocationAttribute)$(IsEnabledAttribute)>
+<ButtonSpinner$(ClassesAttribute)$(AllowSpinAttribute)$(ShowButtonSpinnerAttribute)$(ButtonSpinnerLocationAttribute)$(IsEnabledAttribute)$(SpinnerHasHorizontalOrientationAttribute)>
 	<!-- Content Here -->
 </ButtonSpinner>
 					]]>
@@ -84,6 +85,9 @@
 						<sampleBrowser:CodeExampleSubstitution Key="ShowButtonSpinnerAttribute"
 															   IsEnabled="{Binding !ShowButtonSpinner}"
 															   Value=" ShowButtonSpinner=&quot;False&quot;" />
+						<sampleBrowser:CodeExampleSubstitution Key="SpinnerHasHorizontalOrientationAttribute"
+															   IsEnabled="{Binding (actipro:ThemeProperties.SpinnerHasHorizontalOrientation)}"
+															   Value="&#xA;&#x9;actipro:ThemeProperties.SpinnerHasHorizontalOrientation=&quot;True&quot;" />
 					</sampleBrowser:CodeExample.Substitutions>
 				</sampleBrowser:CodeExample>
 			</sampleBrowser:ControlExample.CodeExamples>

diff --git a/...mpleBrowser.Common/ProductSamples/ThemesSamples/NativeControls/NumericUpDownSamples.axaml b/...mpleBrowser.Common/ProductSamples/ThemesSamples/NativeControls/NumericUpDownSamples.axaml
@@ -31,9 +31,9 @@
 			>
 
 			<NumericUpDown x:Name="sample" sampleBrowser:ObservableStyledClassesProperties.IsWatching="True"
-						   Width="200" AllowSpin="True" ShowButtonSpinner="True"
-						   Watermark="Enter value from 0 to 10"
-						   Minimum="0" Maximum="10" Increment="1" ClipValueToMinMax="True"
+						   Width="150" AllowSpin="True" ShowButtonSpinner="True"
+						   Watermark="0-100"
+						   Minimum="0" Maximum="100" Increment="1" ClipValueToMinMax="True"
 						   Classes.theme-outline="{Binding #sampleTheme.SelectedItem, Converter={StaticResource EqualToComparisonConverter}, ConverterParameter='Outline'}"
 						   Classes.theme-soft="{Binding #sampleTheme.SelectedItem, Converter={StaticResource EqualToComparisonConverter}, ConverterParameter='Soft'}"
 						   Classes.accent="{Binding #sampleVariant.SelectedItem, Converter={StaticResource EqualToComparisonConverter}, ConverterParameter='Accent'}"
@@ -57,6 +57,7 @@
 						<ComboBox SelectedIndex="0" ItemsSource="{actipro:DelimitedArray Type={x:Type Location}}" SelectedItem="{Binding ButtonSpinnerLocation}" />
 					</StackPanel>
 					<CheckBox IsChecked="{Binding ShowButtonSpinner}">Show buttons</CheckBox>
+					<CheckBox IsChecked="{Binding (actipro:ThemeProperties.SpinnerHasHorizontalOrientation)}">Horizontal buttons</CheckBox>
 					<CheckBox IsChecked="{Binding AllowSpin}">Allow spin</CheckBox>
 					<CheckBox IsChecked="{Binding IsEnabled}">Enabled</CheckBox>
 					<CheckBox IsChecked="{Binding IsReadOnly}">Read-only</CheckBox>
@@ -65,7 +66,7 @@
 			<sampleBrowser:ControlExample.CodeExamples>
 				<sampleBrowser:CodeExample xml:space="preserve">
 					<![CDATA[
-<NumericUpDown$(ClassesAttribute)$(AllowSpinAttribute)$(ShowButtonSpinnerAttribute)$(ButtonSpinnerLocationAttribute)$(IsEnabledAttribute)$(IsReadOnlyAttribute) />
+<NumericUpDown$(ClassesAttribute)$(AllowSpinAttribute)$(ShowButtonSpinnerAttribute)$(ButtonSpinnerLocationAttribute)$(IsEnabledAttribute)$(IsReadOnlyAttribute)$(SpinnerHasHorizontalOrientationAttribute) />
 					]]>
 					<sampleBrowser:CodeExample.Substitutions>
 						<sampleBrowser:CodeExampleSubstitution Key="ClassesAttribute"
@@ -86,6 +87,9 @@
 						<sampleBrowser:CodeExampleSubstitution Key="ShowButtonSpinnerAttribute"
 															   IsEnabled="{Binding !ShowButtonSpinner}"
 															   Value=" ShowButtonSpinner=&quot;False&quot;" />
+						<sampleBrowser:CodeExampleSubstitution Key="SpinnerHasHorizontalOrientationAttribute"
+															   IsEnabled="{Binding (actipro:ThemeProperties.SpinnerHasHorizontalOrientation)}"
+															   Value="&#xA;&#x9;actipro:ThemeProperties.SpinnerHasHorizontalOrientation=&quot;True&quot;" />
 					</sampleBrowser:CodeExample.Substitutions>
 				</sampleBrowser:CodeExample>
 			</sampleBrowser:ControlExample.CodeExamples>

diff --git a/...eBrowser/SampleBrowser.Common/SampleBrowser/Documents/ReleaseHistories/v23.1.md b/...eBrowser/SampleBrowser.Common/SampleBrowser/Documents/ReleaseHistories/v23.1.md
@@ -1,10 +1,15 @@
-# 12/14/2023 - v23.1.2
+# 12/4/2023 - v23.1.2
 
 ## Themes
+- Added the ThemeProperties.SpinnerHasHorizontalOrientation attached property that can arrange ButtonSpinner and NumericUpDown buttons horizontally, making them more touch-friendly.
+- Added the ThemeDefinition.SpinnerHasHorizontalOrientation property that provides a global default for the ThemeProperties.SpinnerHasHorizontalOrientation attached property.
 - Fixed an issue where the new density-related markup extensions added in the previous build weren't parsing numbers with invariant culture, which had led to excessive padding on some systems.
 - Fixed an issue where a menu item's sub-menu could close when the pointer was over the popup's shadow.
 ## Shared Library
 - Added various members to the UIColor structure to support the OKLAB and OKLCH color models.
+- Added the UIColor.ToChromaticAdaptation method that updates the color to render clearly on a given background.
+- Added the UIColor.ToGrayscale method that updates the color to a grayscale value.
+- Added the Color.ToUIColor extension method that converts a Color to a UIColor.
 - Added the IOrientedElement interface and numerous extension methods.
 - Added the ShadowChrome.Background and Padding properties.
 - Updated ArrayExtension and DelimitedArrayExtension to return generic object arrays for AOT compatibility instead of type-specific arrays.  The ArrayExtension.Type property has been deprecated and will be removed in a future release.

diff --git a/Samples/SampleBrowser/SampleBrowser.Common/SampleBrowser/ViewModels/ApplicationViewModel.cs b/Samples/SampleBrowser/SampleBrowser.Common/SampleBrowser/ViewModels/ApplicationViewModel.cs
@@ -475,13 +475,19 @@ public ICommand SetUserInterfaceDensityCommand
 				if (density.HasValue && ModernTheme.TryGetCurrent(out var theme)) {
 					var definition = theme.Definition;
 					if (definition is not null) {
+						// Optionally update the base font size based on the density
 						definition.BaseFontSize = density switch {
 							UserInterfaceDensity.Compact => 13.0,
 							_ => 14.0,  // Normal, Spacious
 						};
+
+						// Arrange spinner buttons horizontally in Spacious density
+						definition.SpinnerHasHorizontalOrientation = (density == UserInterfaceDensity.Spacious);
 
+						// Set the new UI density
 						definition.UserInterfaceDensity = density.Value;
 
+						// Must manually refresh resources after changing definition properties
 						theme.RefreshResources();
 					}
 				}