How to do rotation around control's center in

问题:

I want do rotate button to 90 degrees but it gets clipped because it rotates arount (0,0). How to make it rotate around center if I don't know it't width in pixels (it's a template for many buttons)

回答1:

<Button ...>
  <Button.LayoutTransform>
    <RotateTransform CenterX="0.5" CenterY="0.5" Angle="90"/>
  </Button.LayoutTransform>
</Button>

回答2:

You have to set the control's RenderTransformOrigin to 0.5, 0.5.

ex.:

<Button RenderTransformOrigin="0.5, 0.5">
    <RepeatButton.RenderTransform>
        <RotateTransform Angle="90"/>
    </RepeatButton.RenderTransform>
</RepeatButton>

回答3:

My understanding is that the origin isn't relevant with a LayoutTransform.

MSDN says:

Setting a transform provides powerful capabilities of scaling and rotating. However, LayoutTransform ignores TranslateTransform operations. This is because the layout system behavior for child elements of a FrameworkElement auto-corrects any offsets to the position of a scaled or rotated element into the layout and coordinate system of the parent element.

and the following "correctly" rotates the button.

<Grid ShowGridLines="True">
    <Grid.RowDefinitions>
        <RowDefinition></RowDefinition>
        <RowDefinition Height="Auto"></RowDefinition>
        <RowDefinition></RowDefinition>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition></ColumnDefinition>
        <ColumnDefinition Width="Auto"></ColumnDefinition>
        <ColumnDefinition></ColumnDefinition>
    </Grid.ColumnDefinitions>
    <Button Grid.Row="1" Grid.Column="1">Excessively Long Button Still Ok
        <Button.LayoutTransform>
            <RotateTransform Angle="90" />
        </Button.LayoutTransform>
    </Button>
</Grid>