Added keyboard highlighting to selected search control item

src/PixiEditor.AvaloniaUI/Models/Commands/Search/SearchResult.cs

@@ -1,11 +1,10 @@
 using System.Collections.Generic;
+using System.Diagnostics;
 using System.Linq;
 using System.Text.RegularExpressions;
 using System.Windows.Input;
 using Avalonia;
-using Avalonia.Controls;
 using Avalonia.Controls.Documents;
-using Avalonia.Controls.Metadata;
 using Avalonia.Media;
 using CommunityToolkit.Mvvm.ComponentModel;
 using CommunityToolkit.Mvvm.Input;
@@ -13,6 +12,7 @@ using PixiEditor.AvaloniaUI.Models.Input;
 
 namespace PixiEditor.AvaloniaUI.Models.Commands.Search;
 
+[DebuggerDisplay("{Text}, Can Execute = {CanExecute}")]
 internal abstract class SearchResult : ObservableObject
 {
     private bool isSelected;
@@ -52,7 +52,6 @@ internal abstract class SearchResult : ObservableObject
 
     public SearchResult()
     {
-
         ExecuteCommand = new RelayCommand(Execute, () => CanExecute);
     }
 

src/PixiEditor.AvaloniaUI/Views/Main/CommandSearch/CommandSearchControl.axaml

@@ -50,69 +50,13 @@
                                         Command="{Binding ButtonClickedCommand, ElementName=uc}"
                                         CommandParameter="{Binding}"
                                         HorizontalContentAlignment="Stretch"
+                                        IsEnabled="{Binding CanExecute}"
                                         PointerMoved="Button_MouseMove">
-                                    <!--TODO: Implement-->
-                                    <!--<Button.Styles>
-                                        <Style Selector="Button">
-                                            <Setter Property="Template">
-                                                <Setter.Value>
-                                                    <ControlTemplate TargetType="Button">
-                                                        <Border>
-                                                            <Border.Styles>
-                                                                <Style Selector="Border">
-                                                                    <Style.Triggers>
-                                                                        <DataTrigger
-                                                                            Binding="{Binding IsSelected, Mode=TwoWay}"
-                                                                            Value="False">
-                                                                            <Setter Property="Background"
-                                                                                Value="Transparent" />
-                                                                        </DataTrigger>
-                                                                        <DataTrigger
-                                                                            Binding="{Binding IsMouseSelected, Mode=TwoWay}"
-                                                                            Value="False">
-                                                                            <Setter Property="Background"
-                                                                                Value="Transparent" />
-                                                                        </DataTrigger>
-                                                                        <DataTrigger
-                                                                            Binding="{Binding IsMouseSelected, Mode=TwoWay}"
-                                                                            Value="True">
-                                                                            <Setter Property="Background"
-                                                                                Value="{StaticResource BrighterAccentColor}" />
-                                                                        </DataTrigger>
-                                                                        <DataTrigger
-                                                                            Binding="{Binding IsSelected, Mode=TwoWay}"
-                                                                            Value="True">
-                                                                            <Setter Property="Background"
-                                                                                Value="{StaticResource AlmostLightModeAccentColor}" />
-                                                                        </DataTrigger>
-                                                                        <DataTrigger Binding="{Binding CanExecute}"
-                                                                            Value="False">
-                                                                            <Setter Property="Background"
-                                                                                Value="Transparent" />
-                                                                        </DataTrigger>
-                                                                    </Style.Triggers>
-                                                                </Style>
-                                                            </Border.Styles>
-                                                            <ContentPresenter />
-                                                        </Border>
-                                                    </ControlTemplate>
-                                                </Setter.Value>
-                                            </Setter>
+                                    <Button.Styles>
+                                        <Style Selector="Button.keyboard">
+                                            <Setter Property="Background" Value="{DynamicResource ThemeControlHighBrush}"/>
                                         </Style>
-                                    </Button.Styles>-->
-                                    <Button.Resources>
-                                        <!--<Style TargetType="TextBlock">
-                                            <Setter Property="FontSize" Value="16" />
-                                            <Style.Triggers>
-                                                <DataTrigger Binding="{Binding CanExecute}" Value="True">
-                                                    <Setter Property="Foreground" Value="White" />
-                                                </DataTrigger>
-                                                <DataTrigger Binding="{Binding CanExecute}" Value="False">
-                                                    <Setter Property="Foreground" Value="Gray" />
-                                                </DataTrigger>
-                                            </Style.Triggers>
-                                        </Style>-->
-                                    </Button.Resources>
+                                    </Button.Styles>
                                     <Grid VerticalAlignment="Center" x:Name="dp" Margin="5,0,10,0">
                                         <Grid.ColumnDefinitions>
                                             <ColumnDefinition />

src/PixiEditor.AvaloniaUI/Views/Main/CommandSearch/CommandSearchControl.axaml.cs

@@ -7,6 +7,7 @@ using Avalonia;
 using Avalonia.Controls;
 using Avalonia.Input;
 using Avalonia.Threading;
+using Avalonia.VisualTree;
 using CommunityToolkit.Mvvm.Input;
 using PixiEditor.AvaloniaUI.Helpers.Extensions;
 using PixiEditor.AvaloniaUI.Models.Commands;
@@ -267,7 +268,26 @@ internal partial class CommandSearchControl : UserControl, INotifyPropertyChange
         newIndex = (newIndex % Results.Count + Results.Count) % Results.Count;
 
         SelectedResult = delta > 0 ? Results.IndexOrNext(x => x.CanExecute, newIndex) : Results.IndexOrPrevious(x => x.CanExecute, newIndex);
-        itemscontrol.ItemContainerGenerator.ContainerFromIndex(newIndex)?.BringIntoView();
+
+        newIndex = Results.IndexOf(SelectedResult);
+        var target = itemscontrol.ContainerFromIndex(newIndex);
+        target?.BringIntoView();
+        
+        var containers = itemscontrol.GetRealizedContainers();
+
+        foreach (var container in containers)
+        {
+            var button = container.FindDescendantOfType<Button>()!;
+            
+            if (container == target)
+            {
+                button.Classes.Add("keyboard");
+            }
+            else
+            {
+                button.Classes.Remove("keyboard");
+            }
+        }
     }
 
     private void Button_MouseMove(object sender, PointerEventArgs e)