Implement remaining ColorView properties

samples/ControlCatalog/Pages/ColorPickerPage.xaml

@@ -51,35 +51,7 @@
                       HsvColor="{Binding HsvColor, ElementName=ColorSpectrum1}" />
     </Grid>
     <Grid Grid.Column="4"
-          Grid.Row="0"
-          ColumnDefinitions="Auto,Auto,Auto"
-          RowDefinitions="Auto,Auto">
-      <ColorSlider Grid.Column="0"
-                   Grid.Row="0"
-                   IsAlphaMaxForced="True"
-                   IsSaturationValueMaxForced="False"
-                   ColorComponent="{Binding Components, ElementName=ColorSpectrum2, Converter={StaticResource ThirdComponent}}"
-                   ColorModel="Hsva"
-                   Orientation="Vertical"
-                   HsvColor="{Binding HsvColor, ElementName=ColorSpectrum2}" />
-      <ColorSpectrum x:Name="ColorSpectrum2"
-                     Grid.Column="1"
-                     Grid.Row="0"
-                     Color="Green"
-                     Shape="Ring"
-                     Height="256"
-                     Width="256" />
-      <ColorSlider Grid.Column="2"
-                   Grid.Row="0"
-                   ColorComponent="Alpha"
-                   ColorModel="Hsva"
-                   Orientation="Vertical"
-                   HsvColor="{Binding HsvColor, ElementName=ColorSpectrum2}" />
-      <ColorPreviewer Grid.Column="0"
-                      Grid.ColumnSpan="3"
-                      Grid.Row="1"
-                      ShowAccentColors="True"
-                      HsvColor="{Binding HsvColor, ElementName=ColorSpectrum2}" />
+          Grid.Row="0">
     </Grid>
   </Grid>
 </UserControl>

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

@@ -5,9 +5,12 @@ using Avalonia.Media;
 
 namespace Avalonia.Controls
 {
+    /// <inheritdoc/>
     public partial class ColorView
     {
-        // SelectedTab
+        // SelectedTabIndex
+        // IsColorModelSelectorVisible
+        // IsComponentSliderVisible
 
         /// <summary>
         /// Defines the <see cref="Color"/> property.
@@ -81,7 +84,7 @@ namespace Avalonia.Controls
         public static readonly StyledProperty<bool> IsAlphaEnabledProperty =
             AvaloniaProperty.Register<ColorView, bool>(
                 nameof(IsAlphaEnabled),
-                false);
+                true);
 
         /// <summary>
         /// Defines the <see cref="IsAlphaVisible"/> property.
@@ -91,6 +94,14 @@ namespace Avalonia.Controls
                 nameof(IsAlphaVisible),
                 true);
 
+        /// <summary>
+        /// Defines the <see cref="IsColorComponentsVisible"/> property.
+        /// </summary>
+        public static readonly StyledProperty<bool> IsColorComponentsVisibleProperty =
+            AvaloniaProperty.Register<ColorView, bool>(
+                nameof(IsColorComponentsVisible),
+                true);
+
         /// <summary>
         /// Defines the <see cref="IsColorPaletteVisible"/> property.
         /// </summary>
@@ -108,19 +119,19 @@ namespace Avalonia.Controls
                 true);
 
         /// <summary>
-        /// Defines the <see cref="IsColorSliderVisible"/> property.
+        /// Defines the <see cref="IsColorSpectrumVisible"/> property.
         /// </summary>
-        public static readonly StyledProperty<bool> IsColorSliderVisibleProperty =
+        public static readonly StyledProperty<bool> IsColorSpectrumVisibleProperty =
             AvaloniaProperty.Register<ColorView, bool>(
-                nameof(IsColorSliderVisible),
+                nameof(IsColorSpectrumVisible),
                 true);
 
         /// <summary>
-        /// Defines the <see cref="IsColorSpectrumVisible"/> property.
+        /// Defines the <see cref="IsColorSpectrumSliderVisible"/> property.
         /// </summary>
-        public static readonly StyledProperty<bool> IsColorSpectrumVisibleProperty =
+        public static readonly StyledProperty<bool> IsColorSpectrumSliderVisibleProperty =
             AvaloniaProperty.Register<ColorView, bool>(
-                nameof(IsColorSpectrumVisible),
+                nameof(IsColorSpectrumSliderVisible),
                 true);
 
         /// <summary>
@@ -205,7 +216,7 @@ namespace Avalonia.Controls
         /// <inheritdoc cref="ColorSlider.ColorModel"/>
         /// <remarks>
         /// This property is only applicable to the components tab.
-        /// The spectrum tab must always be in HSV and the palette tab is pre-defined colors.
+        /// The spectrum tab must always be in HSV and the palette tab contains only pre-defined colors.
         /// </remarks>
         public ColorModel ColorModel
         {
@@ -288,7 +299,16 @@ namespace Avalonia.Controls
         }
 
         /// <summary>
