UIElement.RenderTransformOrigin Properti

Definisi

Ruang nama:

Windows.UI.Xaml

Mendapatkan atau mengatur titik asal dari setiap kemungkinan transformasi render yang dideklarasikan oleh RenderTransform, relatif terhadap batas 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"/>

Nilai Properti

Point

Titik asal transformasi render. Nilai default adalah Titik dengan nilai 0,0.

Contoh

Contoh XAML ini menunjukkan cara mengatur RenderTransformOrigin pada elemen di XAML awal. Animasi yang berjalan pada CompositeTransform awalnya default dapat menggunakan RenderTransformOrigin untuk memodifikasi transformasi skala dan memutar untuk diterapkan ke pusat lingkaran daripada asal koordinat 0,0 default. Ini membuatnya tampak seolah-olah lingkaran berputar di sekitar tengahnya dan menyusut di tempatnya.

Catatan

Untuk memulai animasi, Anda harus mengambilnya dari Sumber Daya dan memanggil Mulai; kode tersebut tidak ditampilkan.

<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>

Keterangan

RenderTransformOrigin memungkinkan Anda membuat atau mengubah efek transformasi pada elemen tertentu tanpa harus mengubah spesifik transformasi RenderTransform . Nilai Titik yang Anda tentukan untuk RenderTransformOrigin tidak didasarkan pada ukuran piksel aktual. Sebaliknya, ini adalah titik logis, di mana nilai 0,0 mengacu pada sudut kiri atas area render UIElement keseluruhan, dan 1,1 mengacu pada kanan bawah. Nilai kemudian dievaluasi ke dalam koordinat X,Y dengan memperhitungkannya ke ruang koordinat UIElement saat ini.

Untuk beberapa transformasi, asal tidak masalah. Misalnya RenderTransformOrigin tidak akan mengubah perilaku TranslateTransform yang diterapkan ke properti RenderTransform .

Beberapa jenis transformasi memiliki propertinya sendiri untuk menentukan asal transformasi. Misalnya, RotateTransform memiliki CenterX dan CenterY. Saat Anda bekerja dengan UIElement, alat desain visual terkadang menyembunyikan properti lain ini sehingga Anda hanya menggunakan RenderTransformOrigin untuk semua perubahan asal transformasi dan membiarkan asal khusus transformasi sebagai default. Alat mungkin juga menerapkan semua efek transformasi ke satu nilai CompositeTransform untuk RenderTransform, daripada menentukan elemen XAML untuk transformasi tertentu dan membuat TransformGroup. Jika Anda menulis XAML Anda sendiri atau menentukan transformasi dalam kode, Anda mungkin mempertimbangkan untuk mengikuti praktik yang sama ini sehingga Anda selalu menggunakan RenderTransformOrigin daripada nilai asal khusus transformasi jika Anda menerapkan transformasi untuk RenderTransform, jika tidak, nilai akan saling mengimbangi.

Teknik umum adalah mengatur RenderTransformOrigin ke 0.5,0.5, yang menempatkan asal di pusat elemen. Anda kemudian dapat menerapkan RotateTransform untuk memutar elemen di sekitar pusat.

Mengubah FlowDirection ke RightToLeft mengubah arti koordinat X dari RenderTransformOrigin untuk UIElement; 0 akan menjadi tepi yang tepat.

Beberapa efek visual yang sama yang dapat Anda hasilkan dengan RenderTransform dan RenderTransformOrigin juga dapat dicapai dengan Projection dan PlaneProjection. Misalnya, Anda dapat memutar UIElement di sekitar pusatnya dengan mengubah PlaneProjection.RotationZ.

Lihat juga

• TranslateTransform
• Efek 3-D untuk menggunakan XAML
• Sampel transformasi dua dimensi XAML