Skip to content

Commit a191f76

Browse files
diqezitdiqezit
committed
UI animation fixes
1 parent 67e6e55 commit a191f76

File tree

3 files changed

+144
-147
lines changed

3 files changed

+144
-147
lines changed

‎SpectrumNet/MainWindow.xaml‎

Lines changed: 111 additions & 113 deletions
Original file line numberDiff line numberDiff line change
@@ -1,110 +1,67 @@
11
<Window x:Class="SpectrumNet.MainWindow"
2-
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3-
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4-
xmlns:sk="clr-namespace:SkiaSharp.Views.WPF;assembly=SkiaSharp.Views.WPF"
5-
xmlns:local="clr-namespace:SpectrumNet"
6-
xmlns:shell="clr-namespace:System.Windows.Shell;assembly=PresentationFramework"
7-
Title="Spectrum Analyser"
8-
Height="700"
9-
Width="1100"
10-
WindowStartupLocation="CenterScreen"
11-
Background="{DynamicResource WindowBackgroundBrush}"
12-
WindowStyle="None"
13-
ResizeMode="CanResize"
14-
StateChanged="OnStateChanged"
15-
MouseDoubleClick="OnWindowMouseDoubleClick">
2+
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3+
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4+
xmlns:sk="clr-namespace:SkiaSharp.Views.WPF;assembly=SkiaSharp.Views.WPF"
5+
xmlns:local="clr-namespace:SpectrumNet"
6+
xmlns:shell="clr-namespace:System.Windows.Shell;assembly=PresentationFramework"
7+
Title="Spectrum Analyser"
8+
Height="600"
9+
Width="800"
10+
MinHeight="600"
11+
MinWidth="800"
12+
WindowStartupLocation="CenterScreen"
13+
Background="Transparent"
14+
AllowsTransparency="True"
15+
WindowStyle="None"
16+
ResizeMode="CanResize"
17+
StateChanged="OnStateChanged"
18+
MouseDoubleClick="OnWindowMouseDoubleClick">
1619

1720
<Window.Resources>
1821
<Duration x:Key="StandardAnimationDuration">0:0:0.3</Duration>
1922
<CubicEase x:Key="StandardEaseOut" EasingMode="EaseOut"/>
2023
<CubicEase x:Key="StandardEaseIn" EasingMode="EaseIn"/>
2124

