Nasıl yapılır: Göreli Değerler Kullanarak Dönüşümün Kaynağını Belirtme

Bu örnek, bir öğesine uygulanan bir kaynağının kaynağını belirtmek için göreli değerlerin nasıl kullanılacağını gösterir RenderTransform FrameworkElement .

Özelliğini kullanarak bir öğesini döndürdüğünüzde, FrameworkElement ölçeklendirerek veya RenderTransform eğayarlarken, varsayılan ayar öğenin sol üst köşesine dönüşüm uygular. Öğenin merkezinden döndürmek, ölçeklendirmek veya eğmek istiyorsanız, dönüşümün merkezini öğenin merkezine ayarlayarak telafi edebilirsiniz... Ancak bu çözüm, öğesinin boyutunu bilmeniz gerekir. Bir öğenin ortasına dönüşüm uygulamanın daha kolay bir yolu RenderTransformOrigin , dönüşüm üzerinde bir merkez değeri ayarlamak yerine özelliğini (0,5, 0,5) olarak ayarlamadır.

Örnek

Aşağıdaki örnek, RotateTransform Button saat yönünde 45 derece döndürmek için bir kullanır. Örnek bir merkez belirtmediği için düğme, sol üst köşesi olan nokta (0, 0) ile ilgili olarak döner. , RotateTransform RenderTransform Özelliğine uygulanır.

Aşağıdaki çizimde, izleyen örnek için dönüştürme sonucu gösterilmektedir.

RenderTransform kullanılarak dönüştürülen bir düğme
RenderTransform özelliğini kullanarak saat yönünde 45 derecelik bir döndürme

<Border Margin="30" 
  HorizontalAlignment="Left" VerticalAlignment="Top"
  BorderBrush="Black" BorderThickness="1" >
  <StackPanel Orientation="Vertical">
    <Button Content="A Button" Opacity="1" />
    <Button Content="Rotated Button">
      <Button.RenderTransform>
        <RotateTransform Angle="45" />
      </Button.RenderTransform>
    </Button>
    <Button Content="A Button" Opacity="1" />
  </StackPanel>
</Border>

Aşağıdaki örnek ayrıca, RotateTransform Button saat yönünde 45 derece döndürmek için bir kullanır; ancak, bu örnek düğmenin öğesini RenderTransformOrigin (0,5, 0,5) olarak ayarlar. Sonuç olarak, döndürme sol üst köşenin yerine düğmenin merkezine uygulanır.

Aşağıdaki çizimde, izleyen örnek için dönüştürme sonucu gösterilmektedir.

Bir düğme merkeziyle ilgili olarak dönüştürüldü
Bir RenderTransformOrigin (0,5, 0,5) ile RenderTransform özelliğini kullanarak 45 derecelik bir döndürme

<Border Margin="30"   
  HorizontalAlignment="Left" VerticalAlignment="Top"
  BorderBrush="Black" BorderThickness="1">
  <StackPanel Orientation="Vertical">
    <Button Content="A Button" Opacity="1" />
    <Button Content="Rotated Button"
      RenderTransformOrigin="0.5,0.5">
      <Button.RenderTransform>
        <RotateTransform Angle="45" />
      </Button.RenderTransform>
    </Button>
    <Button Content="A Button" Opacity="1" />
  </StackPanel>
</Border>

Nesneleri dönüştürme hakkında daha fazla bilgi için FrameworkElement bkz. dönüşümler genel bakış.

Ayrıca bkz.