locked
Coding help for rotating the rectangle in verticle direction RRS feed

  • Question

  • Hi,

          I want to rotate the Rectangle in Vertical Direction for 360 degree while dragging the rectangle. Can any one help me in this with coding.

     

    Thanks

    Tuesday, September 16, 2008 12:22 AM

Answers

  • Hi,

     You can try this by changing ScaleX and ScaleY.

    Check this 1..

    Write in Codebehind To Begin this StoryBoard.

    Let me know if you have any Query....

    <UserControl.Resources>

    <Storyboard x:Name="Storyboard1">

    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="myRect" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)">

    <SplineDoubleKeyFrame KeyTime="00:00:01" Value="360"/>

    </DoubleAnimationUsingKeyFrames>

    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="myRect" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)">

    <SplineDoubleKeyFrame KeyTime="00:00:01" Value="1"/>

    </DoubleAnimationUsingKeyFrames>

    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="myRect" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)">

    <SplineDoubleKeyFrame KeyTime="00:00:01" Value="0"/>

    </DoubleAnimationUsingKeyFrames>

    </Storyboard>

    </UserControl.Resources>

    <Grid x:Name="LayoutRoot" Background="White">

    <Rectangle x:Name="myRect" Height="50" Width="50" Fill="AliceBlue" Stroke="Aqua" RenderTransformOrigin="0.5,0.5">

    <Rectangle.RenderTransform>

    <TransformGroup>

    <ScaleTransform/>

    <SkewTransform />

    <RotateTransform />

    <TranslateTransform/>

    </TransformGroup>

    </Rectangle.RenderTransform>

     

    </Rectangle>

    </Grid>

    </UserControl>

    Tuesday, September 16, 2008 12:35 AM

All replies

  • Hi,

     You can try this by changing ScaleX and ScaleY.

    Check this 1..

    Write in Codebehind To Begin this StoryBoard.

    Let me know if you have any Query....

    <UserControl.Resources>

    <Storyboard x:Name="Storyboard1">

    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="myRect" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)">

    <SplineDoubleKeyFrame KeyTime="00:00:01" Value="360"/>

    </DoubleAnimationUsingKeyFrames>

    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="myRect" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)">

    <SplineDoubleKeyFrame KeyTime="00:00:01" Value="1"/>

    </DoubleAnimationUsingKeyFrames>

    <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="myRect" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)">

    <SplineDoubleKeyFrame KeyTime="00:00:01" Value="0"/>

    </DoubleAnimationUsingKeyFrames>

    </Storyboard>

    </UserControl.Resources>

    <Grid x:Name="LayoutRoot" Background="White">

    <Rectangle x:Name="myRect" Height="50" Width="50" Fill="AliceBlue" Stroke="Aqua" RenderTransformOrigin="0.5,0.5">

    <Rectangle.RenderTransform>

    <TransformGroup>

    <ScaleTransform/>

    <SkewTransform />

    <RotateTransform />

    <TranslateTransform/>

    </TransformGroup>

    </Rectangle.RenderTransform>

     

    </Rectangle>

    </Grid>

    </UserControl>

    Tuesday, September 16, 2008 12:35 AM
  • I will suggest you to use following code.

    Define your rectangle as:

    <Rectangle

    x:Name="myRectangle"

     Fill="Red" RenderTransformOrigin=".5,.5" >

    <Rectangle.RenderTransform>

    <RotateTransform Angle="45" CenterX=".5" CenterY=".5" />

    </Rectangle.RenderTransform>

    </Rectangle>

    You can see the Angle property in RotateTransform tag. While dragging the rectangle keep incrementing the angle.

    Now in the mouse move event write following code.

     

    RotateTransform rectTransform=(RotateTransform)myRectangle.RenderTransform;

    rectTransform.Angle += 5;

     

     

    If this answers your question, Please mark as answered.

    Thanks & Regards

    Nirav Patel, Pune

     

    Tuesday, September 16, 2008 1:10 AM
  • Thanks,

      nirav_2052003  actually you are rotating it in x direction (Horiz) but i want to rotatit in Vertical direction With Y axis.

    Tuesday, September 16, 2008 3:43 AM