22-
<Storyboard x:Key="ShowControlPanelStoryboard">
23-
<DoubleAnimation
24-
Storyboard.TargetName="spectrumCanvas"
25-
Storyboard.TargetProperty="Opacity"
26-
From="1" To="0.95"
27-
Duration="{StaticResource StandardAnimationDuration}"
28-
FillBehavior="Stop">
29-
<DoubleAnimation.EasingFunction>
30-
<CubicEase EasingMode="EaseOut"/>
31-
</DoubleAnimation.EasingFunction>
32-
</DoubleAnimation>
33-
<DoubleAnimation
34-
Storyboard.TargetName="SpectrumScaleTransform"
35-
Storyboard.TargetProperty="ScaleY"
36-
From="1" To="0.95"
37-
Duration="{StaticResource StandardAnimationDuration}"
38-
FillBehavior="Stop">
39-
<DoubleAnimation.EasingFunction>
40-
<CubicEase EasingMode="EaseOut"/>
41-
</DoubleAnimation.EasingFunction>
42-
</DoubleAnimation>
43-
</Storyboard>
44-
45-
<Storyboard x:Key="HideControlPanelStoryboard">
46-
<DoubleAnimation
47-
Storyboard.TargetName="spectrumCanvas"
48-
Storyboard.TargetProperty="Opacity"
49-
From="0.95" To="1"
50-
Duration="{StaticResource StandardAnimationDuration}"
51-
FillBehavior="Stop">
52-
<DoubleAnimation.EasingFunction>
53-
<CubicEase EasingMode="EaseIn"/>
54-
</DoubleAnimation.EasingFunction>
55-
</DoubleAnimation>
56-
<DoubleAnimation
57-
Storyboard.TargetName="SpectrumScaleTransform"
58-
Storyboard.TargetProperty="ScaleY"
59-
From="0.95" To="1"
60-
Duration="{StaticResource StandardAnimationDuration}"
61-
FillBehavior="Stop">
62-
<DoubleAnimation.EasingFunction>
63-
<CubicEase EasingMode="EaseIn"/>
64-
</DoubleAnimation.EasingFunction>
65-
</DoubleAnimation>
66-
</Storyboard>
67-
6825
<Storyboard x:Key="ShowPanelAnimation">
69-
<DoubleAnimation
70-
Storyboard.TargetName="ControlPanel"
71-
Storyboard.TargetProperty="Opacity"
72-
From="0" To="1"
73-
Duration="{StaticResource StandardAnimationDuration}"
74-
FillBehavior="Stop">
26+
<DoubleAnimation
27+
Storyboard.TargetName="ControlPanel"
28+
Storyboard.TargetProperty="Opacity"
29+
From="0" To="1"
30+
Duration="{StaticResource StandardAnimationDuration}"
31+
FillBehavior="HoldEnd">
7532
<DoubleAnimation.EasingFunction>
7633
<CubicEase EasingMode="EaseOut"/>
7734
</DoubleAnimation.EasingFunction>
7835
</DoubleAnimation>
79-
<DoubleAnimation
80-
Storyboard.TargetName="ControlPanelTransform"
81-
Storyboard.TargetProperty="Y"
82-
From="20" To="0"
83-
Duration="{StaticResource StandardAnimationDuration}"
84-
FillBehavior="Stop">
36+
<DoubleAnimation
37+
Storyboard.TargetName="ControlPanelTransform"
38+
Storyboard.TargetProperty="Y"
39+
From="20" To="0"
40+
Duration="{StaticResource StandardAnimationDuration}"
41+
FillBehavior="HoldEnd">
8542
<DoubleAnimation.EasingFunction>
8643
<CubicEase EasingMode="EaseOut"/>
8744
</DoubleAnimation.EasingFunction>
8845
</DoubleAnimation>
8946
</Storyboard>
9047

9148
<Storyboard x:Key="HidePanelAnimation">
92-
<DoubleAnimation
93-
Storyboard.TargetName="ControlPanel"
94-
Storyboard.TargetProperty="Opacity"
95-
From="1" To="0"
96-
Duration="{StaticResource StandardAnimationDuration}"
97-
FillBehavior="Stop">
49+
<DoubleAnimation
50+
Storyboard.TargetName="ControlPanel"
51+
Storyboard.TargetProperty="Opacity"
52+
From="1" To="0"
53+
Duration="{StaticResource StandardAnimationDuration}"
54+
FillBehavior="HoldEnd">
9855
<DoubleAnimation.EasingFunction>
9956
<CubicEase EasingMode="EaseIn"/>
10057
</DoubleAnimation.EasingFunction>
10158
</DoubleAnimation>
102-
<DoubleAnimation
103-
Storyboard.TargetName="ControlPanelTransform"
104-
Storyboard.TargetProperty="Y"
105-
From="0" To="20"
106-
Duration="{StaticResource StandardAnimationDuration}"
107-
FillBehavior="Stop">
59+
<DoubleAnimation
60+
Storyboard.TargetName="ControlPanelTransform"
61+
Storyboard.TargetProperty="Y"
62+
From="0" To="20"
63+
Duration="{StaticResource StandardAnimationDuration}"
64+
FillBehavior="HoldEnd">
10865
<DoubleAnimation.EasingFunction>
10966
<CubicEase EasingMode="EaseIn"/>
11067
</DoubleAnimation.EasingFunction>
@@ -115,14 +72,16 @@
11572

11673
<shell:WindowChrome.WindowChrome>
11774
<shell:WindowChrome CaptionHeight="0"
118-
CornerRadius="12"
75+
CornerRadius="0"
11976
GlassFrameThickness="0"
12077
ResizeBorderThickness="6"/>
12178
</shell:WindowChrome.WindowChrome>
12279

