Icons - Dropped SVG support and fixed filling

2026-11-12 03:48:56 +00:00 · 2022-06-06 20:54:39 +02:00
1 parent dd40bdd544
commit 0d3890e560
@@ -72,34 +72,31 @@
                                         IsChecked="{CompiledBinding IconType, Converter={StaticResource EnumBoolConverter}, ConverterParameter={x:Static core:ProfileConfigurationIconType.MaterialIcon}}" />
                            <RadioButton Content="Bitmap image"
                                         IsChecked="{CompiledBinding IconType, Converter={StaticResource EnumBoolConverter}, ConverterParameter={x:Static core:ProfileConfigurationIconType.BitmapImage}}" />
-                            <RadioButton Content="SVG image"
-                                         IsChecked="{CompiledBinding IconType, Converter={StaticResource EnumBoolConverter}, ConverterParameter={x:Static core:ProfileConfigurationIconType.SvgImage}}" />
                        </WrapPanel>

                        <StackPanel Orientation="Horizontal"
                                    IsVisible="{CompiledBinding IconType, Converter={StaticResource EnumBoolConverter}, ConverterParameter={x:Static core:ProfileConfigurationIconType.BitmapImage}}">
-                            <Border Background="{DynamicResource CheckerboardBrush}" CornerRadius="{DynamicResource CardCornerRadius}" Width="78" Height="78">
+                                                       
+                            <Border IsVisible="{CompiledBinding ProfileConfiguration.Icon.Fill}" Background="{DynamicResource CheckerboardBrush}" CornerRadius="{DynamicResource CardCornerRadius}" Width="78" Height="78">
+                                <Border Name="FillPreview" Background="{DynamicResource TextFillColorPrimary}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Margin="10">
+                                    <Border.OpacityMask>
+                                        <ImageBrush Source="{CompiledBinding SelectedBitmapSource}" BitmapInterpolationMode="HighQuality" />
+                                    </Border.OpacityMask>
+                                </Border>
+                            </Border>
+                            <Border IsVisible="{CompiledBinding !ProfileConfiguration.Icon.Fill}" Background="{DynamicResource CheckerboardBrush}" CornerRadius="{DynamicResource CardCornerRadius}" Width="78" Height="78">
                                <Image Source="{CompiledBinding SelectedBitmapSource}" Margin="10" />
                            </Border>
+                            
                            <Button Command="{CompiledBinding BrowseBitmapFile}"
                                    VerticalAlignment="Bottom"
                                    Margin="10 0"
                                    IsVisible="{CompiledBinding IconType, Converter={StaticResource EnumBoolConverter}, ConverterParameter={x:Static core:ProfileConfigurationIconType.BitmapImage}}">
                                Browse bitmap file
                            </Button>
+                            <CheckBox VerticalAlignment="Bottom" IsChecked="{CompiledBinding ProfileConfiguration.Icon.Fill}">Fill</CheckBox>
                        </StackPanel>
-                        <StackPanel Orientation="Horizontal"
-                                    IsVisible="{CompiledBinding IconType, Converter={StaticResource EnumBoolConverter}, ConverterParameter={x:Static core:ProfileConfigurationIconType.SvgImage}}">
-                            <Border Background="{DynamicResource CheckerboardBrush}" CornerRadius="{DynamicResource CardCornerRadius}" Width="78" Height="78">
-                                <Image Margin="10" Source="{CompiledBinding SelectedSvgSource}" />
-                            </Border>
-                            <Button Command="{CompiledBinding BrowseSvgFile}"
-                                    VerticalAlignment="Bottom"
-                                    Margin="10 0"
-                                    IsVisible="{CompiledBinding IconType, Converter={StaticResource EnumBoolConverter}, ConverterParameter={x:Static core:ProfileConfigurationIconType.SvgImage}}">
-                                Browse SVG file
-                            </Button>
-                        </StackPanel>
+                        
                        <StackPanel Orientation="Horizontal"
                                    IsVisible="{CompiledBinding IconType, Converter={StaticResource EnumBoolConverter}, ConverterParameter={x:Static core:ProfileConfigurationIconType.MaterialIcon}}">
                            <Border Background="{DynamicResource CheckerboardBrush}" CornerRadius="{DynamicResource CardCornerRadius}" Width="78" Height="78">
@@ -1,6 +1,9 @@
+using System;
+using System.Reactive.Disposables;
 using Avalonia;
+using Avalonia.Controls;
 using Avalonia.Markup.Xaml;
-using Avalonia.ReactiveUI;
+using ReactiveUI;

 namespace Artemis.UI.Screens.Sidebar
 {
@@ -9,6 +12,8 @@ namespace Artemis.UI.Screens.Sidebar
        public ProfileConfigurationEditView()
        {
            InitializeComponent();
+            this.WhenActivated(d => ViewModel.WhenAnyValue(vm => vm.SelectedBitmapSource).Subscribe(_ => this.Get<Border>("FillPreview").InvalidateVisual()).DisposeWith(d));
+            
 #if DEBUG
            this.AttachDevTools();
 #endif
@@ -19,4 +24,4 @@ namespace Artemis.UI.Screens.Sidebar
            AvaloniaXamlLoader.Load(this);
        }
    }
-}
+}
@@ -14,7 +14,6 @@ using Artemis.UI.Shared;
 using Artemis.UI.Shared.Services;
 using Artemis.UI.Shared.Services.ProfileEditor;
 using Avalonia.Media.Imaging;
-using Avalonia.Svg.Skia;
 using Avalonia.Threading;
 using Material.Icons;
 using Newtonsoft.Json;
