从底部旋转边框

Rotate border from bottom

我想旋转一个边框但是旋转是从边框的中间开始的,我想从边框的末端开始旋转就像时钟绕着一个圈旋转

这是我的代码:

<ed:Arc
    StartAngle="0" EndAngle="360" Stretch="None" 
            Height="300" Width="300" StrokeThickness="20"
            StrokeDashArray=".25" Stroke="Turquoise"/>
<Border HorizontalAlignment="Center" CornerRadius="100,100,0,0" RenderTransformOrigin="0,0.5" Height="140" Width="2" BorderBrush="Red" BorderThickness="2">
    <Border.RenderTransform>
        <TransformGroup>
            <ScaleTransform/>
            <SkewTransform/>
            <RotateTransform Angle="40"/>
            <TranslateTransform/>
        </TransformGroup>
    </Border.RenderTransform>
</Border>

左上角:

    <Border .... 
             RenderTransformOrigin="0,0">
        <Border.RenderTransform>
            <RotateTransform Angle="40"/>
        </TextBox.RenderTransform>
    </TextBox>

再举几个例子:
右下角 - RenderTransformOrigin="1,1"
底部中间 - RenderTransformOrigin="0.5,1"

创建绘图时,使用 Canvas 并通过 Canvas.LeftCanvas.Top 属性定位子元素通常很有用。

因此,当您想要转换元素时,您不必处理任何偏移。元素变换可以在它们的“本地”坐标系中计算,就像下面示例中的“时钟指针”线元素之一,它从 (0,0) 到 12 点钟的 (0,-140)位置。

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <Canvas Width="300" Height="300">
        <Ellipse Width="300" Height="300" Stroke="Turquoise"
                 StrokeThickness="20" StrokeDashArray=".25"/>

        <Line Canvas.Left="150" Canvas.Top="150"
              Y2="-140" Stroke="Red" StrokeThickness="2" >
            <Line.RenderTransform>
                <RotateTransform Angle="{Binding Value,
                                         ElementName=angleSlider}"/>
            </Line.RenderTransform>
        </Line>
    </Canvas>

    <Slider x:Name="angleSlider" Grid.Row="1" Width="200" Maximum="360"/>
</Grid>