silverlight storyboard animation with rotatetransform code behind - silverlight

i am trying to rotate an object from code behind. Code below:
Storyboard storyBoard = new Storyboard();
//Transform
RotateTransform rotate = new RotateTransform();
rotate.Angle = 45;
rotate.CenterX = 50;
rotate.CenterY = 20;
RodBorder.RenderTransform = rotate;
DoubleAnimation Anim = new DoubleAnimation();
Anim.Duration = new Duration(TimeSpan.FromMilliseconds(3000));
Anim.SetValue(Storyboard.TargetPropertyProperty, rotate);
Storyboard.SetTargetProperty(Anim, new PropertyPath("RenderTransform.Angle"));
Storyboard.SetTarget(Anim, RodBorder);
storyBoard.Children.Add(Anim);
storyBoard.Begin();
RodBorder is a Border which i want to rotate. The problem here is probably the PropertyPath, because i got an exception there.(System.Windows.PropertyPath cannot be set to type System.Windows.Media.RotateTransform) Any ideas are welcome, thank you for your help.

Try Storyboard.TargetProperty="(UIElement.RenderTransform).(RotateTransform.Rotation)".
You can always verify syntax by building sample animation in Blend.

Related

How to stop DoubleAnimation on mouseover event?

I have two canvases and a textblock with name tbmarquee, on window load it animates from top to bottom, but i want to stop when i over the mose on it, and when i click it goes to the link, how to do it ?
void Window1_Loaded(object sender, RoutedEventArgs e)
{
DoubleAnimation doubleAnimation = new DoubleAnimation();
doubleAnimation.From = -tbmarquee.ActualHeight;
doubleAnimation.To = canMain.ActualHeight;
doubleAnimation.RepeatBehavior = RepeatBehavior.Forever;
doubleAnimation.Duration = new Duration(TimeSpan.Parse("0:0:10"));
tbmarquee.BeginAnimation(Canvas.TopProperty, doubleAnimation);
}
On mouse over event handler of tbmarquee, call BeginAnimation() again with second argument set to null to stop the animation :
tbmarquee.BeginAnimation(Canvas.TopProperty, null);
Related question : How to stop an animation in C# / WPF?

Silverlight opacity animation not working programmatically

I'm new at Silverlight and trying samples for things animating the opacity of an object programatically.
I've come up with the following code:
MapShape myTestShape= RadMapInformationLayer.Items[0] as MapShape;
SolidColorBrush brush = new SolidColorBrush();
brush.Color = Colors.Purple;
myTestShape.Fill = brush;
//create a duration object
Duration duration = new Duration(TimeSpan.FromSeconds(5));
//create the storyboard
Storyboard story = new Storyboard();
//create double animation
DoubleAnimation animation = new DoubleAnimation();
//set the duration property
animation.Duration = duration;
//set the from and too values
animation.From = 1.0;
animation.To = 0.0;
//add the duration to the storyboard
story.Duration = duration;
//now set the target of the animation
Storyboard.SetTarget(animation, myTestShape);
//set the target property of this object
Storyboard.SetTargetProperty(animation, new PropertyPath(UIElement.OpacityProperty));
//add the double animations to the story board
story.Children.Add(animation);
if (!LayoutRoot.Resources.Contains("story1"))
LayoutRoot.Resources.Add("story1", story);
story.Begin();
For the property path I've also tried:
1. new PropertyPath("(FrameworkElement.Opacity)")
2. new PropertyPath("(FrameworkElement.Opacity)")
3. new PropertyPath("(Control.Opacity)")
And a few others, I'm having zero luck with this.
Can anyone see where I'm going wrong?
Thanks,
Jacques
I have done databinding to MapShape.FillProperty before.
Try:
//create double animation
ColorAnimation animation = new ColorAnimation();
//set the duration property
animation.Duration = duration;
//set the from and too values
animation.From = Colors.Purple;
animation.To = Colors.Transparent;
//add the duration to the storyboard
story.Duration = duration;
//now set the target of the animation
Storyboard.SetTarget(animation, rect);
//set the target property of this object
Storyboard.SetTargetProperty(animation, new PropertyPath("(MapShape.Fill).Color"));
EDIT:
As for why your code is not working -- Looking through MapShape.SetShapeFillStroke(), it appears that Telerik won't bind the MapShape's Opacity to its inner primitive shape's Opacity unless you provide a fill. Do you have a Fill defined in XAML? If not, try providing one. Otherwise, maybe the code is defined too early in the Shape's lifecycle (in or after ReadCompleted)?
<telerik:InformationLayer x:Name="StateLayer">
<telerik:InformationLayer.Reader>
...
</telerik:InformationLayer.Reader>
<telerik:InformationLayer.ShapeFill>
<telerik:MapShapeFill Fill="{StaticResource CommonBackgroundLightBrush}" Stroke="#5A636B" StrokeThickness="1" />
</telerik:InformationLayer.ShapeFill>

How to animate ListBoxItem position

