Rotate a WPF Canvas derived component using code behind - c#

I'm wanting to make a component that inherits from rotate canvas using a storyboard. But when I try nothing happens.
Eventually I also want to dynamically change the speed of rotation to a stop. But first, i need rotate the componente.
This is the code for the component:
class MyToy : Canvas
{
public MyToy()
{
this.Background = System.Windows.Media.Brushes.Green;
this.Width = 300;
this.Height = 300;
Polyline poly = new Polyline();
poly.Points.Add(new Point(25, 25));
poly.Points.Add(new Point(0, 50));
poly.Points.Add(new Point(25, 75));
poly.Points.Add(new Point(50, 50));
poly.Points.Add(new Point(25, 25));
poly.Points.Add(new Point(25, 0));
poly.Stroke = System.Windows.Media.Brushes.Blue;
poly.StrokeThickness = 10;
this.Children.Add(poly);
Canvas.SetLeft(poly, 120);
Canvas.SetTop(poly, 120);
}
}
the window xaml code is:
<Window x:Class="WpfApplication1.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="500" Width="500">
<Canvas x:Name="myCanvas">
<Button Canvas.Left="0" Canvas.Top="0" Content="Rotate" Height="23" Name="button1" Width="111" Click="button1_Click" />
</Canvas>
</Window>
And finaly, the code behind, where i create the storyboard is:
public partial class Window1 : Window
{
MyToy myToy;
RotateTransform transform;
public Window1()
{
InitializeComponent();
myToy = new MyToy();
transform = new RotateTransform();
// transform.Name = "MyToy1Transform";
myToy.RenderTransform = transform;
// this.RegisterName(transform.Name, transform);
myToy.Name = "MyToy1";
this.RegisterName("MyToy1", myToy);
myCanvas.Children.Add(myToy);
Canvas.SetTop(myToy, 50);
Canvas.SetLeft(myToy, 50);
}
private void button1_Click(object sender, RoutedEventArgs e)
{
DoubleAnimation ani = new DoubleAnimation();
ani.From = 0;
ani.To = 359;
ani.AutoReverse = true;
ani.RepeatBehavior = RepeatBehavior.Forever;
ani.Duration = new Duration(TimeSpan.FromSeconds(2));
Storyboard story = new Storyboard();
story.Children.Add(ani);
// Storyboard.SetTargetName(ani, myToy.Name);
Storyboard.SetTarget(ani, transform);
Storyboard.SetTargetProperty(ani, new PropertyPath(RotateTransform.AngleProperty));
story.Begin(this);
}
}
thanks for any help.

The target of your animation is a MyToy object and your target property is Angle. MyToy doesn't have an angle property though. Solution: Set the RenderTransform (or LayoutTransform) property of MyToy to be a new RotateTransform object. Then use that object (which has the Angle property) as the target of the animation.

Related

Animation of 3d object loaded programmatically, the storyboard not start with begin

