I have my Storyboard animation which is moving images to specific (Canvas.SetTop) coordination. I wonder if there is an option to make those images go to specific coordination but make them sink NOT dissapear.
I am using DoubleAnimations in Storyboard.
DoubleAnimation myAnimation = new DoubleAnimation();
myAnimation.SpeedRatio = 3;
myAnimation.AutoReverse = false;
myAnimation.From = 0;
myAnimation.To = 700;
myAnimation.Duration = new Duration(TimeSpan.FromSeconds(2));
myAnimation.BeginTime = beginTime;
this.beginTime += TimeSpan.FromMilliseconds(300);
Related
I am using MSDN example to setup the animation of Width of a Rectangle in C3 UWP.
Here is the code of the sample:
private void Create_And_Run_Animation()
{
// Create a red rectangle that will be the target
// of the animation.
Rectangle myRectangle = new Rectangle();
myRectangle.Width = 0;
myRectangle.Height = 20;
SolidColorBrush myBrush = new SolidColorBrush(Colors.Yellow);
myRectangle.Fill = myBrush;
// Create the transform
TranslateTransform stretchTransform = new TranslateTransform();
stretchTransform.X = 0;
stretchTransform.Y = 0;
myRectangle.RenderTransform = stretchTransform;
// Add the rectangle to the tree.
DefaultLayout.Children.Add(myRectangle);
myRectangle.Name = "myWidthAnimatedRectangle";
// Create a duration of 2 seconds.
Duration duration = new Duration(TimeSpan.FromSeconds(2));
// Create two DoubleAnimations and set their properties.
DoubleAnimation myDoubleAnimation = new DoubleAnimation();
myDoubleAnimation.From = 0.0;
myDoubleAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(3000));
Storyboard justintimeStoryboard = new Storyboard();
justintimeStoryboard.Duration = duration;
justintimeStoryboard.Children.Add(myDoubleAnimation);
Storyboard.SetTarget(myDoubleAnimation, stretchTransform);
Storyboard.SetTargetName(myDoubleAnimation, myRectangle.Name);
// Set the X property of the Transform to be the target property
Storyboard.SetTargetProperty(myDoubleAnimation, "X");
myDoubleAnimation.To = 300.0;
// Make the Storyboard a resource.
DefaultLayout.Resources.Add("justintimeStoryboard", justintimeStoryboard);
// Begin the animation.
justintimeStoryboard.Begin();
}
However, on Build, what it does is move the object and not change its width.
I need to animate width change.
However, on Build, what it does is move the object and not change its width. I need to animate width change.
Your code was used to animate the Rectangle's position, not its width. You could specify a default value for its width and animate its ScaleTransform.
If you have to use DoubleAnimation to animate its width, you need to set EnableDependentAnimation to true. Please check the following code sample:
private void Create_And_Run_Animation()
{
// Create a red rectangle that will be the target
// of the animation.
Rectangle myRectangle = new Rectangle();
myRectangle.Width = 10;
myRectangle.Height = 20;
SolidColorBrush myBrush = new SolidColorBrush(Colors.Yellow);
myRectangle.Fill = myBrush;
// Add the rectangle to the tree.
DefaultLayout.Children.Add(myRectangle);
myRectangle.Name = "myWidthAnimatedRectangle";
DoubleAnimation myDoubleAnimation = new DoubleAnimation();
myDoubleAnimation.From = 0.0;
myDoubleAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(3000));
Storyboard justintimeStoryboard = new Storyboard();
Storyboard.SetTargetProperty(myDoubleAnimation, "(Rectangle.Width)");
Storyboard.SetTargetName(myDoubleAnimation, myRectangle.Name);
myDoubleAnimation.To = 300.0;
myDoubleAnimation.EnableDependentAnimation = true;
justintimeStoryboard.Children.Add(myDoubleAnimation);
// Make the Storyboard a resource.
DefaultLayout.Resources.Add("justintimeStoryboard", justintimeStoryboard);
// Begin the animation.
justintimeStoryboard.Begin();
}
So, I'm developing an application in WPF with C#, and I would like to gradually grow a image control (using a DoubleAnimation). I ran it, but my image never appeared. Here is my code:
PACSCore.Height = 0; //Sets Image Size before enlarging
PACSCore.Width = 0;
DoubleAnimation anim = new DoubleAnimation(1, 0, (Duration)TimeSpan.FromSeconds(0.4)); //Creates DoubleAnimation
ScaleTransform st = new ScaleTransform(); //Creates ScaleTransform
st.ScaleX = 1; //Sets Scale for X and Y
st.ScaleY = 1;
PACSCore.RenderTransform = st;
st.BeginAnimation(ScaleTransform.ScaleXProperty, anim);
st.BeginAnimation(ScaleTransform.ScaleYProperty, anim);
Thanks to Clemens, I now have the solution and am posting it for everyone else's benefit. I had to initially set the Image Control's size ahead of time and animate the image from 0 to 1 using a DoubleAnimation. Here's my code:
DoubleAnimation anim = new DoubleAnimation(0, 1, (Duration)TimeSpan.FromSeconds(1.2));
ScaleTransform st = new ScaleTransform();
st.ScaleX = 0;
st.ScaleY = 0;
IMAGE.RenderTransform = st;
st.BeginAnimation(ScaleTransform.ScaleXProperty, anim);
st.BeginAnimation(ScaleTransform.ScaleYProperty, anim);
I have some problem. This is my code behind:
var s = new Storyboard();
var dAnimation = new DoubleAnimation();
dAnimation.RepeatBehavior = RepeatBehavior.Forever;
dAnimation.AutoReverse = true;
dAnimation.EnableDependentAnimation = true;
dAnimation.From = 200;
dAnimation.To = 300;
Storyboard.SetTarget(dAnimation, viewBox);
Storyboard.SetTargetProperty(dAnimation, "Width");
dAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(2000));
s.Children.Add(dAnimation);
s.Begin();
viewBox is on Canvas and has just a few property: Canvas.Left, Canvas.Top, Height and Width. Code from codebehind working great with Opacity, but not working with Width or Height. Codebehind work when user pointer is entered. I want do it without triggers. Found some solutions for Silverlight and WPF:
WinRT/Metro Animation in code-behind
they are not working. I dont undersstand why it work with opacity and didn't work with Width and Height Any ideas?
You cannot animate Width with a DoubleAnimation, you need to use a DoubleAnimationUsingKeyFrames.
var animation = new DoubleAnimationUsingKeyFrames();
var frame = new EasingDoubleKeyFrame { KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromMilliseconds(2000)), Value = 300});
animation.KeyFrames.Add(frame);
Storyboard.SetTargetProperty(animation, "(FrameworkElement.Width)");
Storyboard.SetTarget(animation, viewBox);
Storyboard.Children.Add(animation);
I didn't check ViewBox,but I can with DoubleAnimation for Grid.
Code is like below
var s = new Storyboard();
var widthAnim = new DoubleAnimation()
{
To = w,
Duration=new Duration(TimeSpan.FromMilliseconds(duration))
};
widthAnim.EnableDependentAnimation = true;
Storyboard.SetTarget(widthAnim,elem);
Storyboard.SetTargetProperty(widthAnim,"Width");
s.Children.Add(widthAnim);
s.Begin();
I am trying to make an image slide diagonally in windows phone 8 C#, i have tried some code, and gotten rid of an error i created - but when i doubletap the canvas, it is supposed to trigger the event, but nothing happens. Please take a look at my code:
private void Canvas_DoubleTap(object sender, System.Windows.Input.GestureEventArgs e)
{
//The canvas was doubletapped
//Create DoubleAnimation for x value
DoubleAnimation movedefenderxpositionAnimation = new DoubleAnimation();
movedefenderxpositionAnimation.From = 0;
movedefenderxpositionAnimation.To = 30;
movedefenderxpositionAnimation.Duration = new Duration(TimeSpan.FromSeconds(1));
movedefenderxpositionAnimation.AutoReverse = false;
//Create DoubleAnimation for y value
DoubleAnimation movedefenderypositionAnimation = new DoubleAnimation();
movedefenderypositionAnimation.From = 0;
movedefenderypositionAnimation.To = 15;
movedefenderypositionAnimation.Duration = new Duration(TimeSpan.FromSeconds(1));
movedefenderypositionAnimation.AutoReverse = false;
//Create StoryBoard
Storyboard movedefenderxpositionSB = new Storyboard();
movedefenderxpositionSB.Children.Add(movedefenderxpositionAnimation);
Storyboard movedefenderypositionSB = new Storyboard();
movedefenderypositionSB.Children.Add(movedefenderypositionAnimation);
//Set the timespan
movedefenderxpositionSB.Duration = new Duration(TimeSpan.FromSeconds(1));
movedefenderypositionSB.Duration = new Duration(TimeSpan.FromSeconds(1));
//Set the target
Storyboard.SetTarget(movedefenderxpositionAnimation, squaddefender1);
Storyboard.SetTarget(movedefenderypositionAnimation, squaddefender1);
//Set the target property
Storyboard.SetTargetProperty(movedefenderxpositionAnimation, new PropertyPath("(Canvas.Left)"));
Storyboard.SetTargetProperty(movedefenderypositionAnimation, new PropertyPath("(Canvas.Top)"));
//Start the animation
movedefenderxpositionSB.Begin();
movedefenderypositionSB.Begin();
}
And also, something i dont understand. How can i set the target property of the StoryBoard, and not the one i created, two times? I added this piece of code to iron out an error, which created a new one
I saw an example on how to create a glow effect when the image gets focus in mark-up.
Below is the C# code example i found that uses double animation for opacity of a rectangle, i need to perform a glow or swivel effect using C# and not markup since i am not comfortable with it.
DoubleAnimation myDoubleAnimation = new DoubleAnimation();
myDoubleAnimation.From = 1.0;
myDoubleAnimation.To = 0.0;
myDoubleAnimation.Duration = new Duration(TimeSpan.FromSeconds(5));
myDoubleAnimation.AutoReverse = true;
myDoubleAnimation.RepeatBehavior = RepeatBehavior.Forever;
myStoryboard = new Storyboard();
myStoryboard.Children.Add(myDoubleAnimation);
Storyboard.SetTargetName(myDoubleAnimation, myRectangle.Name);
Storyboard.SetTargetProperty(myDoubleAnimation, new PropertyPath(Rectangle.OpacityProperty));
You can add this in your Main(), after InitializeComponent();
textBlock1.Text = "Mouse over me";
var effect = new DropShadowEffect();
effect.Color = Colors.Red;
effect.BlurRadius = 10d;
effect.Opacity = 0d;
effect.ShadowDepth = 0d;
textBlock1.Effect = effect;
textBlock1.MouseEnter += (s, e) => {
var anim = new DoubleAnimation(0d, 1d, new Duration(TimeSpan.FromMilliseconds(500)));
effect.BeginAnimation(DropShadowEffect.OpacityProperty, anim); };
textBlock1.MouseLeave += (s, e) => {
var anim = new DoubleAnimation(1d, 0d, new Duration(TimeSpan.FromMilliseconds(500)));
effect.BeginAnimation(DropShadowEffect.OpacityProperty, anim); };
But I'd suggest stop wasting time with C# for GUI code, XAML is so much more convenient.