-        /// Gets or sets a value indicating whether the color palette is visible.
+        /// Gets or sets a value indicating whether the color components subview/tab is visible.
+        /// </summary>
+        public bool IsColorComponentsVisible
+        {
+            get => GetValue(IsColorComponentsVisibleProperty);
+            set => SetValue(IsColorComponentsVisibleProperty, value);
+        }
+
+        /// <summary>
+        /// Gets or sets a value indicating whether the color palette subview/tab is visible.
         /// </summary>
         public bool IsColorPaletteVisible
         {
@@ -309,20 +329,25 @@ namespace Avalonia.Controls
             set => SetValue(IsColorPreviewVisibleProperty, value);
         }
 
-        // IsColorComponentsVisible
-
-        public bool IsColorSliderVisible // ColorSpectrumSlider
-        {
-            get => GetValue(IsColorSliderVisibleProperty);
-            set => SetValue(IsColorSliderVisibleProperty, value);
-        }
-
+        /// <summary>
+        /// Gets or sets a value indicating whether the color spectrum subview/tab is visible.
+        /// </summary>
         public bool IsColorSpectrumVisible
         {
             get => GetValue(IsColorSpectrumVisibleProperty);
             set => SetValue(IsColorSpectrumVisibleProperty, value);
         }
 
+        /// <summary>
+        /// Gets or sets a value indicating whether the color spectrum's third component slider
+        /// is visible.
+        /// </summary>
+        public bool IsColorSpectrumSliderVisible
+        {
+            get => GetValue(IsColorSpectrumSliderVisibleProperty);
+            set => SetValue(IsColorSpectrumSliderVisibleProperty, value);
+        }
+
         /// <summary>
         /// Gets or sets a value indicating whether color component text inputs are visible.
         /// </summary>

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

@@ -1,7 +1,7 @@
 namespace Avalonia.Controls
 {
     /// <summary>
-    /// Defines a specific tab (subview) within the <see cref="ColorView"/>.
+    /// Defines a specific subview (tab) within the <see cref="ColorView"/>.
     /// </summary>
     public enum ColorViewTab
     {

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

@@ -58,10 +58,11 @@
                          HsvColor="{Binding $parent[ColorPicker].HsvColor, Mode=TwoWay}"
                          IsAlphaEnabled="{TemplateBinding IsAlphaEnabled}"
                          IsAlphaVisible="{TemplateBinding IsAlphaVisible}"
+                         IsColorComponentsVisible="{TemplateBinding IsColorComponentsVisible}"
                          IsColorPaletteVisible="{TemplateBinding IsColorPaletteVisible}"
                          IsColorPreviewVisible="{TemplateBinding IsColorPreviewVisible}"
-                         IsColorSliderVisible="{TemplateBinding IsColorSliderVisible}"
                          IsColorSpectrumVisible="{TemplateBinding IsColorSpectrumVisible}"
+                         IsColorSpectrumSliderVisible="{TemplateBinding IsColorSpectrumSliderVisible}"
                          IsComponentTextInputVisible="{TemplateBinding IsComponentTextInputVisible}"
                          IsHexInputVisible="{TemplateBinding IsHexInputVisible}"
                          MaxHue="{TemplateBinding MaxHue}"

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

@@ -121,7 +121,7 @@
               </Style>
             </TabControl.Styles>
             <!-- Spectrum Tab -->
-            <TabItem>
+            <TabItem IsVisible="{TemplateBinding IsColorSpectrumVisible}">
               <TabItem.Header>
                 <Border Width="116"
                         Height="{DynamicResource ColorViewTabStripHeight}">
@@ -150,7 +150,8 @@
                                         HsvColor="{Binding HsvColor, ElementName=ColorSpectrum}"
                                         HorizontalAlignment="Center"
                                         VerticalAlignment="Stretch"
-                                        Margin="0,0,12,0" />
+                                        Margin="0,0,12,0"
+                                        IsVisible="{TemplateBinding IsColorSpectrumSliderVisible}"/>
                 <primitives:ColorSpectrum x:Name="ColorSpectrum"
                                           Grid.Column="1"
                                           Components="{TemplateBinding ColorSpectrumComponents}"
@@ -178,7 +179,7 @@
               </Grid>
             </TabItem>
             <!-- Palette Tab -->
-            <TabItem>
+            <TabItem IsVisible="{TemplateBinding IsColorPaletteVisible}">
               <TabItem.Header>
                 <Border Width="116"
                         Height="{DynamicResource ColorViewTabStripHeight}">
@@ -254,7 +255,7 @@
               </ListBox>
             </TabItem>
             <!-- Components Tab -->
-            <TabItem>
+            <TabItem IsVisible="{TemplateBinding IsColorComponentsVisible}">
               <TabItem.Header>
                 <Border Width="116"
                         Height="{DynamicResource ColorViewTabStripHeight}">
@@ -590,7 +591,7 @@
           <!-- Previewer -->
           <!-- Note that top/bottom margins have -5 to remove for drop shadow padding -->
           <primitives:ColorPreviewer Grid.Row="1"
-                                     ShowAccentColors="True"
+                                     ShowAccentColors="{TemplateBinding ShowAccentColors}"
                                      HsvColor="{Binding HsvColor, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
                                      Margin="12,-5,12,7"
                                      IsVisible="{TemplateBinding IsColorPreviewVisible}" />