Nasıl yapılır: UIElement'i Yatay veya Dikey Olarak Çevirme

Bu örnek, bir ScaleTransform yatay veya dikey olarak çevirmek için nasıl kullanılacağını gösterir UIElement . Bu örnekte, bir Button Denetim (türü UIElement ), özelliğine bir uygulanarak çevrilmiş ScaleTransformRenderTransform .

Örnek

Aşağıdaki çizimde, ters çevrilecek düğme gösterilmektedir.

A button with no transform
Ters çevrilecek UIElement

Aşağıdaki, düğmeyi oluşturan kodu gösterir.

<Button Content="Flip me!" Padding="5">
</Button>

Örnek

Düğmeyi yatay olarak ters çevirmek için, oluşturun ScaleTransform ve ScaleX özelliğini-1 olarak ayarlayın. ScaleTransformDüğmenin RenderTransform özelliğine uygulayın.

<Button Content="Flip me!" Padding="5">
  <Button.RenderTransform>
    <ScaleTransform ScaleX="-1" />
  </Button.RenderTransform>
</Button>

A button flipped horizontally about (0,0)
ScaleTransform uygulandıktan sonra düğme

Örnek

Önceki çizimden görebileceğiniz gibi düğme çevrilmiş, ancak aynı zamanda taşınmış. Bunun nedeni, düğmenin sol üst köşesinden çevrilmesidir. Düğmeyi yerinde çevirmek için, ScaleTransform köşesini değil ortasına uygulamak istersiniz. Düğme ScaleTransform merkezini, düğme RenderTransformOrigin özelliğini 0,5, 0,5 olarak ayarlamak için kolay bir yoldur.

<Button Content="Flip me!" Padding="5"
  RenderTransformOrigin="0.5,0.5">
  <Button.RenderTransform>
    <ScaleTransform ScaleX="-1" />
  </Button.RenderTransform>
</Button>

A button flipped horizontally about its center
0,5, 0,5 için bir RenderTransformOrigin içeren düğme

Örnek

Düğmeyi dikey olarak ters çevirmek için, ScaleTransformScaleY özelliği yerine nesnenin özelliğini ayarlayın ScaleX .

<Button Content="Flip me!" Padding="5"
  RenderTransformOrigin="0.5,0.5">
  <Button.RenderTransform>
    <ScaleTransform ScaleY="-1" />
  </Button.RenderTransform>
</Button>

A button flipped vertically about its center
Dikey olarak çevrilmiş düğme

Ayrıca bkz.