Implement SelectedTabIndex in ColorView

src/Avalonia.Controls.ColorPicker/ColorView/ColorView.Properties.cs

@@ -8,7 +8,6 @@ namespace Avalonia.Controls
     /// <inheritdoc/>
     public partial class ColorView
     {
-        // SelectedTabIndex
         // IsColorModelSelectorVisible
         // IsComponentSliderVisible
 
@@ -198,6 +197,14 @@ namespace Avalonia.Controls
                 nameof(MinValue),
                 0);
 
+        /// <summary>
+        /// Defines the <see cref="SelectedTabIndex"/> property.
+        /// </summary>
+        public static readonly StyledProperty<int> SelectedTabIndexProperty =
+            AvaloniaProperty.Register<ColorView, int>(
+                nameof(SelectedTabIndex),
+                (int)ColorViewTab.Spectrum);
+
         /// <summary>
         /// Defines the <see cref="ShowAccentColors"/> property.
         /// </summary>
@@ -413,6 +420,15 @@ namespace Avalonia.Controls
             set => SetValue(MinValueProperty, value);
         }
 
+        /// <summary>
+        /// Gets or sets the index of the selected subview/tab.
+        /// </summary>
+        public int SelectedTabIndex
+        {
+            get => GetValue(SelectedTabIndexProperty);
+            set => SetValue(SelectedTabIndexProperty, value);
+        }
+
         /// <inheritdoc cref="ColorPreviewer.ShowAccentColors"/>
         public bool ShowAccentColors
         {

src/Avalonia.Controls.ColorPicker/ColorView/ColorView.cs

@@ -73,7 +73,10 @@ namespace Avalonia.Controls
         /// Validates the selected subview/tab taking into account the visibility of each subview/tab
         /// as well as the current selection.
         /// </summary>
-        private void ValidateSelectedTab()
+        /// <remarks>
+        /// Derived controls may re-implement this based on their default style / control template.
+        /// </remarks>
+        protected virtual void ValidateSelectedTab()
         {
             if (_tabControl != null &&
                 _tabControl.Items != null)
@@ -135,6 +138,8 @@ namespace Avalonia.Controls
                     _tabControl.SelectedItem = null;
                     _tabControl.IsVisible = false;
                 }
+
+                SelectedTabIndex = _tabControl.SelectedIndex;
             }
 
             return;
@@ -232,6 +237,15 @@ namespace Avalonia.Controls
                     ValidateSelectedTab();
                 }, DispatcherPriority.Background);
             }
+            else if (change.Property == SelectedTabIndexProperty)
+            {
+                // Again, it is necessary to wait for the SelectedTabIndex value to
+                // be applied to the TabControl through binding before validation occurs.
+                Dispatcher.UIThread.Post(() =>
+                {
+                    ValidateSelectedTab();
+                }, DispatcherPriority.Background);
+            }
 
             base.OnPropertyChanged(change);
         }

src/Avalonia.Controls.ColorPicker/ColorView/ColorViewTab.cs

@@ -1,23 +1,26 @@
 namespace Avalonia.Controls
 {
     /// <summary>
-    /// Defines a specific subview (tab) within the <see cref="ColorView"/>.
+    /// Defines a specific subview/tab within the <see cref="ColorView"/>.
     /// </summary>
+    /// <remarks>
+    /// This is indexed to match the default control template ordering.
+    /// </remarks>
     public enum ColorViewTab
     {
         /// <summary>
-        /// The components subview with sliders and numeric input boxes.
+        /// The color spectrum subview with a box/ring spectrum and sliders.
         /// </summary>
-        Components,
+        Spectrum = 0,
 
         /// <summary>
         /// The color palette subview with a grid of selectable colors.
         /// </summary>
-        Palette,
+        Palette = 1,
 
         /// <summary>
-        /// The color spectrum subview with a box/ring spectrum and sliders.
+        /// The components subview with sliders and numeric input boxes.
         /// </summary>
-        Spectrum,
+        Components = 2,
     }
 }

src/Avalonia.Controls.ColorPicker/Themes/Fluent/ColorView.xaml

@@ -112,7 +112,8 @@
           <TabControl x:Name="PART_TabControl"
                       Grid.Row="0"
                       Height="338"
-                      Width="350">
+                      Width="350"
+                      SelectedIndex="{Binding SelectedTabIndex, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}">
             <TabControl.Resources>
               <Thickness x:Key="TabItemMargin">0,0,0,0</Thickness>
             </TabControl.Resources>