chore: Fixing animation for wasm

unoplatform · Aug 7, 2024 · 4394c77 · 4394c77
1 parent 3639ddb
commit 4394c77
Showing 1 changed file with 13 additions and 26 deletions.
diff --git a/src/library/Uno.Material/Styles/Controls/v2/TextBox.xaml b/src/library/Uno.Material/Styles/Controls/v2/TextBox.xaml
@@ -18,7 +18,7 @@
 
 		- With placeholder but no header: The placeholder will be displayed where the text is supposed to be until text is inputed
 
-		- With header but no placeholder: The header will be displayed where the text is supposed to be and will move up when focused
+		- With header but no placeholder: The header will be displayed where the text is supposed to be and will move up when text is inputed
 
 		- Whith header and placeholder: The header will be displayed at the top and the placeholder will be displayed where the text is supposed to be until text is inputed
 	-->
@@ -358,7 +358,6 @@
 							<VisualStateGroup x:Name="CommonStates">
 								<VisualState x:Name="Normal" />
 
-
 								<VisualState x:Name="PointerOver">
 									<VisualState.Setters>
 										<Setter Target="NormalBorder.Fill" Value="{ThemeResource FilledTextBoxBorderBrushPointerOver}" />
@@ -425,7 +424,7 @@
 								<VisualState x:Name="HeaderNotEmpty">
 									<VisualState.Setters>
 										<Setter Target="HeaderElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
-										<Setter Target="ContentElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource FocusedPlaceholderContentCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
+										<Setter Target="ContentElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource PlaceholderContentCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
 										<Setter Target="PlaceholderElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource FocusedPlaceholderContentCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
 										<Setter Target="HeaderElement_CompositeTransform.ScaleX" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformScales}, TargetNullValue=1, FallbackValue=1}" />
 										<Setter Target="HeaderElement_CompositeTransform.ScaleY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformScales}, TargetNullValue=1, FallbackValue=1}" />
@@ -482,31 +481,25 @@
 									<VisualState.Setters>
 										<Setter Target="ContentElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource FocusedPlaceholderContentCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
 										<Setter Target="PlaceholderElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource FocusedPlaceholderContentCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
-
-										<!-- Setters instead of animations on WASM work -->
-										<Setter Target="HeaderElement_CompositeTransform.ScaleX" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformScales}, TargetNullValue=1, FallbackValue=1}" />
-										<Setter Target="HeaderElement_CompositeTransform.ScaleY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformScales}, TargetNullValue=1, FallbackValue=1}" />
-										<Setter Target="HeaderElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
 									</VisualState.Setters>
 
-									<!-- Animations not working properly on WASM -->
-									<!--<Storyboard>
+									<Storyboard>
 										<DoubleAnimation Storyboard.TargetName="HeaderElement_CompositeTransform"
 														 Storyboard.TargetProperty="TranslateY"
 														 Duration="{StaticResource MaterialTextBoxAnimationDuration}"
 														 EasingFunction="{StaticResource MaterialEaseInOutFunction}"
-														 To="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
+														 To="-11" />
 										<DoubleAnimation Storyboard.TargetName="HeaderElement_CompositeTransform"
 														 Storyboard.TargetProperty="ScaleX"
 														 Duration="{StaticResource MaterialTextBoxAnimationDuration}"
 														 EasingFunction="{StaticResource MaterialEaseInOutFunction}"
-														 To="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformScales}, TargetNullValue=1, FallbackValue=1}" />
+														 To="0.7" />
 										<DoubleAnimation Storyboard.TargetName="HeaderElement_CompositeTransform"
 														 Storyboard.TargetProperty="ScaleY"
 														 Duration="{StaticResource MaterialTextBoxAnimationDuration}"
 														 EasingFunction="{StaticResource MaterialEaseInOutFunction}"
-														 To="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformScales}, TargetNullValue=1, FallbackValue=1}" />
-									</Storyboard>-->
+														 To="0.7" />
+									</Storyboard>
 									<VisualState.StateTriggers>
 										<StateTrigger IsActive="{Binding Text, Converter={StaticResource EmptyToFalseConverter}, RelativeSource={RelativeSource TemplatedParent}}" />
 									</VisualState.StateTriggers>
@@ -736,7 +729,7 @@
 								<VisualState x:Name="HeaderNotEmpty">
 									<VisualState.Setters>
 										<Setter Target="HeaderElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
-										<Setter Target="ContentElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource FocusedPlaceholderContentCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
+										<Setter Target="ContentElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource PlaceholderContentCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
 										<Setter Target="PlaceholderElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource FocusedPlaceholderContentCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
 										<Setter Target="HeaderElement_CompositeTransform.ScaleX" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformScales}, TargetNullValue=1, FallbackValue=1}" />
 										<Setter Target="HeaderElement_CompositeTransform.ScaleY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformScales}, TargetNullValue=1, FallbackValue=1}" />
@@ -793,31 +786,25 @@
 									<VisualState.Setters>
 										<Setter Target="ContentElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource FocusedPlaceholderContentCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
 										<Setter Target="PlaceholderElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource FocusedPlaceholderContentCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
-
-										<!-- Setters instead of animations on WASM work -->
-										<Setter Target="HeaderElement_CompositeTransform.ScaleX" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformScales}, TargetNullValue=1, FallbackValue=1}" />
-										<Setter Target="HeaderElement_CompositeTransform.ScaleY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformScales}, TargetNullValue=1, FallbackValue=1}" />
-										<Setter Target="HeaderElement_CompositeTransform.TranslateY" Value="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
 									</VisualState.Setters>
 
-									<!-- Animations not working properly on WASM -->
-									<!-- <Storyboard>
+									<Storyboard>
 										<DoubleAnimation Storyboard.TargetName="HeaderElement_CompositeTransform"
 														 Storyboard.TargetProperty="TranslateY"
 														 Duration="{StaticResource MaterialTextBoxAnimationDuration}"
 														 EasingFunction="{StaticResource MaterialEaseInOutFunction}"
-														 To="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformTranslateY}, TargetNullValue=0, FallbackValue=0}" />
+														 To="-11" />
 										<DoubleAnimation Storyboard.TargetName="HeaderElement_CompositeTransform"
 														 Storyboard.TargetProperty="ScaleX"
 														 Duration="{StaticResource MaterialTextBoxAnimationDuration}"
 														 EasingFunction="{StaticResource MaterialEaseInOutFunction}"
-														 To="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformScales}, TargetNullValue=1, FallbackValue=1}" />
+														 To="0.7" />
 										<DoubleAnimation Storyboard.TargetName="HeaderElement_CompositeTransform"
 														 Storyboard.TargetProperty="ScaleY"
 														 Duration="{StaticResource MaterialTextBoxAnimationDuration}"
 														 EasingFunction="{StaticResource MaterialEaseInOutFunction}"
-														 To="{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource HeaderCompositeTransformScales}, TargetNullValue=1, FallbackValue=1}" />
-									</Storyboard> -->
+														 To="0.7" />
+									</Storyboard>
 									<VisualState.StateTriggers>
 										<StateTrigger IsActive="{Binding Text, Converter={StaticResource EmptyToFalseConverter}, RelativeSource={RelativeSource TemplatedParent}}" />
 									</VisualState.StateTriggers>