rotation animation dynamcially using x and y coordinates for game

    General discussion

  • hello there,

    i have been googling and searching many forms to fix the issue that i have in my code. what am trying to find is the angle and apply rotation transformation to a rectangle or gun. the code only for the first time. width and height of the page is 300 and 300 my control is placed at the center of the page. if the user places cursor we have to calcuate the angle based on x and y coordinates and apply rotation to the gun so that it rotates at an angle. here is the code which i have tried. could can one of ye find out what is wrong, am using expression blend 4. thx inadvance.

    using System;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Documents;
    using System.Windows.Ink;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Animation;
    using System.Windows.Shapes;

    namespace Game
        public partial class MainPage : UserControl
            double lastAngle ;
            public MainPage()
                // Required to initialize variables
                this.Loaded += new RoutedEventHandler(MainPage_Loaded);
                this.MouseMove += new MouseEventHandler(MainPage_MouseMove);

            void MainPage_Loaded(object sender, RoutedEventArgs e)

            void MainPage_MouseMove(object sender, MouseEventArgs e)
                double newAngle;
                RotateTransform rotate = new RotateTransform();
                double xMouse = e.GetPosition(null).X;
                double yMouse = e.GetPosition(null).Y;
                lblXaxis.Content = "X=" + xMouse;
                lblYaxis.Content = "Y=" + yMouse;
                double xAxis;
                double yAxis;
                xAxis = xMouse - 150;
                yAxis = (yMouse - 150)*-1;
                lblYRAixs.Content ="YR=" + yAxis;
                lblXRAxis.Content = "XR=" + xAxis;
                newAngle = Math.Atan(yAxis / xAxis) / (Math.PI / 180);
                lblAngle.Content = newAngle;

                //storyboard animation

                Storyboard sbsample = new Storyboard();
                DoubleAnimationUsingKeyFrames xaxis = new DoubleAnimationUsingKeyFrames();
                Storyboard.SetTargetName(xaxis, "verticalLine");
                xaxis.BeginTime = new TimeSpan(0, 0, 0);
                EasingDoubleKeyFrame kf = new EasingDoubleKeyFrame();
                kf.KeyTime = KeyTime.FromTimeSpan(TimeSpan.FromSeconds(1));
                kf.Value = newAngle;
                xaxis.SetValue(Storyboard.TargetPropertyProperty, new PropertyPath("(UIElement.RenderTransform).(CompositeTransform.Rotation)"));
                LayoutRoot.Resources.Add("sbsample", sbsample);
                //lastAngle = newAngle;

                rotate.Angle = newAngle;
                btnSample.RenderTransform = rotate;



    Saturday, March 10, 2012 9:42 AM

All replies

  • Hi reddy_17,

    In order to resolve your issue, could you provide the code in the .xaml? If it is possible, could you explain what's issue you get?  That will help us to reproduce your issue. Thank you for your support.

    Best wishes,

    Monday, March 12, 2012 4:32 AM
  • well thank you for ur reply catherine. thx xaml is below.

        xmlns:sdk="" mc:Ignorable="d"
        Width="300" Height="300" Loaded="UserControl_Loaded">
        <Grid x:Name="LayoutRoot" Background="#FFE1E1E1">
            <Path x:Name="verticalLine" Data="M135.25,108.25 L135.25,193.39693" HorizontalAlignment="Left" Margin="150,65.353,0,150" Stretch="Fill" Stroke="#FF002CFF" UseLayoutRounding="False" Width="1" RenderTransformOrigin="0.5,1" d:LayoutOverrides="Height"/>
            <Rectangle x:Name="horizontalLine" Fill="Black" Height="1" VerticalAlignment="Center" StrokeThickness="0" d:LayoutOverrides="HorizontalAlignment" RenderTransformOrigin="0.5,0.5"/>
            <sdk:Label x:Name="lblXaxis" HorizontalAlignment="Right" Margin="0,8,94,276" />
            <sdk:Label x:Name="lblYaxis" HorizontalAlignment="Right" Margin="0,0,94,257" VerticalAlignment="Bottom" />
            <sdk:Label x:Name="lblYRAixs" HorizontalAlignment="Right" Margin="0,0,94,241" VerticalAlignment="Bottom" />
            <sdk:Label x:Name="lblXRAxis" HorizontalAlignment="Right" Margin="0,58,94,226" />
            <sdk:Label x:Name="lblAngle" HorizontalAlignment="Right" Margin="0,8,183,276" />

    am planning to develop small game, so first requirement is whenever user move cursor we need to find out the angle based on the x and y coordinates. so that we can move tank or gun control at angle to fire bullets. the code which i have used in MainPage.xaml.cs will for the 1st quadrant( 0 to 90 degrees). the below link i have been following. could you please help me. thank you again.

    Monday, March 12, 2012 1:29 PM
  • Hi reddy_17,

    Thank you for your reply.  When I try to reproduce your issue,  I can't find verticalLine and btnSample.  In order to resolve your issue, could you simple your project and upload it to Skydrive?  Then provide the link. I want to test it locally.

    Thank you for your support!

    Wednesday, March 14, 2012 5:21 AM
  • First of all i want to thank you catherine the way ye have shown interest to resolve the issue.

    am sharing the link!115&parid=523BDBF2D068CF86!114&authkey=!AExNqgRMlmDJ7AY

    Thank you


    Wednesday, March 14, 2012 10:30 AM