i try to do this xaml code programmatically
<Grid.Triggers>
<EventTrigger RoutedEvent="UIElement.MouseEnter">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetName="tranny" Storyboard.TargetProperty="ScaleX" To="1.2" Duration="0:0:1">
<DoubleAnimation.EasingFunction>
<ElasticEase Oscillations="1" Springiness="8"/>
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
<DoubleAnimation Storyboard.TargetName="tranny" Storyboard.TargetProperty="ScaleY" To="1.2" Duration="0:0:1">
<DoubleAnimation.EasingFunction>
<ElasticEase Oscillations="1" Springiness="8" />
</DoubleAnimation.EasingFunction>
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Grid.Triggers>
it do it but it didn't work with i don't know why but there is no errors if there is any onwe can write this xaml in C# programmatically answer me
please if you have answer can help me add it if no please don't give -1 that is programmatically code that i wrote
var secondryGrid = new Grid();
var elasticEase = new ElasticEase();
elasticEase.Oscillations = 1;
elasticEase.Springiness = 8;
var timeSpan = new TimeSpan(0, 0, 0, 100);
var duration = new Duration(timeSpan);
var doubleAnimation = new DoubleAnimation();
doubleAnimation.To = 1.2;
doubleAnimation.Duration = duration;
doubleAnimation.EasingFunction = elasticEase;
var path = new PropertyPath("ScaleX");
var storyBoard = new Storyboard();
Storyboard.SetTargetProperty(doubleAnimation, path);
storyBoard.Children.Add(doubleAnimation);
var beginStoryBoard = new BeginStoryboard();
beginStoryBoard.Storyboard = storyBoard;
elasticEase = new ElasticEase();
elasticEase.Oscillations = 1;
elasticEase.Springiness = 8;
timeSpan = new TimeSpan(0, 0, 0, 100);
duration = new Duration(timeSpan);
doubleAnimation = new DoubleAnimation();
doubleAnimation.To = 1.2;
doubleAnimation.Duration = duration;
doubleAnimation.EasingFunction = elasticEase;
path = new PropertyPath("ScaleY");
Storyboard.SetTargetProperty(doubleAnimation, path);
storyBoard.Children.Add(doubleAnimation);
var gridEventTrigger = new EventTrigger();
gridEventTrigger.RoutedEvent = MouseEnterEvent;
gridEventTrigger.Actions.Add(beginStoryBoard);
secondryGrid.Triggers.Add(gridEventTrigger);
sorry for my bad language
In code, this is done somewhat easier.
You don't need to instantiate BeginStoryboard and Storyboard; these classes are designed to make it easier to use animations in XAML.
In code, you can set the animation directly to the desired property.
This requires significantly less code.
Example:
{
Grid grid = new Grid();
grid.MouseEnter += OnGridMouseEnter;
}
// An animation instance is created once and can then be reused.
private static readonly DoubleAnimation xyAnimation = new DoubleAnimation(1.2, TimeSpan.FromSeconds(1))
{
EasingFunction = new ElasticEase()
{
Oscillations = 1,
Springiness = 8
}
};
private void OnGridMouseEnter(object sender, MouseEventArgs e)
{
tranny.BeginAnimation(ScaleTransform.ScaleXProperty, xyAnimation);
tranny.BeginAnimation(ScaleTransform.ScaleYProperty, xyAnimation);
}
P.S. It is not clear from your code how you create the tranny transformation.
My example is created on the assumption that there is a tranny field that contains the transformation that needs to be animated.
Related
I have a Style code define in ResourceDirectory to animate my popup. this is WPF code:
<Style x:Key="Hardwarepopups" TargetType="Popup">
<Style.Triggers>
<Trigger Property="IsOpen" Value="True">
<Trigger.EnterActions>
<BeginStoryboard >
<Storyboard>
<DoubleAnimation Duration="0:0:.3" Storyboard.TargetProperty="Width" From="0" To="100" AccelerationRatio=".1"/>
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
</Trigger>
</Style.Triggers>
</Style>
This is Popup:
<Popup Height="Auto" Width="Auto" Name="HardwareToolTip" StaysOpen="True" AllowsTransparency="True" Style="{StaticResource Hardwarepopups}">
It works well by handle all in XAML. I have decided to convert it to C# code like this:
void SetHarwareStyle(Popup B) {
var RightToLeft = new DoubleAnimation()
{
From = 0,
To = 100,
Duration = TimeSpan.FromMilliseconds(300),
AccelerationRatio = 0.1
};
Storyboard.SetTargetProperty(RightToLeft, new PropertyPath(WidthProperty));
Storyboard C = new Storyboard();
C.Children.Add(RightToLeft);
var action = new BeginStoryboard();
action.Storyboard = C;
Trigger A = new Trigger { Property = Popup.IsOpenProperty, Value = true };
A.EnterActions.Add(action);
B.Triggers.Add(A);
}
But this line B.Triggers.Add(A); gives the error System.InvalidOperationException: 'Triggers collection members must be of type EventTrigger.'
How can I solve this problem?
The propose of this conversion is to change To property of DoubleAnimation in runtime.
The code in the question does not reflect the XAML completely: the style is missing.
I renamed some of the variables to make it easier to read (and prevent mistakes like these)
BTW: the rightToLeftAnimation should be named leftToRightAnimation.
void SetHarwareStyle(Popup popup)
{
var rightToLeftAnimation = new DoubleAnimation()
{
From = 0,
To = 100,
Duration = TimeSpan.FromMilliseconds(300),
AccelerationRatio = 0.1
};
Storyboard.SetTargetProperty(rightToLeftAnimation, new PropertyPath(WidthProperty));
var storyboard = new Storyboard();
storyboard.Children.Add(rightToLeftAnimation);
var beginStoryboard = new BeginStoryboard();
beginStoryboard.Storyboard = storyboard;
var trigger = new Trigger { Property = Popup.IsOpenProperty, Value = true };
trigger.EnterActions.Add(beginStoryboard);
var style= new Style();
style.TargetType = typeof(Popup);
style.Triggers.Add(trigger);
popup.Style = style;
}
I want to make a bubble window that GRADUALLY appears and vanishes after having displayed a message. I want its position to be near the tray and in the constructor I use for that:
var screenSize = System.Windows.SystemParameters.WorkArea;
this.Left = screenSize.Right - this.Width;
this.Top = screenSize.Bottom - this.Height;
this has worked properly other times but now it doesn't.
Strangely enough also the opacity doesn't change. So to put it in a nutshell the window appear all of a sudden with no gradual transition at the center of the screen instead than near the tray.
This is the code:
public BubbleWindow(string strMessage, double milliseconds)
{
InitializeComponent();
btYes.Content = strMessage;
var screenSize = System.Windows.SystemParameters.WorkArea;
this.Left = screenSize.Right - this.Width;
this.Top = screenSize.Bottom - this.Height;
int interval = (int)(milliseconds / 25);
for (double iii = 0; iii <= 1; iii += .1)
{
Thread.Sleep(interval);
this.Opacity = iii;
Dispatcher.Invoke((Action)(() => { }), DispatcherPriority.Render);
this.UpdateLayout();
}
this.Opacity = 1;
}
Thanks for any help
You can use this code in your XAML
<EventTrigger RoutedEvent="Rectangle.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="MyRectangle"
Storyboard.TargetProperty="Opacity"
From="1.0" To="0.0" Duration="0:0:5" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
This is pure XAML way
Or you can use
<Storyboard x:Name="anim">
<DoubleAnimation
Storyboard.TargetName="MyRectangle"
Storyboard.TargetProperty="Opacity"
From="1.0" To="0.0" Duration="0:0:5" />
</Storyboard>
and then start the animation from c#
you can take reference from here
As for the position problem I had put the WindowPosition=CenterScreen in my xaml code. That overrode the .left and .top command.
For the sake of completeness this is the complete Fade IN - wait - Fade out cycle:
private Storyboard myStoryboard;
public MainWindow()
{
InitializeComponent();
DoubleAnimation fadeInAnimation = new DoubleAnimation() { From = 0.0, To = 1.0, Duration = new Duration(TimeSpan.FromSeconds(1)) };
fadeInAnimation.Completed += FadeInAnimation_Completed;
myStoryboard = new Storyboard();
myStoryboard.Children.Add(fadeInAnimation);
Storyboard.SetTargetName(fadeInAnimation, MyRectangle.Name);
Storyboard.SetTargetProperty(fadeInAnimation, new PropertyPath(Rectangle.OpacityProperty));
// Use the Loaded event to start the Storyboard.
MyRectangle.Loaded += new RoutedEventHandler(myRectangleLoaded);
}
private void myRectangleLoaded(object sender, RoutedEventArgs e)
{
myStoryboard.Begin(this);
}
private void FadeInAnimation_Completed(object sender, EventArgs e)
{
DispatcherTimer timerFadeOut = new DispatcherTimer();
timerFadeOut.Interval = TimeSpan.FromSeconds(2);
timerFadeOut.Tick += TimerFadeOut_Tick;
timerFadeOut.Start();
}
private void TimerFadeOut_Tick(object sender, EventArgs e)
{
DoubleAnimation fadeOutAnimation = new DoubleAnimation() { From = 1.0, To = 0.0, Duration = new Duration(TimeSpan.FromSeconds(1)) };
myStoryboard = new Storyboard();
myStoryboard.Children.Add(fadeOutAnimation);
Storyboard.SetTargetName(fadeOutAnimation, MyRectangle.Name);
Storyboard.SetTargetProperty(fadeOutAnimation, new PropertyPath(Rectangle.OpacityProperty));
myStoryboard.Begin(this);
}
This works. That being said I am open to corrections.
I have this xaml code and I want to convert it in c#:
<Storyboard>
<DoubleAnimationUsingKeyFrames EnableDependentAnimation="True" Storyboard.TargetProperty="(Shape.Stroke).(GradientBrush.GradientStops)[0].(GradientStop.Offset)" Storyboard.TargetName="ellipse">
<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
<EasingDoubleKeyFrame KeyTime="0:0:0.7" Value="1"/>
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="0"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
I have made different tries :
Duration duration = new Duration(TimeSpan.FromSeconds(1));
Storyboard sb = new Storyboard();
sb.Duration = duration;
var da = new DoubleAnimationUsingKeyFrames();
da.EnableDependentAnimation = true;
da.Duration = duration;
var ed1 = new EasingDoubleKeyFrame();
ed1.KeyTime = TimeSpan.Parse("0");
ed1.Value = 1;
var ed2 = new EasingDoubleKeyFrame();
ed2.KeyTime = TimeSpan.Parse("0:0:0.7");
ed2.Value = 1;
var ed3 = new EasingDoubleKeyFrame();
ed3.KeyTime = TimeSpan.Parse("0:0:1");
ed3.Value = 0;
da.KeyFrames.Add(ed1);
da.KeyFrames.Add(ed2);
da.KeyFrames.Add(ed3);
Storyboard.SetTarget(da, lgbStroke);
Storyboard.SetTargetProperty(da, "(Shape.Stroke).(GradientBrush.GradientStops)[0].(GradientStop.Offset)");
sb.Children.Add(da);
sb.Begin();
but I get this exception :
WinRT information: Cannot resolve TargetProperty (Shape.Stroke).(GradientBrush.GradientStops)[0].(GradientStop.Offset) on specified object.
Does anybody have any idea how to resolve this?
Thanks in advance
Doubleanimation does not work, because the typ is an integer. Are there any Integeranimation class? Or doing it in a different manner.
I'm not interested in static animations, but event-driven (preferably
programmatic) animations.
public static void Swap(UIElement ui1, UIElement ui2, double seconds)
{
var z2 = (int)ui1.GetValue(Canvas.ZIndexProperty);
var z3 = (int)ui2.GetValue(Canvas.ZIndexProperty);
DoubleAnimation da1 = new DoubleAnimation();
DoubleAnimation da2 = new DoubleAnimation();
Duration d = new Duration(TimeSpan.FromSeconds(seconds));
da1.Duration = d;
da2.Duration = d;
Storyboard sb = new Storyboard();
Storyboard.SetTarget(da1, ui1);
Storyboard.SetTarget(da2, ui2);
Storyboard.SetTargetProperty(da1, new PropertyPath("(Canvas.ZIndex)"));
Storyboard.SetTargetProperty(da2, new PropertyPath("(Canvas.ZIndex)"));
sb.Duration = d;
sb.Children.Add(da1);
sb.Children.Add(da2);
da1.To = (double)z3;
da2.To = (double)z2;
sb.Begin();
}
private void Btn1_Click_1(object sender, RoutedEventArgs e)
{
var z2 = (int)Image2.GetValue(Canvas.ZIndexProperty);
var z3 = (int)Image3.GetValue(Canvas.ZIndexProperty);
Swap(Image2, Image3, 3);
}
You can animate discreet values using ObjectAnimationUsingKeyFrames with DiscreteObjectKeyFrame.
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Canvas.ZIndex)" Storyboard.TargetName="MyObject">
<DiscreteObjectKeyFrame KeyTime="0" Value="250"/>
</ObjectAnimationUsingKeyFrames>
or you can do it in code.
You can't animate an int property. Think about what it would actually mean.
What might come close (visually) is animating the Opacity. And maybe change a Zindex at an animation-complete event.
I have some xaml like this:
<UserControl.Resources>
<Storyboard x:Name="sbLogo" x:Key="onLoadeducLogo" Completed="sbLogo_Completed">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="image">
<LinearDoubleKeyFrame x:Name="pauseKeyFrame" KeyTime="0:0:2" Value="0"/>
<LinearDoubleKeyFrame x:Name="fadeInKeyFram" KeyTime="0:0:6" Value="1"/>
<LinearDoubleKeyFrame x:Name="fadeOutKeyFrame" KeyTime="0:0:12" Value="0"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</UserControl.Resources>
What I'd like to do is update the KeyTime values of the LinearDoubleKeyFrame elements from the UserControl code behind in C#.
I thought maybe I could do this by referencing those elements by their x:Name but I'm not having much success. I also thought maybe I could bind the values to a field in the code behind, but no success there either.
Has anyone got any clues to push me in the right direction.
Thanks
Phil
How have you tried to reference the LinearDoubleKeyFrame objects in code?
I think you need to do something like:
var storyboard = (Storyboard)FindResource("onLoadeducLogo");
var animation = (DoubleAnimationUsingKeyFrames)storyboard.Children[0];
var keyframe1 = animation.KeyFrames[0];
keyframe1.KeyTime = KeyTime.FromTimeSpan(new TimeSpan(0,0,0,1)); // 1 second
Image creatureImage = new Image();
Storyboard fadeInFadeOut = new Storyboard();
DoubleAnimationUsingKeyFrames dbAnimation = new DoubleAnimationUsingKeyFrames();
dbAnimation.Duration = TimeSpan.FromSeconds(2);
LinearDoubleKeyFrame lDKF1 = new LinearDoubleKeyFrame();
lDKF1.Value = 1;
lDKF1.KeyTime = TimeSpan.FromSeconds(0);
dbAnimation.KeyFrames.Add(lDKF1);
//
LinearDoubleKeyFrame lDKF2 = new LinearDoubleKeyFrame();
lDKF2.Value = 0.6;
lDKF2.KeyTime = TimeSpan.FromSeconds(0.5);
dbAnimation.KeyFrames.Add(lDKF2);
//
LinearDoubleKeyFrame lDKF3 = new LinearDoubleKeyFrame();
lDKF3.Value = 1;
lDKF3.KeyTime = TimeSpan.FromSeconds(0.5);
dbAnimation.KeyFrames.Add(lDKF3);
//
LinearDoubleKeyFrame lDKF4 = new LinearDoubleKeyFrame();
lDKF4.Value = 0;
lDKF4.KeyTime = TimeSpan.FromSeconds(1);
dbAnimation.KeyFrames.Add(lDKF4);
Storyboard.SetTarget(dbAnimation, creatureImage);
Storyboard.SetTargetProperty(dbAnimation, new PropertyPath(Image.OpacityProperty));
fadeInFadeOut.Children.Add(dbAnimation);