feat: 1. update container state from selection collection change.

2. Add popup slot. 3. fix various binding relative resource issue. 4. update empty pseudo-class handing, simplify watermark visibility.
2024-08-24 12:59:58 +08:00
parent fc26ec7ce5
commit dffdcf3aa3
5 changed files with 174 additions and 95 deletions
--- a/demo/Ursa.Demo/Pages/MultiComboBoxDemo.axaml
+++ b/demo/Ursa.Demo/Pages/MultiComboBoxDemo.axaml
@@ -12,6 +12,12 @@
    x:DataType="vm:MultiComboBoxDemoViewModel"
    mc:Ignorable="d">
    <StackPanel Orientation="Horizontal">
+        <u:MultiComboBox
+            Watermark="Please Select"
+            MaxHeight="200"
+            SelectedItems="{Binding SelectedItems}"
+            ItemsSource="{Binding Items}" >
+        </u:MultiComboBox>
        <u:MultiComboBox
            Name="combo"
            Watermark="Please Select"
@@ -19,8 +25,21 @@
            InnerRightContent="Right"
            Classes="ClearButton"
            MaxHeight="200"
+            SelectedItems="{Binding SelectedItems}"
            ItemsSource="{Binding Items}" >
+            <u:MultiComboBox.PopupInnerTopContent>
+                <StackPanel Margin="0" Orientation="Horizontal">
+                    <Button Theme="{DynamicResource BorderlessButton}" Content="Select All" Command="{Binding SelectAllCommand}"/>
+                    <Button Theme="{DynamicResource BorderlessButton}" Content="Unselect All" Command="{Binding ClearAllCommand}"/>
+                    <Button Theme="{DynamicResource BorderlessButton}" Content="Inverse" Command="{Binding InvertSelectionCommand}"/>
+                </StackPanel>
+            </u:MultiComboBox.PopupInnerTopContent>
+            <u:MultiComboBox.ContextFlyout>
+                <MenuFlyout>
+                    <MenuItem Header="Select All" Command="{Binding SelectAllCommand}"/>
+                </MenuFlyout>
+            </u:MultiComboBox.ContextFlyout>
        </u:MultiComboBox>
-        <ListBox ItemsSource="{Binding #combo.SelectedItems}" />
+        <ListBox ItemsSource="{Binding SelectedItems}" />
    </StackPanel>
 </UserControl>
--- a/demo/Ursa.Demo/ViewModels/MultiComboBoxDemoViewModel.cs
+++ b/demo/Ursa.Demo/ViewModels/MultiComboBoxDemoViewModel.cs
@@ -1,5 +1,8 @@
-using System.Collections.ObjectModel;
+using System.Collections.Generic;
+using System.Collections.ObjectModel;
+using System.Windows.Input;
 using CommunityToolkit.Mvvm.ComponentModel;
+using CommunityToolkit.Mvvm.Input;

 namespace Ursa.Demo.ViewModels;

@@ -7,6 +10,35 @@ public class MultiComboBoxDemoViewModel: ObservableObject
 {
    public ObservableCollection<string> Items { get; set; }
    
+    public ObservableCollection<string> SelectedItems { get; set; }
+
+    public ICommand SelectAllCommand => new RelayCommand(() =>
+    {
+        SelectedItems.Clear();
+        foreach (var item in Items)
+        {
+            SelectedItems.Add(item);
+        }
+    });
+    
+    public ICommand ClearAllCommand => new RelayCommand(() =>
+    {
+        SelectedItems.Clear();
+    });
+    
+    public ICommand InvertSelectionCommand => new RelayCommand(() =>
+    {
+        var selectedItems = new List<string>(SelectedItems);
+        SelectedItems.Clear();
+        foreach (var item in Items)
+        {
+            if (!selectedItems.Contains(item))
+            {
+                SelectedItems.Add(item);
+            }
+        }
+    });
+    
    public MultiComboBoxDemoViewModel()
    {
        Items = new ObservableCollection<string>()
@@ -47,5 +79,6 @@ public class MultiComboBoxDemoViewModel: ObservableObject
            "Pennsylvania",
            "Rhode Island",
        };
+        SelectedItems = new ObservableCollection<string>();
    }
 }