12380
<Border BorderThickness="1"
12481
BorderBrush="{DynamicResource WindowBorderBrush}"
125-
CornerRadius="12">
82+
CornerRadius="12"
83+
Background="{DynamicResource WindowBackgroundBrush}">
84+
12685
<Grid>
12786
<Grid.RowDefinitions>
12887
<RowDefinition Height="Auto"/>
@@ -214,14 +173,14 @@
214173
</Grid.RowDefinitions>
215174

216175
<ToggleButton x:Name="ToggleControlPanelButton"
217-
Grid.Row="0"
218-
Click="ToggleControlPanelButton_Click"
219-
Content="Control Panel"
220-
HorizontalAlignment="Stretch"
221-
Height="30"
222-
Style="{DynamicResource ControlPanelToggleButtonStyle}"
223-
BorderThickness="0"
224-
Margin="0,0,0,10">
176+
Grid.Row="0"
177+
Click="ToggleControlPanelButton_Click"
178+
Content="Control Panel"
179+
HorizontalAlignment="Stretch"
180+
Height="30"
181+
Style="{DynamicResource ControlPanelToggleButtonStyle}"
182+
BorderThickness="0"
183+
Margin="0,0,0,10">
225184
<ToggleButton.RenderTransform>
226185
<TransformGroup>
227186
<ScaleTransform x:Name="ToggleButtonScale" ScaleX="1" ScaleY="1"/>
@@ -233,17 +192,29 @@
233192
<BeginStoryboard>
234193
<Storyboard>
235194
<DoubleAnimation Storyboard.TargetProperty="RenderTransform.(TransformGroup.Children)[0].ScaleX"
236-
To="1.05"
237-
Duration="0:0:0.1"
238-
AutoReverse="True"/>
195+
To="1.02"
196+
Duration="0:0:0.08"
197+
AutoReverse="True">
198+
<DoubleAnimation.EasingFunction>
199+
<CubicEase EasingMode="EaseOut"/>
200+
</DoubleAnimation.EasingFunction>
201+
</DoubleAnimation>
239202
<DoubleAnimation Storyboard.TargetProperty="RenderTransform.(TransformGroup.Children)[0].ScaleY"
240-
To="1.05"
241-
Duration="0:0:0.1"
242-
AutoReverse="True"/>
203+
To="1.02"
204+
Duration="0:0:0.08"
205+
AutoReverse="True">
206+
<DoubleAnimation.EasingFunction>
207+
<CubicEase EasingMode="EaseOut"/>
208+
</DoubleAnimation.EasingFunction>
209+
</DoubleAnimation>
243210
<DoubleAnimation Storyboard.TargetProperty="RenderTransform.(TransformGroup.Children)[1].X"
244-
To="-5"
245-
Duration="0:0:0.1"
246-
AutoReverse="True"/>
211+
To="-2"
212+
Duration="0:0:0.08"
213+
AutoReverse="True">
214+
<DoubleAnimation.EasingFunction>
215+
<CubicEase EasingMode="EaseOut"/>
216+
</DoubleAnimation.EasingFunction>
217+
</DoubleAnimation>
247218
</Storyboard>
248219
</BeginStoryboard>
249220
</EventTrigger>
@@ -272,7 +243,7 @@
272243
<Button x:Name="StartCaptureButton"
273244
Click="OnButtonClick"
274245
IsEnabled="{Binding CanStartCapture}"
275-
Width="180"
246+
Width="130"
276247
Height="40"
277248
Margin="0,0,10,0"
278249
Style="{DynamicResource ModernButtonStyle}">
@@ -286,7 +257,7 @@
286257
<Button x:Name="StopCaptureButton"
287258
Click="OnButtonClick"
288259
IsEnabled="{Binding IsRecording}"
289-
Width="180"
260+
Width="130"
290261
Height="40"
291262
Margin="0,0,10,0"
292263
Style="{DynamicResource ModernButtonStyle}">
@@ -299,7 +270,7 @@
299270
</Button>
300271
<Button x:Name="OverlayButton"
301272
Click="OnButtonClick"
302-
Width="180"
273+
Width="130"
303274
Height="40"
304275
Margin="0,0,10,0"
305276
Style="{DynamicResource ModernButtonStyle}">
@@ -312,7 +283,7 @@
312283
</Button>
313284
<Button x:Name="OpenSettingsButton"
314285
Click="OnButtonClick"
315-
Width="180"
286+
Width="130"
316287
Height="40"
317288
Margin="0,0,10,0"
318289
Style="{DynamicResource ModernButtonStyle}">
@@ -325,7 +296,7 @@
325296
</Button>
326297
<Button x:Name="OpenPopupButton"
327298
Click="OnButtonClick"
328-
Width="180"
299+
Width="130"
329300
Height="40"
330301
Style="{DynamicResource ModernButtonStyle}">
331302
<StackPanel Orientation="Horizontal">
@@ -468,13 +439,40 @@
468439
Padding="24"
469440
Width="400"
470441
BorderBrush="{DynamicResource DarkPopupBorderBrush}"
471-
BorderThickness="1">
442+
BorderThickness="1"
443+
RenderTransformOrigin="0.5,0.5">
444+
<Border.RenderTransform>
445+
<ScaleTransform ScaleX="0.7" ScaleY="0.7"/>
446+
</Border.RenderTransform>
447+
<Border.Triggers>
448+
<EventTrigger RoutedEvent="Loaded">
449+
<BeginStoryboard>
450+
<Storyboard>
451+
<DoubleAnimation
452+
Storyboard.TargetProperty="Opacity"
453+
From="0" To="1"
454+
Duration="{StaticResource StandardAnimationDuration}"
455+
EasingFunction="{StaticResource StandardEaseOut}" />
456+
<DoubleAnimation
457+
Storyboard.TargetProperty="RenderTransform.(ScaleTransform.ScaleX)"
458+
From="0.7" To="1"
459+
Duration="{StaticResource StandardAnimationDuration}"
460+
EasingFunction="{StaticResource StandardEaseOut}" />
461+
<DoubleAnimation
462+
Storyboard.TargetProperty="RenderTransform.(ScaleTransform.ScaleY)"
463+
From="0.7" To="1"
464+
Duration="{StaticResource StandardAnimationDuration}"
465+
EasingFunction="{StaticResource StandardEaseOut}" />
466+
</Storyboard>
467+
</BeginStoryboard>
468+
</EventTrigger>
469+
</Border.Triggers>
472470
<StackPanel>
473471
<TextBlock Text="Gain Settings"
474-
FontSize="20"
475-
FontWeight="Bold"
476-
Foreground="{DynamicResource LightTextPrimaryBrush}"
477-
Margin="0,0,0,20"/>
472+
FontSize="20"
473+
FontWeight="Bold"
474+
Foreground="{DynamicResource LightTextPrimaryBrush}"
475+
Margin="0,0,0,20"/>
478476
<Grid Margin="0,0,0,16">
479477
<Grid.ColumnDefinitions>
480478
<ColumnDefinition Width="120"/>

‎SpectrumNet/MainWindow.xaml.cs‎

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -299,18 +299,12 @@ private void ToggleControlPanelButton_Click(object sender, RoutedEventArgs e)
299299
var hidePanelSB = (Storyboard)FindResource("HidePanelAnimation");
300300
hidePanelSB.Completed += (s, ev) => ControlPanel.Visibility = Visibility.Collapsed;
301301
hidePanelSB.Begin();
302-
303-
var hideCPStoryboard = (Storyboard)FindResource("HideControlPanelStoryboard");
304-
hideCPStoryboard.Begin();
305302
}
306303
else
307304
{
308305
ControlPanel.Visibility = Visibility.Visible;
309306
var showPanelSB = (Storyboard)FindResource("ShowPanelAnimation");
310307
showPanelSB.Begin();
311-
312-
var showCPStoryboard = (Storyboard)FindResource("ShowControlPanelStoryboard");
313-
showCPStoryboard.Begin();
314308
}
315309
}
316310

0 commit comments

Comments
 (0)