Neste artigo vou apresentar o novo recurso Shapes do Xamarin Forms 4.7.

Continuando a primeira parte do artigo vamos tratar das demais formas que derivam da classe Shape.

5- PolygonPage.xaml

A classe Polygon deriva da classe Shape e pode ser usada para desenhar polígonos, que são séries de linhas conectadas que formam formas fechadas. Esta classe define as seguintes propriedades:

• Points, do tipo PointCollection, É uma coleção de estruturas Point que descrevem os pontos de vértice da polilinha.
• FillRule, do tipo FillRule, Especifica como as áreas de interseção na polilinha são combinadas. O valor padrão  é FillRule.EvenOdd.

O tipo PointsCollection é um objeto ObservableCollection de Point. A estrutura Point define propriedades X e Y, do tipo double, que representam um par de coordenadas x e y no espaço 2D.

Portanto, a propriedade Points deve ser definida como uma lista de pares de coordenadas xe coordenadas y que descrevem os pontos de vértice do polígono, delimitados por uma única vírgula e/ou um ou mais espaços. Por exemplo, "40,10 70,80" e "40 10, 70 80" são válidos.

Para desenhar um polígono, crie um objeto Polygon e defina sua propriedade Points como os vértices de uma forma. É automaticamente desenhada uma linha que conecta o primeiro e o último ponto.

Para pintar o interior do polígono, defina sua propriedade Fill como Cor.
Para dar um contorno ao polígono, defina sua propriedade Stroke como Cor.
A propriedade StrokeThickness especifica a espessura do contorno do polígono.

...
  <ScrollView>
        <StackLayout Margin="20">
            <Label Text="Polygon" />
            <Polygon Points="40,10 70,80 10,50"
                     Fill="AliceBlue"
                     Stroke="Red"
                     StrokeThickness="5" />
            <Label Text="Polygon with dashed stroke" />
            <Polygon Points="40,10 70,80 10,50"
                     Fill="AliceBlue"
                     Stroke="Green"
                     StrokeThickness="5"
                     StrokeDashArray="1,1"
                     StrokeDashOffset="6" />
            <Label Text="EvenOdd polygon" />
            <!-- FillRule não precisa ser definida porque EvenOdd é o valor default. -->
            <Polygon Points="0 48, 0 144, 96 150, 100 0, 192 0, 192 96, 50 96, 48 192, 150 200 144 48"
                     Fill="Blue"
                     Stroke="Red"
                     StrokeThickness="3" />
            <Label Text="NonZero polygon" />
            <Polygon Points="0 48, 0 144, 96 150, 100 0, 192 0, 192 96, 50 96, 48 192, 150 200 144 48"
                     Fill="Black"
                     FillRule="Nonzero"
                     Stroke="Yellow"
                     StrokeThickness="3" />
        </StackLayout>
    </ScrollView>
...

Abaixo temos o resultado:

6- PathPage.xaml

A classe Path deriva da classe Shape e pode ser usada para desenhar curvas e formas complexas. Essas curvas e formas são frequentemente descritas usando objetos Geometry.  Esta classe define as seguintes propriedades:

• Data, do tipo Geometry, que especifica a forma a ser desenhada;
• RenderTransform, do tipo Transform, que representa a transformação aplicada à geometria de um caminho antes de ser desenhado.;

Para desenhar um Path (caminho), crie um objeto Path e defina sua propriedade Data. Existem duas técnicas para definir a propriedade Data:

1. Você pode definir um valor de sequência para Data no XAML, usando a sintaxe de marcação de caminho. Com essa abordagem, o valor Path.Data está consumindo um formato de serialização para gráficos. Normalmente, você não edita esse valor da string manualmente depois que ele é criado. Em vez disso, você usa ferramentas de design para manipular os dados e exportá-los como um fragmento de sequência consumível pela propriedade Data.
2. Você pode definir a propriedade Data como um objeto Geometry. Pode ser um objeto Geometry específico ou um GeometryGroup que atua como um contêiner que pode combinar vários objetos geométricos em um único objeto.

Abaixo temos o resultado:

Além disso temos a classe Geometry (e as classes que derivam dela) permitem descrever a geometria de uma forma 2D. Temos geometrias simples como EllipseGeometry, LineGeometry ou RectangleGeometry e geometrias mais complexas como PathGeometry.

Em outro artigo vamos tratar com mais detalhes do recurso Geometry.

Pegue o código do projeto compartilhado aqui :  XF_Shapes1_2.zip   

"Ninguém jamais viu a Deus; se nos amamos uns aos outros, Deus está em nós, e em nós é perfeito o seu amor.
Nisto conhecemos que estamos nele, e ele em nós, pois que nos deu do seu Espírito.
E vimos, e testificamos que o Pai enviou seu Filho para Salvador do mundo."
1 João 4:12-14

Referências:

• Macoratti .net | Facebook

• macoratti - YouTube

• Jose C Macoratti (@macorati) | Twitter

• VB.NET 2005 - Controles - Macoratti.net

• Seção de Jogos do site Macoratti .net

• Xamarim - Desenvolvimento Multiplataforma com C# ...

• Xamarin - Apresentando Xamarin.Forms - Macoratti.net

• Xamarin.Forms - Olá Mundo - Criando sua primeira ..

• Xamarin.Forms - Olá Mundo - Anatomia da aplicação

• NET - Apresentando o padrão Model-View-ViewModel

• Xamarin Forms - MVVM - Macoratti.net

• NET - O padrão MVVM (Model-View-ViewModel) revisitado

• Xamarin Forms - MVVM - A interface ICommand

• Padrão de Projeto - Aprendendo o padrão MVVM ..

José Carlos Macoratti