private void Window_MouseEnter(object sender, System.Windows.Input.MouseEventArgs e)
{
DoubleAnimation rightAnimation = new DoubleAnimation();
rightAnimation.Duration = TimeSpan.FromSeconds(2);
rightAnimation.From = 0;
rightAnimation.To = 200;
Storyboard.SetTarget(rightAnimation , rect1);
Storyboard.SetTargetProperty(rightAnimation, new PropertyPath("(0).(1)", new DependencyProperty[]{UIElement.RenderTransformProperty, TranslateTransform.XProperty}));
Storyboard sb = new Storyboard();
sb.AccelerationRatio = 0.8;
sb.Children.Add(rightAnimation);
sb.Begin();
}
I want to accelerate the rect1 to the right.. When i run it nothing happens.
You can use TransformGroup to animate all transform types.
DoubleAnimation rightAnimation = new DoubleAnimation();
rightAnimation.Duration = TimeSpan.FromSeconds(2);
rightAnimation.From = 0;
rightAnimation.To = 200;
TransformGroup transGroup = new TransformGroup();
transGroup.Children.Add(new TranslateTransform());
rect1.RenderTransform = transGroup;
Storyboard.SetTarget(rightAnimation, rect1);
Storyboard.SetTargetProperty(rightAnimation, new PropertyPath("RenderTransform.Children[0].X"));
Storyboard sb = new Storyboard();
sb.AccelerationRatio = 0.8;
sb.Children.Add(rightAnimation);
sb.Begin();
Related
I found below code to let my image(indicator1) rotation.
But it's nothing happened when I click the button.
Anyone know how to solve it?
private void Button_Click(object sender, RoutedEventArgs e)
{
RotateTransform rotateTransform = indicator1.RenderTransform as RotateTransform;
DoubleAnimation doubleAnimation = new DoubleAnimation();
doubleAnimation.From = 0;
doubleAnimation.To = 360;
doubleAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(10000));
Storyboard.SetTarget(doubleAnimation, rotateTransform);
Storyboard.SetTargetProperty(doubleAnimation, new PropertyPath(RotateTransform.AngleProperty));
Storyboard storyboard = new Storyboard();
storyboard.RepeatBehavior = RepeatBehavior.Forever;
storyboard.Children.Add(doubleAnimation);
storyboard.Begin(this);
}
You don't need the Storyboard. Using a Storyboard from code behind requires a workaround to get the target name lookup to to work. I haven't researched the exact cause of this, or whether or not it's always an issue. The code below works.
Note that you'll be setting RepeatBehavior on the DoubleAnimation now.
private void Button_Click(object sender, RoutedEventArgs e)
{
RotateTransform rotateTransform = indicator1.RenderTransform as RotateTransform;
DoubleAnimation doubleAnimation = new DoubleAnimation();
doubleAnimation.From = 0;
doubleAnimation.To = 360;
doubleAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(10000));
doubleAnimation.RepeatBehavior = RepeatBehavior.Forever;
rotateTransform.BeginAnimation(RotateTransform.AngleProperty, doubleAnimation);
}
Hi i have a Window>grid>rectangle named as (rect1)
how do i enlarge this using storyboard
Error:Additional information: No applicable name scope exists to resolve the name 'rect1'
private void Window_MouseEnter(object sender, System.Windows.Input.MouseEventArgs e)
{
Storyboard buttonEnlargeStoryboard = new Storyboard();
DoubleAnimation da = new DoubleAnimation();
da.SetValue(Storyboard.TargetNameProperty, rect1.Name);
da.BeginTime = new TimeSpan(0);
da.Duration = TimeSpan.FromSeconds(1);
buttonEnlargeStoryboard.Children.Add(da);
buttonEnlargeStoryboard.Begin();
}
You should animate width and height properties like this:
DoubleAnimation widthAnimation = new DoubleAnimation
{
From = 0,
To = rect1.ActualWidth*2,
Duration = TimeSpan.FromSeconds(5)
};
DoubleAnimation heightAnimation = new DoubleAnimation
{
From = 0,
To = rect1.ActualHeight*2,
Duration = TimeSpan.FromSeconds(5)
};
Storyboard.SetTargetProperty(widthAnimation, new PropertyPath(Rectangle.WidthProperty));
Storyboard.SetTarget(widthAnimation, rect1);
Storyboard.SetTargetProperty(heightAnimation, new PropertyPath(Rectangle.HeightProperty));
Storyboard.SetTarget(heightAnimation, rect1);
Storyboard buttonEnlargeStoryboard = new Storyboard();
buttonEnlargeStoryboard.SpeedRatio = 1;
buttonEnlargeStoryboard.Children.Add(widthAnimation);
buttonEnlargeStoryboard.Children.Add(heightAnimation);
buttonEnlargeStoryboard.Begin();
I am currently removing an element from the user interface by fading it out. This works as expected.
public void HideShape()
{
if (this.TangibleShape != null)
{
DoubleAnimation animation = new DoubleAnimation();
animation.From = 1.0;
animation.To = 0.0;
animation.AutoReverse = false;
animation.Duration = TimeSpan.FromSeconds(1.5);
Storyboard s = new Storyboard();
s.Children.Add(animation);
Storyboard.SetTarget(animation, this.TangibleShape.Shape);
Storyboard.SetTargetProperty(animation, new PropertyPath(ScatterViewItem.OpacityProperty));
s.Begin(this.TangibleShape.Shape);
s.Completed += delegate(object sender, EventArgs e)
{
// call UIElementManager to finally hide the element
UIElementManager.GetInstance().Hide(this.TangibleShape);
};
}
}
The problem is that I want to set the opacity to 1 again in some cases but the TangibleShape.Shape (it's a ScatterViewItem) ignores the command. If I fade out again, the element becomes visible and immediately starts fading out. I don't know how to fix this problem. Does anyone have a hint for me?
public void HideShape()
{
if (this.TangibleShape != null)
{
DoubleAnimation animation = new DoubleAnimation();
animation.From = 1.0;
animation.To = 0.0;
animation.AutoReverse = false;
animation.Duration = TimeSpan.FromSeconds(1.5);
animation.FillBehavior = FillBehavior.Stop; // needed
Storyboard s = new Storyboard();
s.Children.Add(animation);
Storyboard.SetTarget(animation, this.TangibleShape.Shape);
Storyboard.SetTargetProperty(animation, new PropertyPath(ScatterViewItem.OpacityProperty));
s.Completed += delegate(object sender, EventArgs e)
{
// call UIElementManager to finally hide the element
UIElementManager.GetInstance().Hide(this.TangibleShape);
this.TangibleShape.Shape.Opacity = 0.0; // otherwise Opacity will be reset to 1
};
s.Begin(this.TangibleShape.Shape); // moved to the end
}
}
Answer found here: http://social.msdn.microsoft.com/Forums/en-US/7d33ca82-2c02-4004-8b37-47edf4cca34e/scatterviewitem-and-
I have a button containing an image, and I want that image rotates while some code is executed, then stop at the end of this processing.
My code almost works if I begin the storyboard, but when I add the line sb.Stop(), the animation never begins.
Here is my code:
private void refreshPostIt(int postItIndex)
{
Button btn = // Button to rotate
Storyboard sb = new Storyboard();
DoubleAnimation rotate = new DoubleAnimation();
rotate.From = 0;
rotate.To = 360;
rotate.RepeatBehavior = RepeatBehavior.Forever;
RotateTransform rt = new RotateTransform();
btn.RenderTransformOrigin = new Point(0.5, 0.5);
btn.RenderTransform = rt;
Storyboard.SetTarget(rotate, btn);
Storyboard.SetTargetName(rotate, btn.Name);
Storyboard.SetTargetProperty(rotate, new PropertyPath("(UIElement.RenderTransform).(RotateTransform.Angle)"));
sb.Children.Add(rotate);
sb.Begin(this, true);
// Some code which can take several seconds
sb.Stop();
}
I'm stuck.
I have a solution that works for me.
private void refreshPostIt()
{
// Button btn; is defined somewhere else
Storyboard sb = new Storyboard();
DoubleAnimation rotate = new DoubleAnimation();
rotate.From = 0;
rotate.To = 360;
rotate.RepeatBehavior = RepeatBehavior.Forever;
RotateTransform rt = new RotateTransform();
btn.RenderTransformOrigin = new Point(0.5, 0.5);
btn.RenderTransform = rt;
Storyboard.SetTarget(rotate, btn);
Storyboard.SetTargetName(rotate, btn.Name);
Storyboard.SetTargetProperty(rotate, new PropertyPath("(UIElement.RenderTransform).(RotateTransform.Angle)"));
sb.Children.Add(rotate);
sb.Begin(btn, true);
// Do your stuff here (Not in the UI Thread)
// Maybe use a semaphore to lock the sb.Stop(btn)
sb.Stop(btn);
}
whole example code:
public partial class Window1 : Window
{
Button btn;
Storyboard sb;
public Window1()
{
btn = new Button();
InitializeComponent();
this.grid.Children.Add(btn);
refreshPostIt();
}
private void refreshPostIt()
{
// Button btn; is defined somewhere else
sb = new Storyboard();
DoubleAnimation rotate = new DoubleAnimation();
rotate.From = 0;
rotate.To = 360;
rotate.RepeatBehavior = RepeatBehavior.Forever;
RotateTransform rt = new RotateTransform();
btn.RenderTransformOrigin = new Point(0.5, 0.5);
btn.RenderTransform = rt;
Storyboard.SetTarget(rotate, btn);
Storyboard.SetTargetName(rotate, btn.Name);
Storyboard.SetTargetProperty(rotate, new PropertyPath("(UIElement.RenderTransform).(RotateTransform.Angle)"));
sb.Children.Add(rotate);
sb.Begin(btn, true);
BackgroundWorker asd = new BackgroundWorker();
asd.DoWork += new DoWorkEventHandler(asd_DoWork);
asd.RunWorkerCompleted += new RunWorkerCompletedEventHandler(asd_RunWorkerCompleted);
asd.RunWorkerAsync();
}
void asd_RunWorkerCompleted(object sender, RunWorkerCompletedEventArgs e)
{
if (sb != null)
{
sb.Stop(btn);
}
}
void asd_DoWork(object sender, DoWorkEventArgs e)
{
Thread.Sleep(2000);
}
}
Ok, I want to explain what I think is your problem here. When you use the UI-Thread to do your "work" it can't update your UI and though won't animate the rotating, when its done with your "work", between starting and stopping the animation, and finally would have time to update the UI, you call to stop animating. That leads to not showing any animation. You need to put your work in a different thread to prevent this from happening.
Hope that helps.
How can I programatically change the Color of a Rectangle in my Grid?
ColorAnimation myColorAnimation = new ColorAnimation();
myColorAnimation.From = Colors.Red;
myColorAnimation.To = Colors.Blue;
myColorAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(500));
myColorAnimation.AutoReverse = false;
myStoryboard = new Storyboard();
myStoryboard.Children.Add(myColorAnimation);
Storyboard.SetTargetName(myColorAnimation, ?); // What do I put here
Storyboard.SetTargetProperty(myColorAnimation, new PropertyPath //What do I put here?
OK, I found a way to do this:
I create a StoryBoard for each Grid item:
List<Storyboard> _animatableGridRectToGray = new List<Storyboard>();
List<Storyboard> _animatableGridRectToWhite = new List<Storyboard>();
and populate:
private void initAnimatableGridRectangles()
{
int index = 1;
foreach (Rectangle rect in SequenceGrid.Children)
{
SolidColorBrush tempBrush = new SolidColorBrush();
rect.Fill = tempBrush;
string brushName = "Brush" + index;
_gridBrushes.Add(brushName, tempBrush);
this.RegisterName(brushName, tempBrush);
Storyboard tempSBToGray = new Storyboard();
Storyboard tempSBToWhite = new Storyboard();
ColorAnimation tempColAnimToGray = getAnimToGray();
ColorAnimation tempColAnimToWhite = getAnimToWhite();
tempSBToGray.Children.Add(tempColAnimToGray);
tempSBToWhite.Children.Add(tempColAnimToWhite);
Storyboard.SetTargetName(tempColAnimToGray, brushName);
Storyboard.SetTargetName(tempColAnimToWhite, brushName);
Storyboard.SetTargetProperty(tempColAnimToGray, new PropertyPath(SolidColorBrush.ColorProperty));
Storyboard.SetTargetProperty(tempColAnimToWhite, new PropertyPath(SolidColorBrush.ColorProperty));
_animatableGridRectToGray.Add(tempSBToGray);
_animatableGridRectToWhite.Add(tempSBToWhite);
index++;
}
}
private ColorAnimation getAnimToGray()
{
ColorAnimation colAnim = new ColorAnimation();
colAnim.To = Colors.Gray;
colAnim.Duration = new Duration(TimeSpan.FromMilliseconds(500));
colAnim.AutoReverse = false;
return colAnim;
}
private ColorAnimation getAnimToWhite()
{
ColorAnimation colAnim = new ColorAnimation();
colAnim.To = Colors.White;
colAnim.Duration = new Duration(TimeSpan.FromMilliseconds(500));
colAnim.AutoReverse = false;
return colAnim;
}
Then I can animate like so:
_animatableGridRectToGray[index].Begin(this);