Rectángulo

Examina la muestra

La clase .NET Multi-platform App UI (.NET MAUI) Rectangle deriva de la clase Shape y se puede usar para dibujar rectángulos y cuadrados. Para obtener información sobre las propiedades que hereda la clase Rectangle de la clase Shape, consulta Formas de .NET MAUI.

Rectangle define las siguientes propiedades:

• RadiusX, de tipo double, que es el radio del eje X usado para redondear las esquinas del rectángulo. El valor predeterminado de esta propiedad es 0.0.
• RadiusY, de tipo double, que es el radio del eje Y que se usa para redondear las esquinas del rectángulo. 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 con estilo.

La clase Rectangle establece la propiedad Aspect, heredada de la clase Shape, en Stretch.Fill. Para obtener más información acerca de la propiedad Aspect, consulta Stretch shapes.

Creación de un rectángulo

Para dibujar un rectángulo, crea un objeto Rectangle y establece sus propiedades WidthRequest y HeightRequest. Para pintar el interior del rectángulo, establece su propiedad Fill en un objeto derivado de Brush. Para asignar al rectángulo un contorno, establece su propiedad Stroke en un objeto derivado de Brush. La propiedad StrokeThickness especifica el grosor del contorno del rectángulo. Para más información sobre objetos Brush, consulta Pinceles.

Para proporcionar esquinas redondeadas al rectángulo, especifica las propiedades RadiusX y RadiusY. Estas propiedades establecen los radios del eje X y del eje Y se usan para redondear las esquinas del rectángulo.

Nota:

También hay una clase RoundRectangle, que tiene CornerRadiusBindableProperty, que se puede usar para dibujar rectángulos con esquinas redondeadas.

Para dibujar un cuadrado, haz que las propiedades WidthRequest y HeightRequest del objeto Rectangle sean iguales.

En el ejemplo XAML siguiente se muestra cómo dibujar un rectángulo rellenado:

<Rectangle Fill="Red"
           WidthRequest="150"
           HeightRequest="50"
           HorizontalOptions="Start" />

En este ejemplo, se dibuja un rectángulo de color rojo con dimensiones 150x50 (unidades independientes del dispositivo):

En el ejemplo XAML siguiente se muestra cómo dibujar un rectángulo relleno, con esquinas redondeadas:

<Rectangle Fill="Blue"
           Stroke="Black"
           StrokeThickness="3"
           RadiusX="50"
           RadiusY="10"
           WidthRequest="200"
           HeightRequest="100"
           HorizontalOptions="Start" />

En este ejemplo, se dibuja un rectángulo relleno de color azul con esquinas redondeadas:

Para obtener información sobre cómo dibujar un rectángulo discontinuo, consulta Dibujar formas discontinuas.