타원 가장자리에 선을 바인딩합니다

StackOverflow https://stackoverflow.com/questions/625449

  •  05-07-2019
  •  | 
  •  

문제

캔버스에는 애니메이션을 통해 rotatetransform에 의해 타원이 회전했습니다. 타원의 한쪽 지점에 한쪽 끝이 부착 된 선을 추가하고 싶습니다. 어떻게 든 타원의 지점에 묶을 수 있습니까?

도움이 되었습니까?

해결책

타원과 라인을 모두 모금 할 수 있습니다.

<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Canvas.Resources>
        <PathGeometry x:Key="lineEndPath">
            <PathFigure StartPoint="25,50">
                <ArcSegment IsLargeArc="True" Point="100,50" Size="25,25" SweepDirection="Clockwise"/>
                <ArcSegment IsLargeArc="True" Point="25,50" Size="25,25" SweepDirection="Clockwise"/>
            </PathFigure>
        </PathGeometry>
    </Canvas.Resources>
    <Canvas.Triggers>
        <EventTrigger RoutedEvent="Canvas.Loaded">
            <BeginStoryboard>
                <Storyboard>
                    <DoubleAnimation Duration="0:0:5" From="0" RepeatBehavior="Forever" Storyboard.TargetName="rotTF" Storyboard.TargetProperty="Angle" To="360"/>
                    <PointAnimationUsingPath Duration="0:0:5" PathGeometry="{StaticResource lineEndPath}" RepeatBehavior="Forever" Storyboard.TargetName="lineEndPoint" Storyboard.TargetProperty="Point"/>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Canvas.Triggers>
    <Ellipse Width="75" Height="50" Canvas.Left="25" Canvas.Top="25" Stroke="Black">
        <Ellipse.RenderTransform>
            <RotateTransform x:Name="rotTF" CenterX="37.5" CenterY="25"/>
        </Ellipse.RenderTransform>
    </Ellipse>
    <Path Stroke="Black" StrokeThickness="1.0">
        <Path.Data>
            <PathGeometry>
                <PathFigure StartPoint="0,0">
                    <LineSegment x:Name="lineEndPoint"/>
                </PathFigure>
            </PathGeometry>
        </Path.Data>
    </Path>
    <Path Data="{StaticResource lineEndPath}" Stroke="Black" StrokeDashArray="2,0,0" StrokeThickness="1.0"/>
</Canvas>

우리는 a의 한쪽 끝을 애니메이션합니다 Linesegment a Pointanimationusingpath, 경로를 원으로 설정하십시오 (점선으로 표시).

다른 팁

문제가 무엇인지 잘 모르겠습니다. 캔버스에 다른 요소를 추가하여 올바르게 정렬하고 변환을 캔버스에 적용하여 두 요소를 회전시킬 수 있습니까?

라인에 "이것으로 줄을 서서"라고 말할 방법이 있는지 묻는다면, 당신은 지금까지 그렇게 할 수 없습니다. 이와 같은 복잡한 레이아웃의 경우 Kaxaml/Bland를 사용하여 시행 착오를하거나 Illustrator를 사용하여 배치 한 다음 XAML로 내보낼 수 있습니다.

내가 올바르게 이해한다고 가정하면, 당신은 당신의 줄의 종말점을 변경하기 위해 수학을 알아 내야 할 것입니다. 죄송합니다. 공식을 모르지만 기본적으로 타원에서 포인트를 찾은 다음 회전 각도가 주어지면 위치를 파악한 다음 해당 정보를 사용하여 라인의 엔드 포인트를 변경합니다.

라인으로 가장자리에 두 개의 요소를 연결하기 위해 다음과 같은 경계 박스 방법을 사용합니다. 앵커를 사용하지 않고 두 개의 WPF 캔버스 요소를 라인으로 연결합니까?.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top