# SkiaSharp Transforms

*Learn about transforms for displaying SkiaSharp graphics*

SkiaSharp supports traditional graphics transforms that are implemented as methods of the `SKCanvas`

object. Mathematically, transforms alter the coordinates and sizes that you specify in `SKCanvas`

drawing functions as the graphical objects are rendered. Transforms are often convenient for drawing repetitive graphics or for animation. Some techniques — such as rotating bitmaps or text — are not possible without the use of transforms.

SkiaSharp transforms support the following operations:

*Translate*to shift coordinates from one location to another*Scale*to increase or decrease coordinates and sizes*Rotate*to rotate coordinates around a point*Skew*to shift coordinates horizontally or vertically so that a rectangle becomes a parallelogram

These are known as *affine* transforms. Affine transforms always preserve parallel lines and never cause a coordinate or size to become infinite. A square is never transformed into anything other than a parallelogram, and a circle is never transformed into anything other than an ellipse.

SkiaSharp also supports non-affine transforms (also called *projective* or *perspective* transforms) based on a standard 3-by-3 transform matrix. A non-affine transform allows a square to be transformed into any convex quadrilateral, which is a four-sided figure with all interior angles less than 180 degrees. Non-affine transforms can cause coordinates or sizes to become infinite, but they are vital for 3D effects.

## Differences between SkiaSharp and Xamarin.Forms Transforms

Xamarin.Forms also supports transforms that are similar to those in SkiaSharp. The Xamarin.Forms `VisualElement`

class defines the following transform properties:

`TranslationX`

and`TranslationY`

`Scale`

`Rotation`

,`RotationX`

, and`RotationY`

The `RotationX`

and `RotationY`

properties are perspective transforms that create quasi-3D effects.

There are several crucial differences between SkiaSharp transforms and Xamarin.Forms transforms:

The first difference is that SkiaSharp transforms are applied to the entire `SKCanvas`

object while the Xamarin.Forms transforms are applied to individual `VisualElement`

derivatives. (You can apply the Xamarin.Forms transforms to the `SKCanvasView`

object itself, because `SKCanvasView`

derives from `VisualElement`

, but within that `SKCanvasView`

, the SkiaSkarp transforms apply.)

The SkiaSharp transforms are relative to the upper-left corner of the `SKCanvas`

while Xamarin.Forms transforms are relative to the upper-left corner of the `VisualElement`

to which they are applied. This difference is important when applying scaling and rotation transforms because these transforms are always relative to a particular point.

The really big difference is that SKiaSharp transforms are *methods* while the Xamarin.Forms transforms are *properties*. This is a semantic difference beyond the syntactical difference: SkiaSharp transforms perform an operation while Xamarin.Forms transforms set a state. SkiaSharp transforms apply to subsequently drawn graphics objects, but not to graphics objects that are drawn before the transform is applied. In contrast, a Xamarin.Forms transform applies to a previously rendered element as soon as the property is set. SkiaSharp transforms are cumulative as the methods are called; Xamarin.Forms transforms are replaced when the property is set with another value.

All the sample programs in this section appear in the **SkiaSharp Transforms** section of the **SkiaSharpFormsDemos** program. Source code can be found in the **Transforms** folder of the solution.

## The Translate Transform

Learn how to use the translate transform to shift SkiaSharp graphics.

## The Scale Transform

Discover the SkiaSharp scale transform for scaling objects to various sizes.

## The Rotate Transform

Explore the effects and animations possible with the SkiaSharp rotate transform.

## The Skew Transform

See how the skew transform can create tilted graphical object.

## Matrix Transforms

Dive deeper into SkiaSharp transforms with the versatile transform matrix.

## Touch Manipulations

Use matrix transforms to implement touch manipulations for dragging, scaling, and rotation.

## Non-Affine Transforms

Go beyond the oridinary with non-affine transform effects.

## 3D Rotation

Use non-affine transforms to rotate 2D objects in 3D space.

## Related Links

## Feedback

We'd love to hear your thoughts. Choose the type you'd like to provide:

Our feedback system is built on GitHub Issues. Read more on our blog.

Loading feedback...