I am unable to run the animation. I searched the web and on the website, I did hours of changes but the storyboard does not start. I will not use BeginAnimation. I hope that my problem can also serve to someone else to understand the Storyboard.
enter code here
using HelixToolkit.Wpf;
using System;
using System.Windows;
using System.Windows.Media.Animation;
using System.Windows.Media.Media3D;
namespace test_storyboard_02
{
public partial class MainWindow : Window
{
public Storyboard myStoryboard = new Storyboard();
Model3DGroup cubelet;
public MainWindow()
{
InitializeComponent();
}
private void Window_Loaded(object sender, RoutedEventArgs e)
{
LoadObj();
view1.ZoomExtents();
FrameworkContentElement element = new FrameworkContentElement();
NameScope.SetNameScope(element, new NameScope());
AxisAngleRotation3D rotation = new AxisAngleRotation3D(new Vector3D(0, 0, 1), 180);
RotateTransform3D myRotateTransform3D = new RotateTransform3D(rotation, new Point3D(0, 0, 0));
cubelet.Transform = myRotateTransform3D;
element.RegisterName("rotation", rotation);
DoubleAnimation animation = new DoubleAnimation();
animation.By = 5;
animation.Duration = TimeSpan.FromSeconds(0);
Storyboard.SetTarget(animation, rotation);
Storyboard.SetTargetProperty(animation, new PropertyPath("Angle"));
myStoryboard.Children.Add(animation);
myStoryboard.Duration = TimeSpan.FromSeconds(4);
myStoryboard.Begin(element, HandoffBehavior.Compose);
}
private void LoadObj()
{
view1.Children.Clear();
//cubelets = new Model3DGroup[1, 1, 1];
cubelet = new Model3DGroup();
ModelImporter importer = new ModelImporter();
Model3D ModelCube = importer.Load(#"e:\x.obj");
cubelet.Children.Add(ModelCube);
view1.Children.Add(new ModelVisual3D { Content = cubelet });
}
}
}
There are problems in these lines of code :
FrameworkContentElement element = new FrameworkContentElement();
NameScope.SetNameScope(element, new NameScope());
...
element.RegisterName("rotation", rotation);
Changes :
NameScope scope = new NameScope();
FrameworkContentElement element = new FrameworkContentElement();
NameScope.SetNameScope(element, scope);
...
element.RegisterName("rotation", scope);
See this solves your problem.
This is the xaml file that I used.
<Window x:Class="test_storyboard_02.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:test_storyboard_02"
xmlns:HelixToolkit="clr-namespace:HelixToolkit.Wpf;assembly=HelixToolkit.Wpf"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525" Loaded="Window_Loaded">
<Grid>
<Canvas Name="LayoutRoot" HorizontalAlignment="Left" Height="319" VerticalAlignment="Top" Width="517">
<HelixToolkit:HelixViewport3D x:Name="view1" Background="Gray" Height="278" Canvas.Left="25" Canvas.Top="22" Width="463">
<HelixToolkit:DefaultLights/>
<!--<local:RubikCube x:Name="cube1" /> -->
</HelixToolkit:HelixViewport3D>
</Canvas>
</Grid>
SOLVED Finally the program WORKS, thanks to #AnjumSKhan. I hope that the code that I enclose will also serve to someone else. Thanks also to stackoverflow.
MainWindow.xaml
<Window x:Class="test_storyboard_02.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:test_storyboard_02"
xmlns:HelixToolkit="clr-namespace:HelixToolkit.Wpf;assembly=HelixToolkit.Wpf"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525" Loaded="Window_Loaded">
<Window.Resources>
</Window.Resources>
<Grid>
<Canvas Name="LayoutRoot" HorizontalAlignment="Left" Height="319" VerticalAlignment="Top" Width="517">
<HelixToolkit:HelixViewport3D x:Name="view1" Background="Gray" Height="278" Canvas.Left="25" Canvas.Top="22" Width="463">
<HelixToolkit:DefaultLights/>
<!--<local:RubikCube x:Name="cube1" /> -->
</HelixToolkit:HelixViewport3D>
</Canvas>
</Grid>
MainWindow.xaml.cs
using HelixToolkit.Wpf;
using System;
using System.Windows;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Media.Media3D;
using System.Windows.Shapes;
namespace test_storyboard_02
{
public partial class MainWindow : Window
{
public Storyboard myStoryboard = new Storyboard();
public Model3DGroup MainModel3Dgroup = new Model3DGroup();
Model3DGroup modelFloor;
public MainWindow()
{
InitializeComponent();
}
private void Window_Loaded(object sender, RoutedEventArgs e)
{
LoadObj();
view1.ZoomExtents();
NameScope scope = new NameScope();
FrameworkContentElement element = new FrameworkContentElement();
NameScope.SetNameScope(element, scope);
// Create a box that will be the target
// of the animation.
// Material material = HelixToolkit.Wpf.MaterialHelper.CreateMaterial(Colors.DarkBlue);
// MeshBuilder meshBuilder = new MeshBuilder();
// meshBuilder.AddBox(new Point3D(0, 0, 0), 200, 200, 200);
// GeometryModel3D modelFloor = new GeometryModel3D(meshBuilder.ToMesh(), material);
// modelFloor.SetName("floor");
// MainModel3Dgroup.Children.Add(modelFloor);
var lights = new DefaultLights();
view1.Children.Add(lights);
ModelVisual3D model_visual = new ModelVisual3D();
model_visual.Content = modelFloor;
view1.Children.Add(model_visual);
view1.ZoomExtents();
AxisAngleRotation3D rotation = new AxisAngleRotation3D(new Vector3D(0, 0, 1), 0);
RotateTransform3D myRotateTransform3D = new RotateTransform3D(rotation, new Point3D(0, 0, 0));
modelFloor.Transform = myRotateTransform3D;
element.RegisterName("rotation", rotation);
// Create two DoubleAnimations and set their properties.
DoubleAnimation animation = new DoubleAnimation();
animation.From = 0;
animation.To = 200;
animation.Duration = TimeSpan.FromSeconds(2);
Storyboard.SetTargetProperty(animation, new PropertyPath("Angle"));
Storyboard.SetTargetName(animation, "rotation");
myStoryboard.Children.Add(animation);
myStoryboard.Duration = TimeSpan.FromSeconds(2);
// Make the Storyboard a resource.
this.Resources.Add("unique_id1", myStoryboard);
myStoryboard.Begin(element, HandoffBehavior.Compose);
}
private void LoadObj()
{
view1.Children.Clear();
modelFloor = new Model3DGroup();
ModelImporter importer = new ModelImporter();
Model3D ModelCube = importer.Load(#"e:\x.obj");
modelFloor.Children.Add(ModelCube);
view1.Children.Add(new ModelVisual3D { Content = modelFloor });
}
}
}

How can I add a storyboard animation to my page resources in C#, then call it again later?

HubPage is my landing page. On Hubpage.xaml, I have a grid of 3x3, containing a Rectangle, what I'm calling a "cell". In HubPage.xaml.cs, particularly in the HubPage() constructor, I create a storyboard for each cell:
CreateStoryboardForCell("Column0Row0");
CreateStoryboardForCell("Column0Row1");
...
CreateStoryboardForCell("Column2Row2");
I want to add a storyboard to the Page.Resources, normally I would do it in XAML, but I am attempting it from C#. Now, here is the CreateStoryboardForCell implementation:
private void CreateStoryboardForCell(string cellName)
{
// Create two DoubleAnimations, one for scaleX and one for scaleY, and set their properties.
Duration duration = new Duration(TimeSpan.FromSeconds(0.2));
DoubleAnimation myDoubleAnimation1 = new DoubleAnimation();
DoubleAnimation myDoubleAnimation2 = new DoubleAnimation();
myDoubleAnimation1.Duration = duration;
myDoubleAnimation2.Duration = duration;
Storyboard sb = new Storyboard();
sb.Duration = duration;
sb.Children.Add(myDoubleAnimation1);
sb.Children.Add(myDoubleAnimation2);
// Set the targets of the animations
Storyboard.SetTarget(myDoubleAnimation1, Column0Row0);
Storyboard.SetTarget(myDoubleAnimation2, Column0Row0);
// Set the attached properties of ScaleX and ScaleY
// to be the target properties of the two respective DoubleAnimations
Storyboard.SetTargetProperty(myDoubleAnimation1, "(UIElement.RenderTransform).(CompositeTransform.ScaleX)");
Storyboard.SetTargetProperty(myDoubleAnimation2, "(UIElement.RenderTransform).(CompositeTransform.ScaleY)");
myDoubleAnimation1.To = 15;
myDoubleAnimation2.To = 22;
// Make the Storyboard a resource.
try
{
pageRoot.Resources.Add("story" + cellName, sb);
}
catch (Exception e)
{
Status.Text = "Error adding storyboard resource for cell" + cellName + ": " + e.Message;
}
}
pageRoot is from Hubpage.xaml: Page x:Name="pageRoot", etc. I do not get an exception when adding the resource, but I cannot see the resource when I set the breakpoint, so I assume it was added successfully, as I can see the count increasing, and no exception was thrown.
Moving on, I have a click handler for each column cell, where I infer the row and column number and try to start up the corresponding storyboard added to the page resource earlier. Here is the code:
private void Column1_Cell_Click(object sender, RoutedEventArgs e)
{
Rectangle rect = sender as Rectangle;
int x = (int)rect.GetValue(Grid.RowProperty);
int y = (int)rect.GetValue(Grid.ColumnProperty);
string storyboardName = "storyColumn" + y + "Row" + x;
Storyboard storyboard = (Storyboard)FindName(storyboardName);
storyboard.Begin();
}
but the FindName call always returns a null storyboard. What am I missing here?
I've written this code for you.I hope benefits to business
Here is code:
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="Column0Row0"/>
<ColumnDefinition x:Name="Column0Row1"/>
<ColumnDefinition x:Name="Column0Row2"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Rectangle Fill="Pink" x:Name="rectangle" MouseLeftButtonDown="Rectangle_MouseLeftButtonDown"/>
<Rectangle Grid.Column="1" Grid.Row="1" Fill="Coral" MouseLeftButtonDown="Rectangle_MouseLeftButtonDown"/>
<Rectangle Grid.Column="2" Grid.Row="2" Fill="Orange" MouseLeftButtonDown="Rectangle_MouseLeftButtonDown"/>
</Grid>
Code Behind :
private void CreateStoryboardForCell(Rectangle target)
{
ScaleTransform trans = new ScaleTransform();
target.RenderTransform = trans;
DoubleAnimation anim = new DoubleAnimation(1, 2, TimeSpan.FromMilliseconds(1000));
trans.BeginAnimation(ScaleTransform.ScaleXProperty, anim);
trans.BeginAnimation(ScaleTransform.ScaleYProperty, anim);
}
private void Rectangle_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
CreateStoryboardForCell((Rectangle)sender);
}
Please try this code.I always use this code for finding a storyboard.It works.
Here is code:
FrameworkElement element = new FrameworkElement();
Storyboard sb=new Storyboard ();
sb = element.FindResource("Please write here Storyboard Key") as Storyboard;
sb.Begin(target element name , true);
If BeginStoryboard doesn't support in WinRT.You can use the following code.I created the animation in codedehind.Maybe you can solve the problem like this;I did some research on this problem.
I tried this code.It works
Here is code:
private void Rectangle_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
Storyboard storyboard = new Storyboard();
ScaleTransform scale = new ScaleTransform(1.0, 1.0);
animatedRectangle.RenderTransformOrigin = new Point(0.5, 0.5);
animatedRectangle.RenderTransform = scale;
DoubleAnimation scaleAnimation1 = new DoubleAnimation(1, 2, TimeSpan.FromMilliseconds(1000));
DoubleAnimation scaleAnimation2 = new DoubleAnimation(1, 2, TimeSpan.FromMilliseconds(1000));
storyboard.Children.Add(scaleAnimation1);
storyboard.Children.Add(scaleAnimation2);
Storyboard.SetTargetProperty(scaleAnimation1, new PropertyPath("RenderTransform.ScaleX"));
Storyboard.SetTargetProperty(scaleAnimation2, new PropertyPath("RenderTransform.ScaleY"));
Storyboard.SetTarget(scaleAnimation1, animatedRectangle);
Storyboard.SetTarget(scaleAnimation2, animatedRectangle);
storyboard.Begin();
}

