Develop Reference

Using DoubleAnimation code behind in WinRT (XAML)

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();

Slide image diagonally in windows phone 8

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

WPF : Can I Animate Grid.Background in code?

My Code is like this.
I want to create Grid dynamically.
creation is success, but I can't animate it's color.
What is my mistake?
Grid[] grid = new Grid[99];
for (int i = 0; i < 10; i++) {
grid[i] = new Grid();
grid[i].Width = grid[i].Height = 100;
grid[i].Background = Brushes.WhiteSmoke;
Storyboard sb = new Storyboard();
ColorAnimation ca = new ColorAnimation(Colors.DarkTurquoise, TimeSpan.FromMilliseconds(250));
Storyboard.SetTarget(ca, grid[i]);
Storyboard.SetTargetProperty(ca, new PropertyPath("Fill.Color"));
sb.Children.Add(ca);
grid[i].MouseEnter += delegate(object sender2, MouseEventArgs e2) {
sb.Begin(this);
};
stackMain.Children.Add(grid[i]);
}

WPF Grid has no Fill property you will have to use Background
Storyboard.SetTargetProperty(ca, new PropertyPath("Background.Color"));

In addition to what sa_ddam has said, you would also have to create a Brush, since the built-in brushes (like Brushes.WhiteSmoke in your example) can't be animated.
grid[i].Background = new SolidColorBrush(Colors.WhiteSmoke);
...
Storyboard.SetTargetProperty(ca, new PropertyPath("Background.Color"));
It might also save some code if you omit the Storyboard and run the animation directly:
var brush = new SolidColorBrush(Colors.WhiteSmoke);
grid[i].Background = brush;
var ca = new ColorAnimation(Colors.DarkTurquoise, TimeSpan.FromMilliseconds(250));
grid[i].MouseEnter +=
(o, e) => brush.BeginAnimation(SolidColorBrush.ColorProperty, ca);

only the first listpicker opens windows phone

I am using Windows Phone Toolkit - Nov 2011 (7.1 SDK) and I want to display multiple listpickers each
within a grid and each grid in a listbox. The problem is, only the first listpicker pops open and the rest don't. secondly how do I customize the full mode page of the listpicker to be displayed exclusively in Landscape orientation and set the page's "shell:SystemTray.IsVisible" to false.
Sorry I couldn't post a screenshot. error "Earn more than 10 reputation to post images".
Thanks
public MainPage()
{
InitializeComponent();
for (int g = 0; g < 10; g++)
{
// Define the margins template dor elements
Thickness elemThick = new Thickness();
// Create the Grid that will hold all the elements of a single entry
Grid entryGrd = new Grid();
entryGrd.VerticalAlignment = VerticalAlignment.Top;
entryGrd.HorizontalAlignment = HorizontalAlignment.Left;
elemThick.Left = 0;
elemThick.Bottom = 0;
elemThick.Right = 0;
elemThick.Top = 0;
entryGrd.Margin = elemThick;
entryGrd.Tag = lstbxPH.Items.Count;
// Setup the backgound value of the letBoder element
LinearGradientBrush elemLGB = new LinearGradientBrush();
elemLGB.EndPoint = new Point(0.5, 1);
elemLGB.StartPoint = new Point(0.5, 0);
GradientStop AquamarineGS = new GradientStop();
AquamarineGS.Color = Color.FromArgb(255, 127, 255, 212);
AquamarineGS.Offset = 0;
GradientStop greenLikeGS = new GradientStop();
greenLikeGS.Color = Color.FromArgb(255, 101, 250, 193);
greenLikeGS.Offset = 0.988;
elemLGB.GradientStops.Add(AquamarineGS);
elemLGB.GradientStops.Add(greenLikeGS);
// Draw the letter
for (int x = 0; x < 9; x++)
{
Border letBoder = new Border();
letBoder.Width = 53;
letBoder.Height = 51;
letBoder.VerticalAlignment = VerticalAlignment.Top;
letBoder.HorizontalAlignment = HorizontalAlignment.Left;
elemThick.Left = x * 60 + 71;
elemThick.Top = lstbxPH.Items.Count * 1 + 20;
letBoder.Margin = elemThick;
letBoder.Background = elemLGB;
// The Texblock
TextBlock let = new TextBlock();
let.VerticalAlignment = VerticalAlignment.Center;
let.HorizontalAlignment = HorizontalAlignment.Center;
let.FontSize = 25;
let.FontWeight = FontWeights.Bold;
let.Foreground = new SolidColorBrush(Color.FromArgb(200, 255, 255, 255));
let.Text = x.ToString();
let.Tag = x;
letBoder.Child = let;
entryGrd.Children.Add(letBoder);
}
// Draw the List picker element for the draw types
ListPicker DType = new ListPicker();
DType.Width = 48;
DType.VerticalAlignment = VerticalAlignment.Top;
DType.HorizontalAlignment = HorizontalAlignment.Left;
DType.Background = new SolidColorBrush(Color.FromArgb(200, 255, 255, 255));
DType.BorderBrush = new SolidColorBrush(Color.FromArgb(200, 255, 255, 255));
elemThick.Left = 17;
elemThick.Top = lstbxPH.Items.Count * 1 + 10;
DType.Margin = elemThick;
DType.FontSize = 18;
ListPickerItem item1 = new ListPickerItem() { Content = "A" };
ListPickerItem item2 = new ListPickerItem() { Content = "B" };
ListPickerItem item3 = new ListPickerItem() { Content = "C" };
DType.Items.Add(item1);
DType.Items.Add(item2);
DType.Items.Add(item3);
entryGrd.Children.Add(DType);
if (lstbxPH.Items.Count != 0)
{
// The delete button and related image
Button btnDel = new Button();
btnDel.Height = 65;
btnDel.Width = 60;
btnDel.Tag = lstbxPH.Items.Count;
btnDel.VerticalAlignment = VerticalAlignment.Top;
btnDel.HorizontalAlignment = HorizontalAlignment.Left;
btnDel.VerticalContentAlignment = VerticalAlignment.Top;
btnDel.HorizontalContentAlignment = HorizontalAlignment.Left;
elemThick.Left = 600;
elemThick.Top = lstbxPH.Items.Count + 13;
btnDel.Margin = elemThick;
elemThick.Left = 0;
elemThick.Bottom = 0;
elemThick.Right = 0;
elemThick.Top = 0;
btnDel.Name = "btnDel";
btnDel.Padding = elemThick;
btnDel.BorderBrush = new SolidColorBrush(Color.FromArgb(0, 0, 0, 0));
Image imgDel = new Image();
imgDel.Source = new BitmapImage(new Uri("/appbar.delete.rest.png", UriKind.RelativeOrAbsolute));
imgDel.VerticalAlignment = VerticalAlignment.Top;
imgDel.HorizontalAlignment = HorizontalAlignment.Left;
imgDel.Height = 35;
imgDel.Width = 30;
elemThick.Left = 0;
elemThick.Bottom = 0;
elemThick.Right = 0;
elemThick.Top = 0;
imgDel.Margin = elemThick;
imgDel.Stretch = Stretch.UniformToFill;
btnDel.Content = imgDel;
entryGrd.Children.Add(btnDel);
}
// Add the grid with to the list box
this.lstbxPH.Items.Add(entryGrd);
}
}

