Skip to content

Commit fc29357

Browse files
yuto-trdyuto-trd
authored
Merge pull request #973 from b-editor/improve-filter-effect-dialog
FilterEffectを選択するダイアログを改善
2 parents a4fdc11 + c4ae01d commit fc29357

12 files changed

+442
-181
lines changed

‎src/Beutl.Controls/PropertyEditors/DraggablePickerFlyoutPresenter.cs‎

Lines changed: 11 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
using System.Reactive.Disposables;
2-
32
using Avalonia;
43
using Avalonia.Controls;
54
using Avalonia.Controls.Presenters;
@@ -8,9 +7,7 @@
87
using Avalonia.Interactivity;
98
using Avalonia.LogicalTree;
109
using Avalonia.VisualTree;
11-
1210
using Beutl.Reactive;
13-
1411
using FluentAvalonia.Core;
1512

1613
#nullable enable
@@ -120,7 +117,7 @@ private void OnCloseClick(object? sender, RoutedEventArgs e)
120117

121118
private void OnDragAreaPointerExited(object? sender, PointerEventArgs e)
122119
{
123-
_pressed = false;
120+
// _pressed = false;
124121
}
125122

126123
private void OnDragAreaPointerReleased(object? sender, PointerReleasedEventArgs e)
@@ -132,30 +129,32 @@ private void OnDragAreaPointerMoved(object? sender, PointerEventArgs e)
132129
{
133130
if (_dragArea == null || !_pressed) return;
134131

135-
PointerPoint pointer = e.GetCurrentPoint(null);
136-
Point point = pointer.Position;
137-
Point delta = point - _point;
138-
139132
if (this.FindLogicalAncestorOfType<Popup>() is { } popup)
140133
{
134+
PointerPoint pointer = e.GetCurrentPoint(null);
135+
Point point = pointer.Position;
136+
Point delta = point - _point;
137+
141138
popup.HorizontalOffset += delta.X;
142139
popup.VerticalOffset += delta.Y;
140+
if (this.FindAncestorOfType<PopupRoot>() == null)
141+
{
142+
_point = point;
143+
}
143144
}
144145
}
145146

146147
private void OnDragAreaPointerPressed(object? sender, PointerPressedEventArgs e)
147148
{
148149
if (_dragArea == null) return;
149150

151+
var root = this.FindAncestorOfType<PopupRoot>();
150152
PointerPoint pointer = e.GetCurrentPoint(null);
151153
if (pointer.Properties.IsLeftButtonPressed)
152154
{
153155
_pressed = true;
154156
_point = pointer.Position;
155-
if (this.FindAncestorOfType<PopupRoot>() is { } root)
156-
{
157-
root.Activate();
158-
}
157+
root?.Activate();
159158
}
160159
}
161160
}