@@ -39,7 +38,6 @@ namespace Artemis.UI.Screens.Sidebar
        private string? _selectedIconPath;
        private ProfileIconViewModel? _selectedMaterialIcon;
        private ProfileModuleViewModel? _selectedModule;
-        private SvgImage? _selectedSvgSource;
        private readonly ObservableAsPropertyHelper<ModuleActivationRequirementsViewModel?> _moduleActivationRequirementsViewModel;

        public ProfileConfigurationEditViewModel(
@@ -74,7 +72,6 @@ namespace Artemis.UI.Screens.Sidebar
            VisualEditorViewModel = nodeVmFactory.NodeScriptViewModel(_profileConfiguration.ActivationCondition, true);

            BrowseBitmapFile = ReactiveCommand.CreateFromTask(ExecuteBrowseBitmapFile);
-            BrowseSvgFile = ReactiveCommand.CreateFromTask(ExecuteBrowseSvgFile);
            OpenConditionEditor = ReactiveCommand.CreateFromTask(ExecuteOpenConditionEditor);
            Confirm = ReactiveCommand.CreateFromTask(ExecuteConfirm);
            Import = ReactiveCommand.CreateFromTask(ExecuteImport);
@@ -133,7 +130,6 @@ namespace Artemis.UI.Screens.Sidebar

        public ReactiveCommand<Unit, Unit> OpenConditionEditor { get; }
        public ReactiveCommand<Unit, Unit> BrowseBitmapFile { get; }
-        public ReactiveCommand<Unit, Unit> BrowseSvgFile { get; }
        public ReactiveCommand<Unit, Unit> Confirm { get; }
        public ReactiveCommand<Unit, Unit> Import { get; }
        public ReactiveCommand<Unit, Unit> Delete { get; }
@@ -237,30 +233,21 @@ namespace Artemis.UI.Screens.Sidebar
            set => RaiseAndSetIfChanged(ref _selectedBitmapSource, value);
        }

-        public SvgImage? SelectedSvgSource
-        {
-            get => _selectedSvgSource;
-            set => RaiseAndSetIfChanged(ref _selectedSvgSource, value);
-        }
-
        private void LoadIcon()
        {
            // Preselect the icon based on streams if needed
            if (_profileConfiguration.Icon.IconType == ProfileConfigurationIconType.BitmapImage)
            {
-                SelectedBitmapSource = new Bitmap(_profileConfiguration.Icon.GetIconStream());
-            }
-            else if (_profileConfiguration.Icon.IconType == ProfileConfigurationIconType.SvgImage)
-            {
-                Stream? iconStream = _profileConfiguration.Icon.GetIconStream();
-                if (iconStream != null)
+                try
                {
-                    SvgSource newSource = new();
-                    newSource.Load(iconStream);
-                    SelectedSvgSource = new SvgImage {Source = newSource};
+                    SelectedBitmapSource = new Bitmap(_profileConfiguration.Icon.GetIconStream());
+                }
+                catch (Exception e)
+                {
+                    _windowService.ShowConfirmContentDialog("Failed to load profile icon", e.Message, "Meh", null);
                }
            }
-
+            
            // Prepare the contents of the dropdown box, it should be virtualized so no need to wait with this
            ObservableCollection<ProfileIconViewModel> icons = new(Enum.GetValues<MaterialIconKind>()
                .Select(kind => new ProfileIconViewModel(kind))
@@ -299,23 +286,7 @@ namespace Artemis.UI.Screens.Sidebar
            SelectedBitmapSource = new Bitmap(result[0]);
            _selectedIconPath = result[0];
        }
-
-        private async Task ExecuteBrowseSvgFile()
-        {
-            string[]? result = await _windowService.CreateOpenFileDialog()
-                .HavingFilter(f => f.WithExtension("svg").WithName("SVG image"))
-                .ShowAsync();
-
-            if (result == null)
-                return;
-
-            SvgSource newSource = new();
-            newSource.Load(result[0]);
-
-            SelectedSvgSource = new SvgImage {Source = newSource};
-            _selectedIconPath = result[0];
-        }
-
+        
        private async Task ExecuteOpenConditionEditor()
        {
            await _windowService.ShowDialogAsync<NodeScriptWindowViewModel, bool>(("nodeScript", ProfileConfiguration.ActivationCondition));
@@ -4,7 +4,6 @@
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:avalonia="clr-namespace:Material.Icons.Avalonia;assembly=Material.Icons.Avalonia"
             xmlns:controls="clr-namespace:FluentAvalonia.UI.Controls;assembly=FluentAvalonia"
-             xmlns:svg="clr-namespace:Avalonia.Svg.Skia;assembly=Avalonia.Svg.Skia"
             mc:Ignorable="d" d:DesignWidth="240" d:DesignHeight="450"
             x:Class="Artemis.UI.Screens.Sidebar.SidebarView">
    <UserControl.Styles>
@@ -12,11 +11,7 @@
    </UserControl.Styles>
    <Grid RowDefinitions="60,Auto,Auto,*,Auto,Auto">
        <Grid Grid.Row="0" IsHitTestVisible="False" ColumnDefinitions="Auto,*">
-            <Image Grid.Column="0">
-                <Image.Source>
-                    <svg:SvgImage Source="/Assets/Images/Logo/bow.svg" />
-                </Image.Source>
-            </Image>
+            <Image Grid.Column="0" Margin="12" Source="/Assets/Images/Logo/bow.png" RenderOptions.BitmapInterpolationMode="HighQuality"/>
            <TextBlock Grid.Column="1"
                       FontSize="24"
                       VerticalAlignment="Center"