This issue was actually solved by the Windows Phone Toolkit - Nov 2011 (7.1 SDK).
Here is how I worked it out.
Download the November release of the toolkit http://silverlight.codeplex.com/releases/view/75888
if you had a previous release of the toolkit installed, please uninstall it and unreferenced the tool kit on you project
Install the November release of the toolkit
Reference the toolkit on your project, debug and boom! it woks.

How to call Binding function from a method?

I have a Slider Binded to the ScaleX of a Line, like the following code:
/* Graphics on Canvas */
Line lR = new Line();
lR.X1 = 0;
lR.Y1 = 0;
lR.X2 = 150;
lR.Y2 = 150;
lR.Stroke = new SolidColorBrush(Colors.Blue);
lR.StrokeThickness = 2;
/* declare ScaleTransformation */
ScaleTransform lRSt = new ScaleTransform();
TransformGroup lRTran = new TransformGroup();
lRTran.Children.Add(lRSt);
lR.RenderTransform = lRTran;
Binding sliderRBind1 = new Binding();
sliderRBind1.Source = sliderR;
sliderRBind1.Path = new PropertyPath("Value");
BindingOperations.SetBinding(lRSt, ScaleTransform.ScaleXProperty, sliderRBind1);
BindingOperations.SetBinding(lRSt, ScaleTransform.ScaleYProperty, sliderRBind1);
/* Slider - Slider should be placed outside the canvas to prevent being redrawn */
Slider sliderR = new Slider();
sliderR.Minimum = 1;
sliderR.Maximum = 3;
sliderR.Value = 1;
sliderR.TickPlacement = TickPlacement.BottomRight;
sliderR.TickFrequency = 0.2;
sliderR.IsSnapToTickEnabled = true;
Code works fine. But if I move the ScaleTransform to a method, the Binding is lost.
/* Graphics on Canvas */
Line lR = new Line();
lR.X1 = 0;
lR.Y1 = 0;
lR.X2 = 150;
lR.Y2 = 150;
lR.Stroke = new SolidColorBrush(Colors.Blue);
lR.StrokeThickness = 2;
/* declare ScaleTransformation */
ScaleTransform lRSt = new ScaleTransform();
TransformGroup lRTran = new TransformGroup();
lRTran.Children.Add(lRSt);
lR.RenderTransform = lRTran;
LineSliderR(lR);
/* Slider - Slider should be placed outside the canvas to prevent being redrawn */
Slider sliderR = new Slider();
sliderR.Minimum = 1;
sliderR.Maximum = 3;
sliderR.Value = 1;
sliderR.TickPlacement = TickPlacement.BottomRight;
sliderR.TickFrequency = 0.2;
sliderR.IsSnapToTickEnabled = true;
public void LineSliderR(Line lRSt)
{
Binding sliderRBind1 = new Binding();
sliderRBind1.Source = sliderR;
sliderRBind1.Path = new PropertyPath("Value");
BindingOperations.SetBinding(lRSt, ScaleTransform.ScaleXProperty, sliderRBind1);
BindingOperations.SetBinding(lRSt, ScaleTransform.ScaleYProperty, sliderRBind1);
}
Why did the Binding fail if it's called to a separate method?
The two codes are (to me) identical. Both contain four same, identical, "things":
a Line, a ScaleTransform, a Binding, and a Slider.
The first code has all 4 "things" in a function. The second code has the Binding call from a separate function. Both compiles without error: However, the Binding (between Line and Slider) works OK on the first code, but not the second. I am trying get the second code to work because I have many Line's and I don't want to repeat myself.

In your second code block, inside the method LineSliderR, lRSt is an object of type Line, while in your first block it is of type ScaleTransform.
If you want your second block to behave like the first, your method LineSliderR, should accept a ScaleTransform' as parameter:
public void LineSliderR(ScaleTransform lRSt)