wpfxamlwin-universal-apprendertransform

Changing the angle of a UIElement

I have this code:

RotateTransform transform = myImage.RenderTransform as RotateTransform;
transform.Angle = 25.0;
myImage.RenderTransform = transform;

Which sets the Angle of my Image element.. It works, however it doesn't move much as I expected.

I was just wondering as to whether the Angle is set on the basis of the right hand corner of the image? So, does it rotate the image 25 degrees from the right hand side of the image?

Solution

  • The angle of rotation is 360 degrees clockwise. This means 25 degrees moves it, practically speaking, to around 1 o'clock. If you wanted to point to the right, it would be 90 degrees. Straight down would be 180 degrees.

    enter image description here

    Make sense? Look at this:

    enter image description here

    Here's some code to help you test:

    <StackPanel Width="200" Margin="0,50">
    <Grid Width="100" Height="100" Background="SteelBlue" RenderTransformOrigin=".5,.5">
        <UIElement.RenderTransform>
            <RotateTransform Angle="{Binding Value, ElementName=MySlider}" />
        </UIElement.RenderTransform>
        <Line HorizontalAlignment="Center" VerticalAlignment="Top"
                Stroke="Goldenrod" StrokeThickness="4"
                X1="2" X2="2"
                Y1="0" Y2="40" />
        <TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="White">
            <Run Text="{Binding Value, ElementName=MySlider}" />
            <Run Text="degrees" />
        </TextBlock>
    </Grid>
    <Slider x:Name="MySlider" Maximum="360" Minimum="0" Value="25" />
</StackPanel>

    Be sure and notice that RenderTransformOrigin=".5,.5" bit. That is going to be really important to you because it determines where the rotation axis is. The values are from 0 to 1. So 0,0 is basically top/left and 1,1 is bottom/right. That makes .5,.5 smack in the middle.

    Best of luck!