Panel in a panel, autoscroll

I'm doing a minimalist test app after encountering an issue with my real program, using WinForms. I put a small panel (child) inside a bigger panel (parent). The bigger panel has AutoScroll set to true. The child panel has the default Anchors set to Top and Left. The child panel is not docked.
The behavior I want is for scrollbars to appear whenever the smaller panel's location is too offset, either top, bottom, left or right. The problem is that it only works when it's too far right, or too far in the bottom. No scrollbars appear when it's too much in the top or too much in the left directions.
I use two simple buttons to force the child panel's location 200 pixels to the left, or 200 pixels to the right to have a quick way of easily modifying its position.
Here's my Form1() code:
private void button1_Click(object sender, EventArgs e)
{
childPanel.Location = new Point(childPanel.Location.X - 200, childPanel.Location.Y);
hostPanel.Invalidate();
}
private void button2_Click(object sender, EventArgs e)
{
childPanel.Location = new Point(childPanel.Location.X + 200, childPanel.Location.Y);
hostPanel.Invalidate();
}
Here's the designer code:
private void InitializeComponent()
{
this.hostPanel = new System.Windows.Forms.Panel();
this.childPanel = new System.Windows.Forms.Panel();
this.moveChildLeft = new System.Windows.Forms.Button();
this.moveChildRight = new System.Windows.Forms.Button();
this.hostPanel.SuspendLayout();
this.SuspendLayout();
//
// hostPanel
//
this.hostPanel.AutoScroll = true;
this.hostPanel.BackColor = System.Drawing.SystemColors.AppWorkspace;
this.hostPanel.Controls.Add(this.childPanel);
this.hostPanel.Location = new System.Drawing.Point(239, 48);
this.hostPanel.Name = "hostPanel";
this.hostPanel.Size = new System.Drawing.Size(400, 400);
this.hostPanel.TabIndex = 0;
//
// childPanel
//
this.childPanel.BackColor = System.Drawing.SystemColors.ButtonHighlight;
this.childPanel.Location = new System.Drawing.Point(29, 62);
this.childPanel.Name = "childPanel";
this.childPanel.Size = new System.Drawing.Size(342, 259);
this.childPanel.TabIndex = 0;
//
// moveChildLeft
//
this.moveChildLeft.Location = new System.Drawing.Point(61, 81);
this.moveChildLeft.Name = "moveChildLeft";
this.moveChildLeft.Size = new System.Drawing.Size(75, 23);
this.moveChildLeft.TabIndex = 1;
this.moveChildLeft.Text = "Left 200";
this.moveChildLeft.UseVisualStyleBackColor = true;
this.moveChildLeft.Click += new System.EventHandler(this.button1_Click);
//
// moveChildRight
//
this.moveChildRight.Location = new System.Drawing.Point(61, 111);
this.moveChildRight.Name = "moveChildRight";
this.moveChildRight.Size = new System.Drawing.Size(75, 23);
this.moveChildRight.TabIndex = 2;
this.moveChildRight.Text = "Right 200";
this.moveChildRight.UseVisualStyleBackColor = true;
this.moveChildRight.Click += new System.EventHandler(this.button2_Click);
//
// Form1
//
this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 13F);
this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
this.ClientSize = new System.Drawing.Size(1018, 549);
this.Controls.Add(this.moveChildRight);
this.Controls.Add(this.moveChildLeft);
this.Controls.Add(this.hostPanel);
this.Name = "Form1";
this.Text = "Form1";
this.hostPanel.ResumeLayout(false);
this.ResumeLayout(false);
}
Yet - Another Winforms incapability quickly solved by WPF:
XAML:
<Window x:Class="WpfApplication4.Window3"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window3" WindowState="Maximized">
<DockPanel>
<StackPanel DockPanel.Dock="Top" Orientation="Horizontal">
<Button Content="Left" Click="MoveLeft"/>
<Button Content="Right" Click="MoveRight"/>
</StackPanel>
<Border BorderBrush="Blue" BorderThickness="1" Width="300" Height="300">
<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" x:Name="Scr">
<Grid Background="Green" Width="100" Height="100" x:Name="Grid"/>
</ScrollViewer>
</Border>
</DockPanel>
</Window>
Code behind:
using System.Windows;
namespace WpfApplication4
{
public partial class Window3 : Window
{
public Window3()
{
InitializeComponent();
}
private void MoveRight(object sender, RoutedEventArgs e)
{
if (Grid.Margin.Right <= 0)
{
Grid.Margin = new Thickness(Grid.Margin.Left + 100,0,0,0);
}
else
{
Grid.Margin = new Thickness(0, 0, Grid.Margin.Right - 100, 0);
Scr.ScrollToHorizontalOffset(Scr.HorizontalOffset - 100);
}
}
private void MoveLeft(object sender, RoutedEventArgs e)
{
if (Grid.Margin.Left > 0)
{
Grid.Margin = new Thickness(Grid.Margin.Left - 100, 0, 0, 0);
}
else
{
Grid.Margin = new Thickness(0, 0, Grid.Margin.Right + 100, 0);
Scr.ScrollToHorizontalOffset(Scr.HorizontalOffset + 100);
}
}
}
}
Copy and paste my code in a File -> New -> WPF Application and see the results for yourself.
Eventually, you might want to convert your app to WPF. Since, Winform is condemned to a small death.