‎src/Beutl.Controls/PropertyEditors/FilterEffectPickerFlyoutPresenter.cs‎

Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
#nullable enable
2+
3+
using System.Diagnostics;
4+
using System.Reactive.Disposables;
5+
using System.Reactive.Linq;
6+
using Avalonia;
7+
using Avalonia.Controls;
8+
using Avalonia.Controls.Presenters;
9+
using Avalonia.Controls.Primitives;
10+
using Avalonia.Input;
11+
using Avalonia.Interactivity;
12+
using Avalonia.Media;
13+
using Avalonia.Media.Immutable;
14+
using Beutl.Reactive;
15+
using Beutl.Services;
16+
using FluentAvalonia.UI.Media;
17+
using Reactive.Bindings;
18+
19+
namespace Beutl.Controls.PropertyEditors;
20+
21+
public class FilterEffectPickerFlyoutPresenter : DraggablePickerFlyoutPresenter
22+
{
23+
public static readonly StyledProperty<LibraryItem?> SelectedItemProperty =
24+
AvaloniaProperty.Register<FilterEffectPickerFlyoutPresenter, LibraryItem?>(nameof(SelectedItem));
25+
26+
public static readonly StyledProperty<ReactiveCollection<LibraryItem>?> ItemsProperty =
27+
AvaloniaProperty.Register<FilterEffectPickerFlyoutPresenter, ReactiveCollection<LibraryItem>?>(nameof(Items));
28+
29+
public static readonly StyledProperty<bool> IsBusyProperty =
30+
AvaloniaProperty.Register<FilterEffectPickerFlyoutPresenter, bool>(nameof(IsBusy));
31+
32+
public static readonly StyledProperty<bool> ShowAllProperty =
33+
AvaloniaProperty.Register<FilterEffectPickerFlyoutPresenter, bool>(nameof(ShowAll));
34+
35+
public static readonly StyledProperty<bool> ShowSearchBoxProperty =
36+
AvaloniaProperty.Register<FilterEffectPickerFlyoutPresenter, bool>(nameof(ShowSearchBox));
37+
38+
public static readonly StyledProperty<string?> SearchTextProperty =
39+
AvaloniaProperty.Register<FilterEffectPickerFlyoutPresenter, string?>(nameof(SearchText));
40+
41+
private readonly CompositeDisposable _disposables = [];
42+
private const string SearchBoxPseudoClass = ":search-box";
43+
private const string IsBusyPseudoClass = ":busy";
44+
45+
public LibraryItem? SelectedItem
46+
{
47+
get => GetValue(SelectedItemProperty);
48+
set => SetValue(SelectedItemProperty, value);
49+
}
50+
51+
public ReactiveCollection<LibraryItem>? Items
52+
{
53+
get => GetValue(ItemsProperty);
54+
set => SetValue(ItemsProperty, value);
55+
}
56+
57+
public bool IsBusy
58+
{
59+
get => GetValue(IsBusyProperty);
60+
set => SetValue(IsBusyProperty, value);
61+
}
62+
63+
public bool ShowAll
64+
{
65+
get => GetValue(ShowAllProperty);
66+
set => SetValue(ShowAllProperty, value);
67+
}
68+
69+
public bool ShowSearchBox
70+
{
71+
get => GetValue(ShowSearchBoxProperty);
72+
set => SetValue(ShowSearchBoxProperty, value);
73+
}
74+
75+
public string? SearchText
76+
{
77+
get => GetValue(SearchTextProperty);
78+
set => SetValue(SearchTextProperty, value);
79+
}
80+
81+
protected override void OnApplyTemplate(TemplateAppliedEventArgs e)
82+
{
83+
_disposables.Clear();
84+
base.OnApplyTemplate(e);
85+
}
86+
87+
protected override void OnPropertyChanged(AvaloniaPropertyChangedEventArgs change)
88+
{
89+
base.OnPropertyChanged(change);
90+
if (change.Property == ShowSearchBoxProperty)
91+
{
92+
PseudoClasses.Set(SearchBoxPseudoClass, ShowSearchBox);
93+
}
94+
else if (change.Property == IsBusyProperty)
95+
{
96+
PseudoClasses.Set(IsBusyPseudoClass, IsBusy);
97+
}
98+
}
99+
}

‎src/Beutl.Controls/Styles.axaml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,7 @@
4949
<ResourceInclude Source="/Styling/PropertyEditors/SimpleColorPickerFlyoutPresenter.axaml" />
5050
<ResourceInclude Source="/Styling/PropertyEditors/BrushEditorFlyoutPresenter.axaml" />
5151
<ResourceInclude Source="/Styling/PropertyEditors/GradientStopsSlider.axaml" />
52+
<ResourceInclude Source="/Styling/PropertyEditors/FilterEffectPickerFlyoutPresenter.axaml" />
5253
</ResourceDictionary.MergedDictionaries>
5354
<ResourceDictionary.ThemeDictionaries>
5455
<ResourceDictionary x:Key="Default">

‎src/Beutl.Controls/Styling/PropertyEditors/FilterEffectPickerFlyoutPresenter.axaml‎

