Fırça Dönüşümüne Genel Bakış
Fırça sınıfı iki dönüştürme özelliği sağlar: Transform ve RelativeTransform . Özellikler, fırçanın içeriğini döndürmenizi, ölçeklendirmenizi, eğriltebilir ve çevirmenize olanak tanır. Bu konuda, bu iki özellik arasındaki farklar açıklanmakta ve kullanımları örnekleri verilmektedir.
Önkoşullar
Bu konuyu anlamak için, dönüştürmelisiniz fırçanın özelliklerini anlamalısınız. LinearGradientBrushVe için RadialGradientBrush , LinearGradientBrushkonusuna bakın. ImageBrush, DrawingBrush Veya için VisualBrush bkz. ImageBrush. Ayrıca, dönüşümler genel bakışbölümünde açıklanan 2B dönüşümlere de alışkın olmanız gerekir.
Transform ve RelativeTransform özellikleri arasındaki farklar
Fırçanın özelliğine bir dönüşüm uyguladığınızda Transform , fırça içeriğini merkezine dönüştürmek istiyorsanız, boyanmış alanın boyutunu bilmeniz gerekir. Boyanmış alanın 200 cihazdan bağımsız piksel genişliğinde ve 150 yüksekliğinde olduğunu varsayalım. RotateTransformFırçanın, merkezi yaklaşık 45 derecesini döndürmek için bir kullandıysanız, RotateTransformCenterX 100 ve a CenterY 75.
Bir fırçanın özelliğine dönüşüm uyguladığınızda RelativeTransform , bu dönüşüm, çıktısı boyanmış alana eşlenmeden önce fırçaya uygulanır. Aşağıdaki listede, fırçanın içeriklerinin işlendiği ve dönüştürülebileceği sıra açıklanmaktadır.
Fırçanın içeriğini işleyin. Bir için GradientBrush Bu, gradyan alanının belirlenmesi anlamına gelir. Bir için, TileBrushViewbox ile eşleştirilir Viewport . Bu, fırçanın çıkışı olur.
fırçanın çıkışını 1 x 1 dönüşüm dikdörtgeninin üzerine Project.
Varsa fırçayı uygulayın RelativeTransform .
dönüştürülen çıktıyı boyamak için alana Project.
Varsa fırçayı uygulayın Transform .
RelativeTransformFırçanın çıkışı 1 x 1 dikdörtgenle eşlendiğinde uygulandığından, dönüşüm merkezi ve Aralık değerleri göreli olarak görünür. Örneğin, RotateTransform fırçanın merkezi yaklaşık 45 derecesini döndürmek için bir kullandıysanız, RotateTransformCenterX 0,5 ve a CenterY 0,5.
Aşağıdaki çizimde, ve özellikleri kullanılarak 45 derecenin döndürüldüğü birkaç fırçanın çıkışı gösterilmektedir RelativeTransformTransform .

Bir TileBrush ile RelativeTransform kullanma
Kutucuk fırçaları diğer fırçalardan daha karmaşık olduğundan, bir ' a uygulamak RelativeTransform beklenmedik sonuçlar verebilir. Örneğin, aşağıdaki görüntüyü alın.

Aşağıdaki örnek, ImageBrush önceki görüntüyle dikdörtgen bir alanı boyamak için bir kullanır. RotateTransformImageBrush Nesnenin RelativeTransform özelliğine uygular ve Stretch özelliğini olarak ayarlar. Bu, UniformToFill dikdörtgeni tamamen doldurmak için uzatıldığınızda görüntünün en boy oranını korumalıdır.
<Rectangle Width="200" Height="100" Stroke="Black" StrokeThickness="1">
<Rectangle.Fill>
<ImageBrush Stretch="UniformToFill">
<ImageBrush.ImageSource>
<BitmapImage UriSource="sampleImages\square.jpg" />
</ImageBrush.ImageSource>
<ImageBrush.RelativeTransform>
<RotateTransform CenterX="0.5" CenterY="0.5" Angle="90" />
</ImageBrush.RelativeTransform>
</ImageBrush>
</Rectangle.Fill>
</Rectangle>
Bu örnek aşağıdaki çıktıyı üretir:

Fırçanın olarak ayarlanmış olmasına rağmen görüntünün bozuk olduğuna dikkat edin StretchUniformToFill . Bunun nedeni, fırçaya eşlendikten sonra göreli dönüşüm uygulanmasındaki olur ViewboxViewport . Aşağıdaki listede işlemin her adımı açıklanmaktadır:
fırçanın içeriğini ( Viewbox ), fırçanın ayarlarını kullanarak temel kutucuğuna ( Viewport ) Project Stretch .

taban kutucuğunu 1 x 1 dönüşüm dikdörtgeninin üzerine Project.

Uygulamasını uygulayın RotateTransform .

dönüştürülen taban kutucuğunu boyamak için alana Project.