Animate Grid from one position to another

I have a grid of images and buttons, and I want to animate motion from one position to another (actually a few spaces to the left) automatically, but it hasn't worked. I've tried using a storyboard in xaml and programatically as in the code below, but its now working. Please help!!!
public static void MoveTo(Grid target)
{
Canvas.SetLeft(target, 0);
var top = Canvas.GetTop(target);
var left = Canvas.GetLeft(target);
TranslateTransform trans = new TranslateTransform();
target.RenderTransform = trans;
double newX = (double)(left - 300);
double newY = (double)top;
DoubleAnimation anim1 = new DoubleAnimation(top, -15, TimeSpan.FromSeconds(10));
//DoubleAnimation anim1 = new DoubleAnimation(top, newY - top, TimeSpan.FromSeconds(10));
DoubleAnimation anim2 = new DoubleAnimation(left, newX - left, TimeSpan.FromSeconds(10));
anim1.AutoReverse = true;
anim1.RepeatBehavior = RepeatBehavior.Forever;
trans.BeginAnimation(TranslateTransform.XProperty, anim1);
trans.BeginAnimation(TranslateTransform.YProperty, anim2);
}
totally TranslateTransform isnt good for that you want .better to use thinkness animation
i advise you dont use canavas and change it to grid but if you use canavas use this code
private void Animationsss(Grid grd)
{
//create an animation
DoubleAnimation da = new DoubleAnimation();
//set from animation to start position
//dont forget set canvas.left for grid if u dont u will get error
da.From = Canvas.GetLeft(grd);
//set second position of grid
da.To = -100;
//set duration
da.Duration = new Duration(TimeSpan.FromSeconds(2));
//run animation if u want stop ,start etc use story board
grd.BeginAnimation(Canvas.LeftProperty, da);
}
if you use grid code is this :
private void Animation(Grid grd)
{
ThicknessAnimation ta = new ThicknessAnimation();
//your first place
ta.From = grd.Margin;
//this move your grid 1000 over from left side
//you can use -1000 to move to left side
ta.To = new Thickness(1000, 0, 0, 0);
//time the animation playes
ta.Duration = new Duration(TimeSpan.FromSeconds(10));
//dont need to use story board but if you want pause,stop etc use story board
grd.BeginAnimation(Grid.MarginProperty, ta);
}
you can use opacity animation for fade your grid ... it show good if move and fade !
private void Animationsss(Grid grd)
{
DoubleAnimation da = new DoubleAnimation(1, 0, new Duration(TimeSpan.FromSeconds(2)));
grd.BeginAnimation(Grid.OpacityProperty, da);
}
if there isnt any reason u can change canavas to grid and also better use TranslateTransform for resize controls like code below this code resize control if mouse enter in it :
private void grid1_MouseEnter(object sender, MouseEventArgs e)
{
//at first its normal size
ScaleTransform st = new ScaleTransform(1, 1);
//animation size to 1.25 persent of real size
DoubleAnimation da = new DoubleAnimation(1,1.25, new Duration(TimeSpan.FromSeconds(2)));
//set transform to control
grid1.RenderTransform = st;
//animation transform now From Y And X
st.BeginAnimation(ScaleTransform.ScaleXProperty, da);
st.BeginAnimation(ScaleTransform.ScaleYProperty, da);
}
if you animation for width or height do same work like scale transform :)
hope i can help you ...:))
leave comment for me please
You can also use xaml for this:
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="TestBed.MainWindow"
x:Name="Window"
Title="MainWindow"
Width="640" Height="480">
<Window.Resources>
<Storyboard x:Key="MoveGrid">
<ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Margin)" Storyboard.TargetName="grid">
<EasingThicknessKeyFrame KeyTime="0:0:1" Value="-300,0,0,0"/>
</ThicknessAnimationUsingKeyFrames>
</Storyboard>
</Window.Resources>
<Window.Triggers>
<EventTrigger RoutedEvent="ButtonBase.Click" SourceName="button">
<BeginStoryboard x:Name="MoveGrid_BeginStoryboard" Storyboard="{StaticResource MoveGrid}"/>
</EventTrigger>
</Window.Triggers>
<Canvas>
<Grid x:Name="grid" Height="300" Width="300" Background="Black">
<Button x:Name="button" Content="Move the gird!" Height="30" Margin="10,0" />
</Grid>
</Canvas>
</Window>

