Animation integration issue

[Guidemarcus]

Hi,

I am trying to animate my bottom bar navigation programmatically, but without success. I am trying to create an extension property and animate my control when I set a time (duration). The goal is to have a cleaner xaml file since I want to make my page "animation heavy".

<c:BottomTabBarButton IconStyle="{StaticResource HomePathControlStyle}"
								  Foreground="{ThemeResource OnPrimaryMediumBrush}"
								  animations:YTranslationAnimationExtension.AnimationDuration="0:0:10"
								  Content="Jokes"
								  x:Uid="Menu_Home" />

public static readonly DependencyProperty AnimationDurationProperty =
	DependencyProperty.RegisterAttached("AnimationDuration", typeof(TimeSpan), typeof(YTranslationAnimationExtension), new PropertyMetadata(default, OnAnimationDurationChanged));

public static TimeSpan GetAnimationDuration(FrameworkElement element)
{
	var restult = element.GetValue(AnimationDurationProperty);
	return restult == null ? default : (TimeSpan)restult;
}

public static void SetAnimationDuration(FrameworkElement element, TimeSpan time)
{
	element.SetValue(AnimationDurationProperty, time);
}

private static void OnAnimationDurationChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
	if (d == null) return;

	var element = d as FrameworkElement;
	var animDuration = (TimeSpan)e.NewValue;

	if (animDuration > TimeSpan.Zero)
	{
		Storyboard translateStoryboard;

		var translateAnimation = new DoubleAnimation()
		{
			Duration = new Duration(GetAnimationDuration(element)),
			From = 50,
			To = 0,
			BeginTime = TimeSpan.FromMilliseconds(1000),
			EasingFunction = null
		};

		translateStoryboard = new Storyboard();
		translateStoryboard.Children.Add(translateAnimation);

		// Use Storyboard.TargetName and Storyboard.TargetProperty
		Storyboard.SetTarget(translateAnimation, element);
		Storyboard.SetTargetProperty(translateAnimation, "(UIElement.RenderTransform).(TranslateTransform.Y)";
		
		translateStoryboard.Begin();
	}
}

On windows, it keeps crashing on launch with "xaml parsed failed exception" and my output has this "WinRT information: Cannot resolve TargetProperty (UIElement.RenderTransform).(TranslateTransform.Y)" on specified object."

On mobile, it launches fine, but does nothing.

I tried multiple properties in the SetTargetProperty, but without luck. Any idea what I am missing?

[Guidemarcus]

chat gpt helped out! Thanks anw.

// Create the DoubleAnimation for the Y-axis translation
DoubleAnimation translateYAnimation = new DoubleAnimation
{
				To = 0,
				From = 100,
				Duration = GetAnimationDuration(element),
				FillBehavior = FillBehavior.HoldEnd // Keeps the translated position after animation completes
};

// Create a Storyboard and add the animation to it
Storyboard storyboard = new Storyboard();
storyboard.Children.Add(translateYAnimation);

// Set the target property and target element for the animation
Storyboard.SetTarget(translateYAnimation, element);
Storyboard.SetTargetProperty(translateYAnimation, "(UIElement.RenderTransform).(TranslateTransform.Y)");

// Check if the element already has a RenderTransform, otherwise create one
if (element.RenderTransform == null || element.RenderTransform.GetType() != typeof(TranslateTransform))
{
				element.RenderTransform = new TranslateTransform();
}

// Begin the animation
storyboard.Begin();