--- a/src/Ursa.Themes.Semi/Controls/MultiComboBox.axaml
+++ b/src/Ursa.Themes.Semi/Controls/MultiComboBox.axaml
@@ -51,6 +51,7 @@
                                  HorizontalAlignment="Left"
                                  VerticalAlignment="Center"
                                  Foreground="{TemplateBinding Foreground}"
+                                  IsHitTestVisible="False"
                                  IsVisible="False"
                                  Opacity="0.3"
                                  Text="{TemplateBinding Watermark}" />
@@ -104,7 +105,7 @@
                            </Grid>
                        </Border>
                        <Popup
-                            Width="{Binding #PART_RootGrid.Bounds.Width}"
+                            MinWidth="{Binding #PART_RootGrid.Bounds.Width}"
                            MaxHeight="{TemplateBinding MaxDropdownHeight}"
                            IsLightDismissEnabled="True"
                            IsOpen="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=IsDropDownOpen, Mode=TwoWay}"
@@ -118,16 +119,20 @@
                                BoxShadow="{DynamicResource ComboBoxPopupBoxShadow}"
                                ClipToBounds="True"
                                CornerRadius="6">
-                                <ScrollViewer
-                                    Grid.IsSharedSizeScope="True"
-                                    HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
-                                    VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
-                                    <ItemsPresenter
-                                        Name="PART_ItemsPresenter"
-                                        Margin="{DynamicResource ComboBoxDropdownContentMargin}"
-                                        HorizontalAlignment="Stretch"
-                                        ItemsPanel="{TemplateBinding ItemsPanel}" />
-                                </ScrollViewer>
+                                <DockPanel LastChildFill="True">
+                                    <ContentPresenter Content="{TemplateBinding PopupInnerTopContent}" DockPanel.Dock="Top"/>
+                                    <ContentPresenter Content="{TemplateBinding PopupInnerBottomContent}" DockPanel.Dock="Bottom"/>
+                                    <ScrollViewer
+                                        Grid.IsSharedSizeScope="True"
+                                        HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
+                                        VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}">
+                                        <ItemsPresenter
+                                            Name="PART_ItemsPresenter"
+                                            Margin="{DynamicResource ComboBoxDropdownContentMargin}"
+                                            HorizontalAlignment="Stretch"
+                                            ItemsPanel="{TemplateBinding ItemsPanel}" />
+                                    </ScrollViewer>
+                                </DockPanel>
                            </Border>
                        </Popup>
                    </Panel>
@@ -143,12 +148,12 @@

        <Style Selector="^.clearButton, ^.ClearButton">
            <Style Selector="^:pointerover:not(:selection-empty) /template/ Button#ClearButton">
-                <Setter Property="IsVisible" Value="{Binding $parent[ComboBox].SelectionBoxItem, Converter={x:Static ObjectConverters.IsNotNull}}" />
+                <Setter Property="IsVisible" Value="True" />
            </Style>
        </Style>

        <Style Selector="^:selection-empty /template/ TextBlock#PlaceholderTextBlock">
-            <Setter Property="IsVisible" Value="{Binding $parent[ComboBox].SelectionBoxItem, Converter={x:Static ObjectConverters.IsNotNull}}" />
+            <Setter Property="IsVisible" Value="True" />
        </Style>

        <!--  Pointerover State  -->
--- a/src/Ursa/Controls/ComboBox/MultiComboBox.cs
+++ b/src/Ursa/Controls/ComboBox/MultiComboBox.cs
@@ -8,128 +8,159 @@ using Avalonia.Controls.Primitives;
 using Avalonia.Controls.Templates;
 using Avalonia.Input;
 using Avalonia.Interactivity;