restoring image back to same position after tombstoning in WP7

I m using MouseDragElementBehavior in my WP7 application to drag an image down the canvas. I m able to get the coordinates (X,Y positions) after the image dragging. But I want to retain the same image position after tombstoning also.
private void MouseDragElementBehavior_Dragging(object sender, MouseEventArgs e)
{
Point currentPos = e.GetPosition(image1);
if (currentPos.X < 190)
{
double targetOffset = 700;
DoubleAnimation animation = new DoubleAnimation();
animation.EasingFunction = new CircleEase();
animation.Duration = new Duration(new TimeSpan(0, 0, 10));
animation.From = TextScroll.AnimatableOffset;
animation.To = targetOffset;
Storyboard.SetTarget(animation, TextScroll);
Storyboard.SetTargetProperty(animation, new PropertyPath("(AnimatableScrollViewer.AnimatableOffset)"));
Storyboard storyboard = new Storyboard();
storyboard.Children.Add(animation);
storyboard.Begin();
}
App app = (App)Application.Current;
app.current_X = currentPos.X.ToString();
app.current_Y = currentPos.Y.ToString();
TextScroll.AnimatableOffset = -700;
}
I have stored and retrived the values from isolated storage for tombstoning.
private void LoadSettings()
{
var settings = IsolatedStorageSettings.ApplicationSettings;
current_X = settings["Xpos"].ToString();
current_Y = settings["Ypos"].ToString();
}
private void SaveSettings()
{
var settings = IsolatedStorageSettings.ApplicationSettings;
settings.Add("Xpos", current_X);
settings.Add("Ypos",current_Y);
settings.Save();
}
Now I would like to use the values to position the image at the same coordinates as before tombstoning. I dont know how to position the image with the X and Y coordinates provided.
Here is the XAML code where I use the image.
<Canvas Margin="12,0,3,-834" Grid.Row="1">
<Image Height="800" Source="37.jpg" Stretch="Fill" Width="480" Canvas.Left="-11" x:Name="image1">
<i:Interaction.Behaviors>
<el:MouseDragElementBehavior ConstrainToParentBounds="True" Dragging="MouseDragElementBehavior_Dragging" />
</i:Interaction.Behaviors>
</Image>
</Canvas>
First, Point currentPos = e.GetPosition(image1); is getting the position of the mouse relative to the image. Maybe you want to get the position relative to the canvas instead?
Or, you can use this to get the position within the canvas:
canvas1.GetLeft(image1);
canvas1.GetTop(image1);
Then, you can set the position of something within a canvas like this:
canvas1.SetLeft(image1, x);
canvas1.SetTop(image1, y);
To do that, you would need to name your Canvas:
<Canvas x:Name="canvas1" Margin="12,0,3,-834" Grid.Row="1">

Categories

Resources