-
Notifications
You must be signed in to change notification settings - Fork 0
/
MySwitch.ux
40 lines (35 loc) · 1.63 KB
/
MySwitch.ux
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
<ToggleControl ux:Class="MySwitch" Focus.IsFocusable="true">
<Panel Width="50" Height="32"
SnapToPixels="false">
<Tapped>
<Toggle Target="this" />
</Tapped>
<SwipeGesture Direction="Right" Length="20" Type="Active" ux:Name="swipe"
IsActive="{Property this.Value}"/>
<SwipingAnimation Source="swipe">
<Move Target="thumb" X="20"/>
<Change trackFill.Color="SluttaBlue" Easing="QuadraticInOut"/>
<Change switch_thumb_stroke.Color="#666" Easing="QuadraticInOut"/>
<Change strokeColor.Color="#666" Easing="QuadraticInOut"/>
</SwipingAnimation>
<Circle Alignment="CenterLeft" Width="27" Height="27" Margin="2,0,14,0" ux:Name="thumb">
<SolidColor ux:Name="thumbFill" Color="#fff" />
<Stroke ux:Name="switch_thumb_stroke" Width="1" Color="#aaa" />
<DropShadow ux:Name="switch_thumb_shadow" Angle="90" Distance="0" Size="1" Spread="0.1" />
</Circle>
<Rectangle CornerRadius="27" Width="51" Height="31" Alignment="Center">
<SolidColor ux:Name="trackFill" Color="#E4E4E4" />
<Stroke>
<SolidColor ux:Name="strokeColor" Color="#aaa" />
</Stroke>
</Rectangle>
<WhileDisabled>
<Change thumbFill.Color="#F6F6F6" Easing="QuadraticInOut" Duration="0.25" />
<Change trackFill.Color="#EAEAEA" Easing="QuadraticInOut" Duration="0.25" />
<Change switch_thumb_stroke.Color="#F6F6F6" Easing="QuadraticOut" Duration="0.25" />
<Change strokeColor.Color="#EAEAEA" Easing="QuadraticOut" Duration="0.25" />
<Change switch_thumb_shadow.Size="0" Easing="QuadraticOut" Duration="0.25" />
<Change switch_thumb_shadow.Distance="0" Easing="QuadraticOut" Duration="0.25" />
</WhileDisabled>
</Panel>
</ToggleControl>