Transformaciones de SkiaSharp

  • Artículo

Más información sobre las transformaciones para mostrar gráficos de SkiaSharp

SkiaSharp admite transformaciones de gráficos tradicionales que se implementan como métodos del objeto SKCanvas. Matemáticamente, las transformaciones modifican las coordenadas y tamaños que se especifican en las funciones de dibujo de SKCanvas a medida que se representan los objetos gráficos. Las transformaciones suelen ser convenientes para dibujar gráficos repetitivos o para animaciones. Algunas técnicas, como rotar mapas de bits o texto, no son posibles sin el uso de transformaciones.

Las transformaciones de SkiaSharp admiten las siguientes operaciones:

  • Traducción a coordenadas de desplazamiento de una ubicación a otra
  • Escalado para aumentar o disminuir coordenadas y tamaños
  • Giro de las coordenadas alrededor de un punto
  • Distorsión para desplazar las coordenadas horizontal o verticalmente para que un rectángulo se convierta en un paralelogramo

Estas operaciones se conocen como transformaciones afines. Las transformaciones afines siempre conservan las líneas paralelas y nunca hacen que una coordenada o un tamaño se convierta en infinito. Un cuadrado nunca se transforma en nada que no sea un paralelogramo, y un círculo nunca se transforma en nada que no sea una elipse.

SkiaSharp también admite transformaciones no afines (también denominadas transformaciones de proyección o perspectiva) basadas en una matriz de transformación estándar de 3 por 3. Una transformación no afín permite transformar un cuadrado en cualquier cuadrilátero convexo, que es una figura de cuatro lados con todos los ángulos interiores con menos de 180 grados. Las transformaciones no afines pueden hacer que las coordenadas o tamaños se conviertan en infinitos, pero son vitales para los efectos 3D.

Diferencias entre SkiaSharp y transformaciones de Xamarin.Forms

Xamarin.Forms también admite transformaciones similares a las de SkiaSharp. La clase Xamarin.FormsVisualElement define las siguientes propiedades de transformación:

Las propiedades RotationX y RotationY son transformaciones de perspectiva que crean efectos casi 3D.

Hay varias diferencias cruciales entre las transformaciones de Xamarin.Forms y las de SkiaSharp:

La primera diferencia es que las transformaciones de SkiaSharp se aplican a todo el objeto SKCanvas mientras que las transformaciones de Xamarin.Forms se aplican a derivados individuales de VisualElement. (Puede aplicar las transformaciones de Xamarin.Forms al propio objeto SKCanvasView, ya que SKCanvasView se deriva de VisualElement, pero dentro de ese SKCanvasView, se aplican las transformaciones de SkiaSkarp).

Las transformaciones de SkiaSharp son relativas a la esquina superior izquierda de SKCanvas, mientras que las transformaciones de Xamarin.Forms son relativas a la esquina superior izquierda del objeto VisualElement al que se aplican. Esta diferencia es importante al aplicar transformaciones de escalado y rotación, ya que estas transformaciones siempre son relativas a un punto determinado.

La gran diferencia es que las transformaciones de SKiaSharp son métodos y las transformaciones de Xamarin.Forms son propiedades. Se trata de una diferencia semántica más allá de la diferencia sintáctica: las transformaciones de SkiaSharp realizan una operación, mientras que las transformaciones de Xamarin.Forms establecen un estado. Las transformaciones de SkiaSharp se aplican a objetos gráficos dibujados posteriormente, pero no a los objetos gráficos que se dibujan antes de aplicar la transformación. En cambio, una transformación Xamarin.Forms se aplica a un elemento representado previamente en cuanto se establece la propiedad. Las transformaciones de SkiaSharp son acumulativas a medida que se llama a los métodos; las transformaciones de Xamarin.Forms se reemplazan cuando la propiedad se establece con otro valor.

Todos los programas de ejemplo de esta sección aparecen en la sección Transformaciones de SkiaSharp del programa de ejemplo. El código fuente se puede encontrar en la carpeta Transformaciones de la solución.

Transformación de traslación

Obtenga información sobre cómo usar la transformación de traducción para desplazar gráficos de SkiaSharp.

Transformación de escala

Descubra la transformación de escala de SkiaSharp para escalar objetos a varios tamaños.

Transformación de rotación

Explore los efectos y animaciones posibles con la transformación de rotación de SkiaSharp.

Transformación de sesgo

Vea cómo la transformación sesgada puede crear un objeto gráfico inclinado.

Transformaciones de matriz

Profundice en las transformaciones de SkiaSharp con la versátil matriz de transformación.

Manipulaciones táctiles

Use transformaciones de matriz para implementar manipulaciones táctiles para arrastrar, escalar y rotar.

Transformaciones no afines

Vaya más allá de lo común con efectos de transformación no afines.

Giro 3D

Use transformaciones no afines para girar objetos 2D en espacios 3D.