Compartir vía

Formas de Xamarin.Forms: Línea

  • Artículo

La clase Line deriva de la clase Shape y se puede usar para dibujar líneas. Para obtener información sobre las propiedades que hereda la clase Line de la clase Shape, consulte Xamarin.Forms Shapes.

Line define las siguientes propiedades:

  • X1, de tipo doble, indica la coordenada x del punto de inicio de la línea. El valor predeterminado de esta propiedad es 0.0.
  • Y1, de tipo doble, indica la coordenada y del punto de inicio de la línea. El valor predeterminado de esta propiedad es 0.0.
  • X2, de tipo doble, indica la coordenada x del punto final de la línea. El valor predeterminado de esta propiedad es 0.0.
  • Y2, de tipo doble, indica la coordenada y del punto final de la línea. El valor predeterminado de esta propiedad es 0.0.

Estas propiedades están respaldadas por objetos BindableProperty, lo que significa que pueden ser destinos de los enlaces de datos, y que se les puede aplicar un estilo.

Para obtener información sobre cómo se dibujan los extremos de línea, consulta Extremos de línea de control.

Crear una línea

Para dibujar una línea, crea un objeto Line y establece sus propiedades X1 y Y1 en su punto inicial, y sus propiedades X2 y Y en su punto final. Además, establece su propiedad Stroke en un objeto derivado de Brush porque una línea sin trazo es invisible. Para más información sobre los objetos de Brush, consulte Pinceles de Xamarin.Forms.

Nota:

Establecer la propiedad Fill de un Line no tendrá ningún efecto, ya que una línea no tiene ningún interior.

El siguiente ejemplo de XAML muestra cómo dibujar una línea:

<Line X1="40"
      Y1="0"
      X2="0"
      Y2="120"
      Stroke="Red" />

En este ejemplo, se dibuja una línea diagonal roja de (40,0) a (0,120):

Línea diagonal

Dado que las propiedades X1, Y1, X2 y Y2 tienen valores predeterminados de 0, es posible dibujar algunas líneas con una sintaxis mínima:

<Line Stroke="Red"
      X2="200" />

En este ejemplo, se define una línea horizontal de 200 unidades independientes del dispositivo. Dado que las otras propiedades son 0 de forma predeterminada, se dibuja una línea de (0,0) a (200,0).

En el ejemplo XAML siguiente se muestra cómo dibujar una línea discontinua:

<Line X1="40"
      Y1="0"
      X2="0"
      Y2="120"
      Stroke="DarkBlue"
      StrokeDashArray="1,1"
      StrokeDashOffset="6" />

En este ejemplo, se dibuja una línea diagonal discontinua azul oscuro de (40 0) a (0,120):

Línea discontinua

Para obtener más información sobre cómo dibujar una línea discontinua, consulta Dibujar formas discontinuas.