Lines changed: 155 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,155 @@
1+
<ResourceDictionary xmlns="https://github.com/avaloniaui"
2+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
3+
xmlns:behaviors="using:Beutl.Controls.Behaviors"
4+
xmlns:lang="using:Beutl.Language"
5+
xmlns:service="using:Beutl.Services"
6+
xmlns:local="using:Beutl.Controls.PropertyEditors"
7+
xmlns:ui="clr-namespace:FluentAvalonia.UI.Controls;assembly=FluentAvalonia"
8+
x:CompileBindings="True">
9+
<Design.PreviewWith>
10+
<Border Height="600" Padding="50">
11+
<local:FilterEffectPickerFlyoutPresenter VerticalAlignment="Center">
12+
<local:SimpleColorPicker />
13+
</local:FilterEffectPickerFlyoutPresenter>
14+
</Border>
15+
</Design.PreviewWith>
16+
17+
<ControlTheme x:Key="{x:Type local:FilterEffectPickerFlyoutPresenter}"
18+
TargetType="local:FilterEffectPickerFlyoutPresenter">
19+
<Setter Property="Width" Value="240" />
20+
<Setter Property="ShowHideButtons" Value="True" />
21+
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
22+
<Setter Property="VerticalContentAlignment" Value="Stretch" />
23+
<Setter Property="Background" Value="{DynamicResource FlyoutPresenterBackground}" />
24+
<Setter Property="BorderBrush" Value="{DynamicResource FlyoutBorderThemeBrush}" />
25+
<Setter Property="BorderThickness" Value="{StaticResource FlyoutBorderThemeThickness}" />
26+
<Setter Property="Padding" Value="0" />
27+
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
28+
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
29+
<Setter Property="CornerRadius" Value="{DynamicResource OverlayCornerRadius}" />
30+
<Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
31+
<Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
32+
<Setter Property="Template">
33+
<ControlTemplate>
34+
<ui:FABorder Padding="{DynamicResource FlyoutBorderThemePadding}"
35+
Background="{TemplateBinding Background}"
36+
BorderBrush="{TemplateBinding BorderBrush}"
37+
BorderThickness="{TemplateBinding BorderThickness}"
38+
CornerRadius="{TemplateBinding CornerRadius}">
39+
<Grid RowDefinitions="Auto,Auto,Auto">
40+
<Grid Name="DragArea"
41+
Height="40"
42+
VerticalAlignment="Top"
43+
Background="Transparent"
44+
ColumnDefinitions="*,Auto">
45+
<WrapPanel Name="TabLayout" Margin="4,4,0,4">
46+
<ToggleButton IsChecked="{TemplateBinding ShowSearchBox, Mode=TwoWay}"
47+
Name="ShowSearchBoxButton">
48+
<ui:SymbolIcon Symbol="Find" />
49+
</ToggleButton>
50+
<ToggleButton Name="ShowAllButton" IsChecked="{TemplateBinding ShowAll, Mode=TwoWay}">
51+
<ui:SymbolIcon Symbol="More" />
52+
</ToggleButton>
53+
</WrapPanel>
54+
55+
<Button Name="CloseButton"
56+
Grid.Column="1"
57+
Width="32"
58+
Height="32"
59+
Margin="4"
60+
Padding="0"
61+
HorizontalAlignment="Right"
62+
HorizontalContentAlignment="Center"
63+
VerticalContentAlignment="Center"
64+
Theme="{StaticResource TransparentButton}">
65+
<ui:FontIcon FontFamily="{DynamicResource SymbolThemeFontFamily}" Glyph="&#xE711;" />
66+
</Button>
67+
</Grid>
68+
69+
<Border Grid.Row="2"
70+
BorderBrush="{DynamicResource PickerFlyoutPresenterDivider}"
71+
BorderThickness="0,1,0,0">
72+
73+
<Panel Name="AcceptDismissContainer"
74+
Height="{DynamicResource PickerAcceptDismissRegionHeight}"
75+
IsVisible="False">
76+
<Grid ColumnDefinitions="*,*">
77+
<Button Name="AcceptButton"
78+
Margin="4,4,2,4"
79+
HorizontalAlignment="Stretch"
80+
VerticalAlignment="Stretch"
81+
Theme="{StaticResource FlyoutAcceptDismiss}">
82+
<ui:SymbolIcon FontSize="18" Symbol="Checkmark" />
83+
</Button>
84+
<Button Name="DismissButton"
85+
Grid.Column="1"
86+
Margin="2,4,4,4"
87+
HorizontalAlignment="Stretch"
88+
VerticalAlignment="Stretch"
89+
Theme="{StaticResource FlyoutAcceptDismiss}">
90+
<ui:SymbolIcon FontSize="16" Symbol="Dismiss" />
91+
</Button>
92+
</Grid>
93+
94+
</Panel>
95+
</Border>
96+
97+
<StackPanel Grid.Row="1">
98+
<TextBox x:Name="SearchTextBox"
99+
Classes="clearButton"
100+
Text="{TemplateBinding SearchText, Mode=TwoWay}"
101+
Margin="6,0,6,6"
102+
IsVisible="False"
103+
Watermark="{x:Static lang:Strings.Search}" />
104+
105+
<ListBox x:Name="PART_ListBox" SelectedItem="{TemplateBinding SelectedItem, Mode=TwoWay}"
106+
ItemsSource="{TemplateBinding Items}" Height="250">
107+
<ListBox.ItemTemplate>
108+
<DataTemplate x:DataType="service:LibraryItem">
109+
<TextBlock VerticalAlignment="Center" Text="{Binding DisplayName}" />
110+
</DataTemplate>
111+
</ListBox.ItemTemplate>
112+
</ListBox>
113+
</StackPanel>
114+
115+
<ProgressRing Name="PART_ProgressRing"
116+
IsVisible="False"
117+
IsIndeterminate="False"
118+
Grid.RowSpan="3"
119+
VerticalAlignment="Center"
120+
HorizontalAlignment="Center" />
121+
</Grid>
122+
</ui:FABorder>
123+
</ControlTemplate>
124+
</Setter>
125+
126+
<Style Selector="^:acceptdismiss /template/ Panel#AcceptDismissContainer">
127+
<Setter Property="IsVisible" Value="True" />
128+
</Style>
129+
<Style Selector="^:acceptdismiss /template/ Button#CloseButton">
130+
<Setter Property="IsVisible" Value="False" />
131+
</Style>
132+
133+
<Style Selector="^:search-box /template/ TextBox#SearchTextBox">
134+
<Setter Property="IsVisible" Value="True" />
135+
</Style>
136+
137+
<Style Selector="^:busy /template/ ProgressRing#PART_ProgressRing">
138+
<Setter Property="IsVisible" Value="True" />
139+
<Setter Property="IsIndeterminate" Value="True" />
140+
</Style>
141+
142+
<Style Selector="^ /template/ WrapPanel#TabLayout">
143+
<Style Selector="^ > ToggleButton">
144+
<Setter Property="Width" Value="32" />
145+
<Setter Property="Height" Value="32" />
146+
<Setter Property="Margin" Value="0,0,4,0" />
147+
<Setter Property="Theme" Value="{StaticResource ColorPickerTypeTransparentToggleButtonStyle}" />
148+
149+
<Style Selector="^ > ui|FontIcon">
150+
<Setter Property="FontFamily" Value="{DynamicResource SymbolThemeFontFamily}" />
151+
</Style>
152+
</Style>
153+
</Style>
154+
</ControlTheme>
155+
</ResourceDictionary>

‎src/Beutl/ViewModels/Dialogs/SelectFilterEffectTypeViewModel.cs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ namespace Beutl.ViewModels.Dialogs;
66
public sealed class SelectFilterEffectTypeViewModel : SelectLibraryItemDialogViewModel
77
{
88
public SelectFilterEffectTypeViewModel()
9-
: base(KnownLibraryItemFormats.FilterEffect, typeof(FilterEffect), Strings.SelectFilterEffect)
9+
: base(KnownLibraryItemFormats.FilterEffect, typeof(FilterEffect))
1010
{
1111
}
1212
}

0 commit comments

Comments
 (0)