Add Slider

Author: Colin Mackay

src/Stravaig.Avalonia.Controls.Icons/PhosphorIcon/PhosphorIconType.cs

@@ -2,10 +2,10 @@ namespace Stravaig.Avalonia.Controls.Icons;
 
 public enum PhosphorIconType
 {
-    Light = 1,
-    Thin = 2,
+    Thin = 1,
+    Light = 2,
     Regular = 3,
     Bold = 4,
     Fill = 5,
     Duotone = 6,
-}
+}

src/Stravaig.Icons.Example/ViewModels/PhosphorIconDemoViewModel.cs

@@ -19,6 +19,9 @@ public partial class PhosphorIconDemoViewModel : ViewModelBase
     [ObservableProperty]
     private PhosphorIconType _selectedIconType;
 
+    [ObservableProperty]
+    private int _iconSize;
+
     partial void OnSelectedIconTypeIndexChanged(int? value)
     {
         if (value.HasValue)
@@ -32,6 +35,7 @@ public PhosphorIconDemoViewModel()
         _isExpanded = Design.IsDesignMode;
         _selectedIconTypeIndex = 0;
         _selectedIconType = IconTypes[0].Key;
+        _iconSize = 24;
     }
 
     public List<KeyValuePair<PhosphorIconName, string>> Icons { get; } = Enum.GetValues<PhosphorIconName>().Select(n => new KeyValuePair<PhosphorIconName, string>(n, n.ToString())).ToList();

src/Stravaig.Icons.Example/Views/PhosphorIconDemoView.axaml

@@ -50,6 +50,24 @@
                     </ComboBox>
                 </StackPanel>
 
+                <StackPanel Orientation="Horizontal">
+                    <TextBlock
+                        Margin="5"
+                        Classes="H2"
+                        VerticalAlignment="Center"
+                        Text="Size:"/>
+                    <Slider
+                        HorizontalAlignment="Stretch"
+                        Minimum="8"
+                        Maximum="256"
+                        MinWidth="256"
+                        Value="{Binding IconSize}"/>
+                    <TextBlock
+                        Margin="5"
+                        Text="{Binding IconSize}"
+                        VerticalAlignment="Center"/>
+                </StackPanel>
+
                 <ItemsControl Name="IconsItemsControl" ItemsSource="{Binding Icons}">
                     <ItemsControl.ItemsPanel>
                         <ItemsPanelTemplate>
@@ -69,8 +87,8 @@
                                     <icons:PhosphorIcon
                                         IconName="{Binding Key}"
                                         IconType="{Binding #PhosphorIconDemo.((vm:PhosphorIconDemoViewModel)DataContext).SelectedIconType, FallbackValue={x:Static icons:PhosphorIconType.Regular}}"
-                                        Width="24"
-                                        Height="24"/>
+                                        Width="{Binding #PhosphorIconDemo.((vm:PhosphorIconDemoViewModel)DataContext).IconSize, FallbackValue=24}"
+                                        Height="{Binding #PhosphorIconDemo.((vm:PhosphorIconDemoViewModel)DataContext).IconSize, FallbackValue=24}"/>
                                     <TextBlock
                                         HorizontalAlignment="Center"
                                         Text="{Binding Value}"/>