타원 중심을 중심으로 ArcSegment를 회전하는 방법

Question

두 개의 모양이 있습니다. 하나는 타원이고 다른 하나는 원입니다. 타원의 중심을 중심으로 원을 회전시키고 싶습니다. 여기

<Path Stroke="Indigo" StrokeThickness="3" RenderTransformOrigin="0.5,0.5" 
     Data="M 50 50 A 50 50 0 0 0 42.5 26.2"> 
     <Path.RenderTransform> 
      <RotateTransform Angle="270"/> 
     </Path.RenderTransform> 
</Path> 
<Ellipse Stroke="Black" Width="50" Height="50"/> 

내가

Answer 1

먼저 두 모양이 동일한 좌표 시스템을 사용해야합니다 원하는 것입니다. 두 가지 모두를 Path, 그 중 하나를 EllipseGeometry, 다른 하나를 PathGeometry으로 일반적인 Canvas 상위 항목으로 그릴 수 있습니다. 캔버스의 왼쪽 위 모서리는 좌표 원점을 정의합니다.

<Canvas Margin="100"> 
    <Path Stroke="Black"> 
     <Path.Data> 
      <EllipseGeometry RadiusX="50" RadiusY="50"/> 
     </Path.Data> 
    </Path> 
    <Path Stroke="LightBlue" StrokeThickness="5"> 
     <Path.Data> 
      <PathGeometry> 
       <PathFigure StartPoint="0,-50"> 
        <ArcSegment Point="42.5,-26.2" Size="50,50" 
           IsLargeArc="False" SweepDirection="Clockwise"/> 
       </PathFigure> 
       <PathGeometry.Transform> 
        <RotateTransform Angle="15"/> 
       </PathGeometry.Transform> 
      </PathGeometry> 
     </Path.Data> 
    </Path> 
</Canvas> 

이제 ArcSegment의 Point와 RotateTransform의 Angle는 필요에 따라 조정합니다.

---

업데이트 :

<Path Stroke="LightBlue" StrokeThickness="5"> 
    <Path.Data> 
     <PathGeometry> 
      <PathFigure StartPoint="0,-50"> 
       <ArcSegment Point="42.5,-26.2" Size="50,50" 
          IsLargeArc="False" SweepDirection="Clockwise"/> 
      </PathFigure> 
      <PathGeometry.Transform> 
       <RotateTransform x:Name="transform"/> 
      </PathGeometry.Transform> 
     </PathGeometry> 
    </Path.Data> 
    <Path.Triggers> 
     <EventTrigger RoutedEvent="Loaded"> 
      <BeginStoryboard> 
       <Storyboard> 
        <DoubleAnimation 
         Storyboard.TargetName="transform" 
         Storyboard.TargetProperty="Angle" 
         To="360" Duration="0:0:2" RepeatBehavior="Forever"/> 
       </Storyboard> 
      </BeginStoryboard> 
     </EventTrigger> 
    </Path.Triggers> 
</Path> 

또는 명시 적으로 RotateTransform 이름을 지정하지 않고 :

<Path Stroke="LightBlue" StrokeThickness="5"> 
    <Path.Data> 
     <PathGeometry> 
      <PathFigure StartPoint="0,-50"> 
       <ArcSegment Point="42.5,-26.2" Size="50,50" 
          IsLargeArc="False" SweepDirection="Clockwise"/> 
      </PathFigure> 
      <PathGeometry.Transform> 
       <RotateTransform/> 
      </PathGeometry.Transform> 
     </PathGeometry> 
    </Path.Data> 
    <Path.Triggers> 
     <EventTrigger RoutedEvent="Loaded"> 
      <BeginStoryboard> 
       <Storyboard> 
        <DoubleAnimation 
         Storyboard.TargetProperty="Data.Transform.Angle" 
         To="360" Duration="0:0:2" RepeatBehavior="Forever"/> 
       </Storyboard> 
      </BeginStoryboard> 
     </EventTrigger> 
    </Path.Triggers> 
</Path>