I am having some trouble animating the items in my ListBox. Animations on the OpacityProperty work great but when i try to animate the position of my ListBoxItem it simply does not move an inch (No exceptions are thrown, not even a log message indicating error).
Here is the code i am using:
private void deletAnimation()
{
Todo todoToDelete = App.ViewModel.Todos[1];
Storyboard storyboard = new Storyboard();
DoubleAnimation alphaAnim = new DoubleAnimation();
alphaAnim.From = 1;
alphaAnim.To = 0;
alphaAnim.Duration = new Duration(TimeSpan.FromMilliseconds(500));
ListBoxItem target = TodoList.ItemContainerGenerator.ContainerFromItem(todoToDelete) as ListBoxItem;
Storyboard.SetTarget(alphaAnim, target);
Storyboard.SetTargetProperty(alphaAnim, new PropertyPath(UIElement.OpacityProperty));
storyboard.Children.Add(alphaAnim);
for (int i = App.ViewModel.Todos.IndexOf(todoToDelete) + 1; i < App.ViewModel.Todos.Count; i++)
{
Todo todo = App.ViewModel.Todos[i];
target = TodoList.ItemContainerGenerator.ContainerFromItem(todo) as ListBoxItem;
DoubleAnimation translateAnim = new DoubleAnimation();
translateAnim.From = target.RenderTransformOrigin.Y;
translateAnim.To = target.RenderTransformOrigin.Y - target.ActualHeight;
translateAnim.Duration = new Duration(TimeSpan.FromMilliseconds(500));
translateAnim.BeginTime = TimeSpan.FromMilliseconds(500);
Storyboard.SetTarget(translateAnim, target);
Storyboard.SetTargetProperty(translateAnim, new PropertyPath(TranslateTransform.YProperty));
storyboard.Children.Add(translateAnim);
}
storyboard.Begin();
}
Some things i have noticed while debugging:
The RenderTransformOrigin.Y property is always 0 no matter which ListBoxItem is referenced.
The Height property is NaN though the ActualHeight property is 67
The parent property of the ListBoxItem is null
These two things make me wonder if i am given a reference to a ListBoxItem that is not rendered of the screen? But as the Opacity animation works perfectly and all of my list is visible(only contains 3 items at the moment) i do not see how this could be the case.
I have also tried using a PointAnimation and animating the RenderTransformOrigin property directly but this gave the same result (nothing that is).
Any help is appreciated, thanks!
Please check out this link:
http://blogs.msdn.com/b/jasongin/archive/2011/01/03/wp7-reorderlistbox-improvements-rearrange-animations-and-more.aspx
Someone has created a class that you can easily incorporate into your app. This has animations for adding/removing items from your list.
This should save you a lot of time and frustration.

dynamically added control not rendering, silverlight

Hello i have a canvas with the name Layout. I want to add some childs to it in code behind. Here is the code.
private void AddItem(int TruePosition, int CurrentPosition, string ImageFileName)
{
Image img = new Image();
img.Source = new BitmapImage(new Uri(#"/Images/" + ImageFileName, UriKind.Relative));
img.Width = 100.0;
img.Height = 400.0;
img.VerticalAlignment = System.Windows.VerticalAlignment.Bottom;
img.Stretch = Stretch.None;
Border b = new Border();
b.SetValue(Canvas.TopProperty, 200.0);
b.SetValue(Canvas.LeftProperty, (double)CurrentPosition);
b.SetValue(Canvas.ZIndexProperty, 1);
b.Background = new SolidColorBrush(Colors.Blue);
b.MouseMove += new MouseEventHandler(Border_MouseMove);
b.MouseLeftButtonDown += new MouseButtonEventHandler(Border_MouseLeftButtonDown);
b.MouseLeftButtonUp += new MouseButtonEventHandler(Border_MouseLeftButtonUp);
b.Child = img;
Layout.Children.Add(b);
UpdateLayout();
}
The image Uri is probably good because if i try to add only the border(without the image) it's still not rendering. Also i call this AddItem function from a button click event handler so initializations should not be a problem. Probably i am missing a very basic stuff here. Any ideas are welcome, thank you for your help.
Update: Ok i had something wrong with the browser cache probably, the border is added, but the image in the border isn't showing up. In the Visual Studio project i have an Images dir with the image files. Am i setting the path to them wrong?
So, now i am allowed to answer it. Well it was a newbie mistake.
The first / before Images is not needed. new Uri(#"Images/" + ImageFileName, UriKind.Relative) is correct.

Why OffsetX of TranslateTransform3D can't be modified after DoubleAnimation?

My code is here, and I can't edit the offset property of TranslateTransform3D any more after running this:
DoubleAnimation doubleAnimationX =
new DoubleAnimation(x,
new Duration(TimeSpan.FromSeconds(second)));
DoubleAnimation doubleAnimationY =
new DoubleAnimation(y,
new Duration(TimeSpan.FromSeconds(second)));
DoubleAnimation doubleAnimationZ =
new DoubleAnimation(z,
new Duration(TimeSpan.FromSeconds(second)));
translate.BeginAnimation(TranslateTransform3D.OffsetXProperty, doubleAnimationX);
translate.BeginAnimation(TranslateTransform3D.OffsetYProperty, doubleAnimationY);
translate.BeginAnimation(TranslateTransform3D.OffsetZProperty, doubleAnimationZ);
TranslateTransform3D derives from Freezable. Your translate is being frozen after the animation, which makes it immutable.

Resources