UIElement.RenderTransformOrigin 속성

  • 참조

정의

네임스페이스:
Windows.UI.Xaml
편집

RenderTransform에서 선언한 가능한 렌더링 변환의 원점(UIElement 경계를 기준으로)을 가져오거나 설정합니다.

public:
 property Point RenderTransformOrigin { Point get(); void set(Point value); };
Point RenderTransformOrigin();

void RenderTransformOrigin(Point value);
public Point RenderTransformOrigin { get; set; }
var point = uIElement.renderTransformOrigin;
uIElement.renderTransformOrigin = point;
Public Property RenderTransformOrigin As Point
<uiElement RenderTransformOrigin="x,y"/>

속성 값

Point

렌더링 변환의 원점입니다. 기본값은 값이 0,0인 Point 입니다.

예제

이 XAML 예제에서는 초기 XAML의 요소에서 RenderTransformOrigin을 설정하는 방법을 보여 줍니다. 초기 기본 CompositeTransform 에서 실행되는 애니메이션은 RenderTransformOrigin을 사용하여 기본 0,0 좌표 원점이 아닌 원의 가운데에 적용되도록 배율 및 회전 변환을 모두 수정할 수 있습니다. 이렇게 하면 원이 중심을 중심으로 회전하고 제자리에서 축소되는 것처럼 표시됩니다.

참고

애니메이션을 시작하려면 리소스에서 애니메이션을 검색하고 Begin을 호출해야 합니다. 코드가 표시되지 않습니다.

<Ellipse x:Name="e1" RenderTransformOrigin=".5,.5" Height="100" Width="100" Loaded="e1_Loaded_1">
    <Ellipse.Fill>
        <LinearGradientBrush>
            <GradientStop Color="Red" Offset="0"/>
            <GradientStop Color="Green" Offset="1"/>
        </LinearGradientBrush>
    </Ellipse.Fill>
    <Ellipse.RenderTransform>
        <CompositeTransform />
    </Ellipse.RenderTransform>
    <Ellipse.Resources>
        <Storyboard x:Name="esb1" >
            <DoubleAnimation RepeatBehavior="3x" Duration="0:0:3" From="0" To="360" Storyboard.TargetName="e1" 
              Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.Rotation)" />
            <DoubleAnimation RepeatBehavior="1x" Duration="0:0:7" From="1" To="0" Storyboard.TargetName="e1" 
              Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" />
            <DoubleAnimation RepeatBehavior="1x" Duration="0:0:7" From="1" To="0" Storyboard.TargetName="e1" 
              Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" />
        </Storyboard>
    </Ellipse.Resources>
</Ellipse>

설명

RenderTransformOrigin을 사용하면 RenderTransform 변환의 세부 사항을 변경하지 않고도 특정 요소에 대한 변환의 효과를 만들거나 변경할 수 있습니다. RenderTransformOrigin에 지정한 Point 값은 실제 픽셀 측정값을 기반으로 하지 않습니다. 대신 0,0 값이 전체 UIElement 렌더링 영역의 왼쪽 위 모서리를 참조하고 1,1이 오른쪽 아래를 참조하는 논리적 지점입니다. 그런 다음, 값을 UIElement의 현재 좌표 공간으로 팩터링하여 X,Y 좌표로 계산합니다.

일부 변환의 경우 원본은 중요하지 않습니다. 예를 들어 RenderTransformOrigin은 RenderTransform 속성에 적용된 TranslateTransform의 동작 을 변경하지 않습니다.

일부 변환 형식에는 변환의 원점 지정을 위한 고유한 속성이 있습니다. 예를 들어 RotateTransform에는 CenterX 및 CenterY가 있습니다. UIElement를 사용하는 경우 시각적 디자인 도구는 경우에 따라 이러한 다른 속성을 숨기므로 모든 변환 원본 변경에만 RenderTransformOrigin을 사용하고 변환별 원본을 기본값으로 둡니다. 도구는 특정 변환에 대한 XAML 요소를 정의하고 TransformGroup을 만드는 대신 RenderTransform의 단일 CompositeTransform 값에 모든 변환 효과를 적용할 수도 있습니다. 사용자 고유의 XAML을 작성하거나 코드에서 변환을 정의하는 경우 RenderTransform에 대한 변환을 적용하는 경우 변환별 원본 값 대신 항상 RenderTransformOrigin을 사용하도록 동일한 방법을 따르는 것이 좋습니다. 그렇지 않으면 값이 서로 오프셋됩니다.

일반적인 기술은 요소 중심에 원점을 배치하는 RenderTransformOrigin을 0.5,0.5로 설정하는 것입니다. 그런 다음 RotateTransform을 적용하여 요소를 가운데로 회전할 수 있습니다.

FlowDirection을 RightToLeft로 변경하면 UIElement에 대한 RenderTransformOrigin의 X 좌표의 의미가 변경됩니다. 0은 오른쪽 가장자리가 됩니다.

RenderTransform 및 RenderTransformOrigin을 사용하여 생성할 수 있는 것과 동일한 시각 효과 중 일부는 프로젝션 및 PlaneProjection을 사용하여 수행할 수도 있습니다. 예를 들어 PlaneProjection.RotationZ를 변경하여 중심을 중심으로 UIElement를 회전할 수 있습니다.

적용 대상

추가 정보