Xamarin.Forms Formas: Retângulo

  • Artigo

Baixar exemplo Baixar o exemplo

A Rectangle classe deriva da Shape classe e pode ser usada para desenhar retângulos e quadrados. Para obter informações sobre as propriedades que a Rectangle classe herda da Shape classe , consulte Xamarin.Forms Formas.

Rectangle define as propriedades a seguir:

  • RadiusX, do tipo double, que é o raio do eixo x usado para arredondar os cantos do retângulo. O valor padrão dessa propriedade é 0,0.
  • RadiusY, do tipo double, que é o raio do eixo y usado para arredondar os cantos do retângulo. O valor padrão dessa propriedade é 0,0.

Essas propriedades são apoiadas por BindableProperty objetos , o que significa que elas podem ser destinos de associações de dados e estilizadas.

A Rectangle classe define a Aspect propriedade , herdada da Shape classe , como Stretch.Fill. Para obter mais informações sobre a Aspect propriedade , consulte Alongar formas.

Criar um retângulo

Para desenhar um retângulo, crie um Rectangle objeto e defina suas WidthRequest propriedades e HeightRequest . Para pintar o interior do retângulo, defina sua Fill propriedade como um Brushobjeto derivado de . Para dar ao retângulo uma estrutura de tópicos, defina sua Stroke propriedade como um Brushobjeto derivado de . A StrokeThickness propriedade especifica a espessura do contorno do retângulo. Para obter mais informações sobre Brush objetos, consulte Xamarin.Forms Brushes.

Para dar cantos arredondados ao retângulo, defina suas RadiusX propriedades e RadiusY . Essas propriedades definem o eixo x e o raio do eixo y usados para arredondar os cantos do retângulo.

Para desenhar um quadrado, torne as WidthRequest propriedades e HeightRequest do Rectangle objeto iguais.

O exemplo XAML a seguir mostra como desenhar um retângulo preenchido:

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

Neste exemplo, um retângulo vermelho preenchido com dimensões 150x50 (unidades independentes de dispositivo) é desenhado:

Retângulo preenchido

O exemplo XAML a seguir mostra como desenhar um retângulo preenchido, com cantos arredondados:

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

Neste exemplo, um retângulo azul preenchido com cantos arredondados é desenhado:

Retângulo com cantos arredondados

Para obter informações sobre como desenhar um retângulo tracejado, consulte Desenhar formas tracejadas.