Örnek: ImageBrush 45 derece döndürün
Aşağıdaki örnek bir RotateTransformRelativeTransform öğesinin özelliğine uygular ImageBrush . RotateTransformNesnenin CenterX ve CenterY özelliklerinin her ikisi de içeriğin merkez noktasının göreli koordinatları olan 0,5 olarak ayarlanır. Sonuç olarak, fırçanın içeriği Merkezi hakkında döndürülür.
//
// Create an ImageBrush with a relative transform and
// use it to paint a rectangle.
//
ImageBrush relativeTransformImageBrush = new ImageBrush();
relativeTransformImageBrush.ImageSource =
new BitmapImage(new Uri(@"sampleImages\pinkcherries.jpg", UriKind.Relative));
// Create a 45 rotate transform about the brush's center
// and apply it to the brush's RelativeTransform property.
RotateTransform aRotateTransform = new RotateTransform();
aRotateTransform.CenterX = 0.5;
aRotateTransform.CenterY = 0.5;
aRotateTransform.Angle = 45;
relativeTransformImageBrush.RelativeTransform = aRotateTransform;
// Use the brush to paint a rectangle.
Rectangle relativeTransformImageBrushRectangle = new Rectangle();
relativeTransformImageBrushRectangle.Width = 175;
relativeTransformImageBrushRectangle.Height = 90;
relativeTransformImageBrushRectangle.Stroke = Brushes.Black;
relativeTransformImageBrushRectangle.Fill = relativeTransformImageBrush;
'
' Create an ImageBrush with a relative transform and
' use it to paint a rectangle.
'
Dim relativeTransformImageBrush As New ImageBrush()
relativeTransformImageBrush.ImageSource = New BitmapImage(New Uri("sampleImages\pinkcherries.jpg", UriKind.Relative))
' Create a 45 rotate transform about the brush's center
' and apply it to the brush's RelativeTransform property.
Dim aRotateTransform As New RotateTransform()
aRotateTransform.CenterX = 0.5
aRotateTransform.CenterY = 0.5
aRotateTransform.Angle = 45
relativeTransformImageBrush.RelativeTransform = aRotateTransform
' Use the brush to paint a rectangle.
Dim relativeTransformImageBrushRectangle As New Rectangle()
relativeTransformImageBrushRectangle.Width = 175
relativeTransformImageBrushRectangle.Height = 90
relativeTransformImageBrushRectangle.Stroke = Brushes.Black
relativeTransformImageBrushRectangle.Fill = relativeTransformImageBrush
<Rectangle Width="175" Height="90" Stroke="Black">
<Rectangle.Fill>
<ImageBrush ImageSource="sampleImages\pinkcherries.jpg">
<ImageBrush.RelativeTransform>
<RotateTransform CenterX="0.5" CenterY="0.5" Angle="45" />
</ImageBrush.RelativeTransform>
</ImageBrush>
</Rectangle.Fill>
</Rectangle>
Sonraki örnek bir için de uygular RotateTransformImageBrush , ancak özelliği Transform yerine özelliğini kullanır RelativeTransform . Fırçaya ilişkin fırçayı döndürmek için RotateTransform nesnenin CenterX ve CenterY mutlak koordinatlar olarak ayarlanması gerekir. Fırça tarafından boyanmış dikdörtgen 90 piksel 175, orta noktası ise (87,5, 45).
//
// Create an ImageBrush with a transform and
// use it to paint a rectangle.
//
ImageBrush transformImageBrush = new ImageBrush();
transformImageBrush.ImageSource =
new BitmapImage(new Uri(@"sampleImages\pinkcherries.jpg", UriKind.Relative));
// Create a 45 rotate transform about the brush's center
// and apply it to the brush's Transform property.
RotateTransform anotherRotateTransform = new RotateTransform();
anotherRotateTransform.CenterX = 87.5;
anotherRotateTransform.CenterY = 45;
anotherRotateTransform.Angle = 45;
transformImageBrush.Transform = anotherRotateTransform;
// Use the brush to paint a rectangle.
Rectangle transformImageBrushRectangle = new Rectangle();
transformImageBrushRectangle.Width = 175;
transformImageBrushRectangle.Height = 90;
transformImageBrushRectangle.Stroke = Brushes.Black;
transformImageBrushRectangle.Fill = transformImageBrush;
'
' Create an ImageBrush with a transform and
' use it to paint a rectangle.
'
Dim transformImageBrush As New ImageBrush()
transformImageBrush.ImageSource = New BitmapImage(New Uri("sampleImages\pinkcherries.jpg", UriKind.Relative))
' Create a 45 rotate transform about the brush's center
' and apply it to the brush's Transform property.
Dim anotherRotateTransform As New RotateTransform()
anotherRotateTransform.CenterX = 87.5
anotherRotateTransform.CenterY = 45
anotherRotateTransform.Angle = 45
transformImageBrush.Transform = anotherRotateTransform
' Use the brush to paint a rectangle.
Dim transformImageBrushRectangle As New Rectangle()
transformImageBrushRectangle.Width = 175
transformImageBrushRectangle.Height = 90
transformImageBrushRectangle.Stroke = Brushes.Black
transformImageBrushRectangle.Fill = transformImageBrush
<Rectangle Width="175" Height="90" Stroke="Black">
<Rectangle.Fill>
<ImageBrush ImageSource="sampleImages\pinkcherries.jpg">
<ImageBrush.Transform>
<RotateTransform CenterX="87.5" CenterY="45" Angle="45" />
</ImageBrush.Transform>
</ImageBrush>
</Rectangle.Fill>
</Rectangle>
Aşağıdaki çizim, Transform özelliği olmadan ve Transform özelliği, özelliğe uygulanan dönüşümle birlikte dönüşümde gösterilmektedir RelativeTransformTransform .

Bu örnek, daha büyük bir örneğin bir parçasıdır. Tüm örnek için bkz. fırçalar örneği. Fırçalar hakkında daha fazla bilgi için bkz. WPF Fırçalarına Genel Bakış.