Xamarin.Forms Formas: Caminho

  • Artigo

Baixar exemplo Baixar o exemplo

A Path classe deriva da Shape classe e pode ser usada para desenhar curvas e formas complexas. Essas curvas e formas geralmente são descritas usando Geometry objetos . Para obter informações sobre as propriedades que a Path classe herda da Shape classe , consulte Xamarin.Forms Formas.

Path define as propriedades a seguir:

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

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

Para obter mais informações sobre transformações, consulte Xamarin.Forms Transformações de caminho.

Criar um caminho

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

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

Criar um caminho com sintaxe de marcação de caminho

O exemplo XAML a seguir mostra como desenhar um triângulo usando a sintaxe de marcação de caminho:

<Path Data="M 10,100 L 100,100 100,50Z"
      Stroke="Black"
      Aspect="Uniform"
      HorizontalOptions="Start" />

A Data cadeia de caracteres começa com o comando move, indicado por M, que estabelece um ponto inicial absoluto para o caminho. L é o comando de linha, que cria uma linha reta do ponto inicial até o ponto de extremidade especificado. Z é o comando close, que cria uma linha que conecta o ponto atual ao ponto de partida. O resultado é um triângulo:

Triângulo de caminho

Para obter mais informações sobre a sintaxe de marcação de caminho, consulte Xamarin.Forms Sintaxe de marcação de caminho.

Criar um caminho com objetos Geometry

Curvas e formas podem ser descritas usando Geometry objetos , que são usados para definir a Path propriedade do Data objeto. Há uma variedade de Geometry objetos para escolher. As EllipseGeometryclasses , LineGeometrye RectangleGeometry descrevem formas relativamente simples. Para criar formas mais complexas ou criar curvas, use um PathGeometry.

PathGeometry os objetos são compostos por um ou mais PathFigure objetos. Cada PathFigure objeto representa uma forma diferente. Cada PathFigure objeto é composto por um ou mais PathSegment objetos, cada um representando uma parte de conexão da forma. Os tipos de segmento incluem as classes , BezierSegmente ArcSegment a LineSegmentseguir.

O exemplo XAML a seguir mostra como desenhar um triângulo usando um PathGeometry objeto :

<Path Stroke="Black"
      Aspect="Uniform"
      HorizontalOptions="Start">
    <Path.Data>
        <PathGeometry>
            <PathGeometry.Figures>
                <PathFigureCollection>
                    <PathFigure IsClosed="True"
                                StartPoint="10,100">
                        <PathFigure.Segments>
                            <PathSegmentCollection>
                                <LineSegment Point="100,100" />
                                <LineSegment Point="100,50" />
                            </PathSegmentCollection>
                        </PathFigure.Segments>
                    </PathFigure>
                </PathFigureCollection>
            </PathGeometry.Figures>
        </PathGeometry>
    </Path.Data>
</Path>

Neste exemplo, o ponto inicial do triângulo é (10.100). Um segmento de linha é desenhado de (10.100) para (100.100) e de (100.100) para (100,50). Em seguida, os números primeiro e últimos segmentos são conectados, porque a PathFigure.IsClosed propriedade é definida truecomo . O resultado é um triângulo:

Triângulo de caminho

Para obter mais informações sobre geometrias, consulte Xamarin.Forms Geometrias.