-using Irihi.Avalonia.Shared.Helpers;
 using Irihi.Avalonia.Shared.Contracts;
+using Irihi.Avalonia.Shared.Helpers;

 namespace Ursa.Controls;

 [TemplatePart(PART_BackgroundBorder, typeof(Border))]
 [PseudoClasses(PC_DropDownOpen, PC_Empty)]
-public class MultiComboBox: SelectingItemsControl, IInnerContentControl
+public class MultiComboBox : SelectingItemsControl, IInnerContentControl, IPopupInnerContent
 {
    public const string PART_BackgroundBorder = "PART_BackgroundBorder";
    public const string PC_DropDownOpen = ":dropdownopen";
    public const string PC_Empty = ":selection-empty";

-    private Border? _rootBorder;
-    
-    private static ITemplate<Panel?> _defaultPanel = new FuncTemplate<Panel?>(() => new VirtualizingStackPanel());
+    private static readonly ITemplate<Panel?> _defaultPanel =
+        new FuncTemplate<Panel?>(() => new VirtualizingStackPanel());

    public static readonly StyledProperty<bool> IsDropDownOpenProperty =
        ComboBox.IsDropDownOpenProperty.AddOwner<MultiComboBox>();

+    public static readonly StyledProperty<double> MaxDropdownHeightProperty =
+        AvaloniaProperty.Register<MultiComboBox, double>(
+            nameof(MaxDropdownHeight));
+
+    public static readonly StyledProperty<double> MaxSelectionBoxHeightProperty =
+        AvaloniaProperty.Register<MultiComboBox, double>(
+            nameof(MaxSelectionBoxHeight));
+
+    public new static readonly StyledProperty<IList?> SelectedItemsProperty =
+        AvaloniaProperty.Register<MultiComboBox, IList?>(
+            nameof(SelectedItems));
+
+    public static readonly StyledProperty<object?> InnerLeftContentProperty =
+        AvaloniaProperty.Register<MultiComboBox, object?>(
+            nameof(InnerLeftContent));
+
+    public static readonly StyledProperty<object?> InnerRightContentProperty =
+        AvaloniaProperty.Register<MultiComboBox, object?>(
+            nameof(InnerRightContent));
+
+
+    public static readonly StyledProperty<IDataTemplate?> SelectedItemTemplateProperty =
+        AvaloniaProperty.Register<MultiComboBox, IDataTemplate?>(
+            nameof(SelectedItemTemplate));
+
+    public static readonly StyledProperty<string?> WatermarkProperty =
+        TextBox.WatermarkProperty.AddOwner<MultiComboBox>();
+
+    public static readonly StyledProperty<object?> PopupInnerTopContentProperty =
+        AvaloniaProperty.Register<MultiComboBox, object?>(
+            nameof(PopupInnerTopContent));
+
+    public static readonly StyledProperty<object?> PopupInnerBottomContentProperty =
+        AvaloniaProperty.Register<MultiComboBox, object?>(
+            nameof(PopupInnerBottomContent));
+
+    private Border? _rootBorder;
+
+    static MultiComboBox()
+    {
+        FocusableProperty.OverrideDefaultValue<MultiComboBox>(true);
+        ItemsPanelProperty.OverrideDefaultValue<MultiComboBox>(_defaultPanel);
+        IsDropDownOpenProperty.AffectsPseudoClass<MultiComboBox>(PC_DropDownOpen);
+        SelectedItemsProperty.Changed.AddClassHandler<MultiComboBox, IList?>((box, args) =>
+            box.OnSelectedItemsChanged(args));
+    }
+
+    public MultiComboBox()
+    {
+        SelectedItems = new AvaloniaList<object>();
+        if (SelectedItems is INotifyCollectionChanged c) c.CollectionChanged += OnSelectedItemsCollectionChanged;
+    }
+
    public bool IsDropDownOpen
    {
        get => GetValue(IsDropDownOpenProperty);
        set => SetValue(IsDropDownOpenProperty, value);
    }

-    public static readonly StyledProperty<double> MaxDropdownHeightProperty = AvaloniaProperty.Register<MultiComboBox, double>(
-        nameof(MaxDropdownHeight));
-
    public double MaxDropdownHeight
    {
        get => GetValue(MaxDropdownHeightProperty);
        set => SetValue(MaxDropdownHeightProperty, value);
    }

-    public static readonly StyledProperty<double> MaxSelectionBoxHeightProperty = AvaloniaProperty.Register<MultiComboBox, double>(
-        nameof(MaxSelectionBoxHeight));
-
    public double MaxSelectionBoxHeight
    {
        get => GetValue(MaxSelectionBoxHeightProperty);
        set => SetValue(MaxSelectionBoxHeightProperty, value);
    }

-    public new static readonly StyledProperty<IList?> SelectedItemsProperty = AvaloniaProperty.Register<MultiComboBox, IList?>(
-        nameof(SelectedItems));
-
    public new IList? SelectedItems
    {
        get => GetValue(SelectedItemsProperty);
        set => SetValue(SelectedItemsProperty, value);
    }

-    public static readonly StyledProperty<object?> InnerLeftContentProperty = AvaloniaProperty.Register<MultiComboBox, object?>(
-        nameof(InnerLeftContent));
-
-    public object? InnerLeftContent
-    {
-        get => GetValue(InnerLeftContentProperty);
-        set => SetValue(InnerLeftContentProperty, value);
-    }
-
-    public static readonly StyledProperty<object?> InnerRightContentProperty = AvaloniaProperty.Register<MultiComboBox, object?>(
-        nameof(InnerRightContent));
-
-    public object? InnerRightContent
-    {
-        get => GetValue(InnerRightContentProperty);
-        set => SetValue(InnerRightContentProperty, value);
-    }
-
-    public static readonly StyledProperty<IDataTemplate?> SelectedItemTemplateProperty = AvaloniaProperty.Register<MultiComboBox, IDataTemplate?>(
-        nameof(SelectedItemTemplate));
-
    public IDataTemplate? SelectedItemTemplate
    {
        get => GetValue(SelectedItemTemplateProperty);
        set => SetValue(SelectedItemTemplateProperty, value);
    }

-    public static readonly StyledProperty<string?> WatermarkProperty =
-        TextBox.WatermarkProperty.AddOwner<MultiComboBox>();
-
    public string? Watermark
    {
        get => GetValue(WatermarkProperty);
        set => SetValue(WatermarkProperty, value);
    }

-    static MultiComboBox()
+    public object? InnerLeftContent
    {
-        FocusableProperty.OverrideDefaultValue<MultiComboBox>(true);
-        ItemsPanelProperty.OverrideDefaultValue<MultiComboBox>(_defaultPanel);
-        IsDropDownOpenProperty.AffectsPseudoClass<MultiComboBox>(PC_DropDownOpen);
-        SelectedItemsProperty.Changed.AddClassHandler<MultiComboBox, IList?>((box, args) => box.OnSelectedItemsChanged(args));
+        get => GetValue(InnerLeftContentProperty);
+        set => SetValue(InnerLeftContentProperty, value);
    }

-    public MultiComboBox()
+    public object? InnerRightContent
    {
-        SelectedItems = new AvaloniaList<object>();
-        if (SelectedItems is INotifyCollectionChanged c)
-        {
-            c.CollectionChanged+= OnSelectedItemsCollectionChanged;
-        }
+        get => GetValue(InnerRightContentProperty);
+        set => SetValue(InnerRightContentProperty, value);
+    }

+    public object? PopupInnerTopContent
+    {
+        get => GetValue(PopupInnerTopContentProperty);
+        set => SetValue(PopupInnerTopContentProperty, value);
+    }
+
+    public object? PopupInnerBottomContent
+    {
+        get => GetValue(PopupInnerBottomContentProperty);
+        set => SetValue(PopupInnerBottomContentProperty, value);
    }

    private void OnSelectedItemsChanged(AvaloniaPropertyChangedEventArgs<IList?> args)
    {
        if (args.OldValue.Value is INotifyCollectionChanged old)
-        {
-            old.CollectionChanged-=OnSelectedItemsCollectionChanged;
-        }
+            old.CollectionChanged -= OnSelectedItemsCollectionChanged;
        if (args.NewValue.Value is INotifyCollectionChanged @new)
-        {
            @new.CollectionChanged += OnSelectedItemsCollectionChanged;
-        }
    }

    private void OnSelectedItemsCollectionChanged(object? sender, NotifyCollectionChangedEventArgs e)
    {
-        PseudoClasses.Set(PC_Empty, SelectedItems?.Count == 0);
+        PseudoClasses.Set(PC_Empty, SelectedItems?.Count is null or 0);
+        //return;
+        var containers = Presenter?.Panel?.Children;
+        if (containers is null) return;
+        foreach (var container in containers)
+        {
+            if (container is MultiComboBoxItem i)
+            {
+                i.UpdateSelection();
+            }
+        }
    }

    protected override bool NeedsContainerOverride(object? item, int index, out object? recycleKey)
@@ -159,10 +190,7 @@ public class MultiComboBox: SelectingItemsControl, IInnerContentControl

    internal void ItemFocused(MultiComboBoxItem dropDownItem)
    {
-        if (IsDropDownOpen && dropDownItem.IsFocused && dropDownItem.IsArrangeValid)
-        {
-            dropDownItem.BringIntoView();
-        }
+        if (IsDropDownOpen && dropDownItem.IsFocused && dropDownItem.IsArrangeValid) dropDownItem.BringIntoView();
    }

    public void Remove(object? o)
@@ -170,40 +198,29 @@ public class MultiComboBox: SelectingItemsControl, IInnerContentControl
        if (o is StyledElement s)
        {
            var data = s.DataContext;
-            this.SelectedItems?.Remove(data);
-            var item = this.Items.FirstOrDefault(a => ReferenceEquals(a, data));
+            SelectedItems?.Remove(data);
+            var item = Items.FirstOrDefault(a => ReferenceEquals(a, data));
            if (item is not null)
            {
                var container = ContainerFromItem(item);
-                if (container is MultiComboBoxItem t)
-                {
-                    t.IsSelected = false;
-                }
+                if (container is MultiComboBoxItem t) t.IsSelected = false;
            }
        }
-        
    }

    public void Clear()
    {
-        // this.SelectedItems?.Clear();
+        this.SelectedItems?.Clear();
        var containers = Presenter?.Panel?.Children;
-        if(containers is null) return;
+        if (containers is null) return;
        foreach (var container in containers)
-        {
            if (container is MultiComboBoxItem t)
-            {
                t.IsSelected = false;
-            }
-        }
    }

    protected override void OnUnloaded(RoutedEventArgs e)
    {
        base.OnUnloaded(e);
-        if (SelectedItems is INotifyCollectionChanged c)
-        {
-            c.CollectionChanged-=OnSelectedItemsCollectionChanged;
-        }
+        if (SelectedItems is INotifyCollectionChanged c) c.CollectionChanged -= OnSelectedItemsCollectionChanged;
    }
 }
--- a/src/Ursa/Controls/ComboBox/MultiComboBoxItem.cs
+++ b/src/Ursa/Controls/ComboBox/MultiComboBoxItem.cs
@@ -100,6 +100,11 @@ public class MultiComboBoxItem: ContentControl
    protected override void OnAttachedToVisualTree(VisualTreeAttachmentEventArgs e)
    {
        base.OnAttachedToVisualTree(e);
+        UpdateSelection();
+    }
+    
+    internal void UpdateSelection()
+    {
        _updateInternal = true;
        if (_parent?.ItemsPanelRoot is VirtualizingPanel)
        {