Ghost1372

everything can be handy

AnimationExtensions

Methods

Name
AnimateX
AnimateXAsync
AnimateY
AnimateYAsync
AnimateScaleX
AnimateScaleXAsync
AnimateScaleY
AnimateScaleYAsync
AnimateWidth
AnimateWidthAsync
AnimateHeight
AnimateHeightAsync
FadeIn
FadeInAsync
FadeOut
FadeOutAsync
AnimateDoubleProperty
AnimateDoublePropertyAsync

Example

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<StackPanel Spacing="10">
<Button MinWidth="200"
Click="OnFadeIn"
Content="Fade In" />
<Button MinWidth="200"
Click="OnAnimateWidth"
Content="Animate Width" />
<Button MinWidth="200"
Click="OnAnimateHeight"
Content="Animate Height" />
<Button MinWidth="200"
Click="OnGrow"
Content="Grow" />
<Button MinWidth="200"
Click="OnRotate"
Content="Rotate" />
<Button MinWidth="200"
Click="OnTranslate"
Content="Translate" />
<Button MinWidth="200"
Click="OnSkew"
Content="Skew" />
</StackPanel>
<Grid Name="SampleGrid"
Width="200"
Height="200"
Margin="50,50,0,0"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Background="Red">
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
private bool _isBusy = false;

private async void OnFadeIn(object sender, RoutedEventArgs e)
{
_isBusy = true;
await SampleGrid.AnimateDoublePropertyAsync("Opacity", 1.0, 0.0, 500);
await SampleGrid.AnimateDoublePropertyAsync("Opacity", 0.0, 1.0, 500);
_isBusy = false;
}

private async void OnAnimateWidth(object sender, RoutedEventArgs e)
{
_isBusy = true;
await SampleGrid.AnimateDoublePropertyAsync("Width", 200.0, 400.0, 500);
await SampleGrid.AnimateDoublePropertyAsync("Width", 400.0, 200.0, 500);
_isBusy = false;
}

private async void OnAnimateHeight(object sender, RoutedEventArgs e)
{
_isBusy = true;
await SampleGrid.AnimateDoublePropertyAsync("Height", 200.0, 400.0, 500);
await SampleGrid.AnimateDoublePropertyAsync("Height", 400.0, 200.0, 500);
_isBusy = false;
}

private async void OnGrow(object sender, RoutedEventArgs e)
{
_isBusy = true;
SampleGrid.AnimateDoubleProperty("Width", 200.0, 250.0, 300);
SampleGrid.AnimateDoubleProperty("Height", 200.0, 250.0, 300);
await Task.Delay(300);
SampleGrid.AnimateDoubleProperty("Width", 250.0, 150.0, 300);
SampleGrid.AnimateDoubleProperty("Height", 250.0, 150.0, 300);
await Task.Delay(300);
SampleGrid.AnimateDoubleProperty("Width", 150.0, 200.0, 300);
SampleGrid.AnimateDoubleProperty("Height", 150.0, 200.0, 300);
_isBusy = false;
}

private async void OnRotate(object sender, RoutedEventArgs e)
{
_isBusy = true;
RotateTransform rotateTransform = new RotateTransform() { CenterX = 100, CenterY = 100 };
SampleGrid.RenderTransform = rotateTransform;
await rotateTransform.AnimateDoublePropertyAsync("Angle", 0.0, -360.0, 1000);
_isBusy = false;
}

private async void OnTranslate(object sender, RoutedEventArgs e)
{
_isBusy = true;
TranslateTransform translateTransform = new TranslateTransform();
SampleGrid.RenderTransform = translateTransform;
translateTransform.AnimateDoubleProperty("X", 0.0, 100.0, 300);
translateTransform.AnimateDoubleProperty("Y", 0.0, 100.0, 300);
await Task.Delay(500);
translateTransform.AnimateDoubleProperty("X", 100.0, 0.0, 300);
translateTransform.AnimateDoubleProperty("Y", 100.0, 0.0, 300);
_isBusy = false;
}

private async void OnSkew(object sender, RoutedEventArgs e)
{
_isBusy = true;
SkewTransform skewTransform = new SkewTransform() { CenterX = 100, CenterY = 100 };
SampleGrid.RenderTransform = skewTransform;
await skewTransform.AnimateDoublePropertyAsync("AngleX", 0.0, 20.0, 300);
await skewTransform.AnimateDoublePropertyAsync("AngleX", 20.0, -20.0, 600);
await skewTransform.AnimateDoublePropertyAsync("AngleX", -20.0, 0.0, 300);
await skewTransform.AnimateDoublePropertyAsync("AngleY", 0.0, 20.0, 300);
await skewTransform.AnimateDoublePropertyAsync("AngleY", 20.0, -20.0, 600);
await skewTransform.AnimateDoublePropertyAsync("AngleY", -20.0, 0.0, 300);
_isBusy = false;
}

Demo

you can run demo and see this feature.

DevWinUI

0%