Compartilhar via

Xamarin.Forms Formas: Caminho

  • Artigo

A Path classe deriva da Shape classe e pode ser usada para desenhar curvas e formas complexas. Essas curvas e formas são frequentemente 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 aplicada à geometria de um caminho antes de ser desenhado.

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

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. Existem 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 que pode ser consumido Data pela 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 de geometria 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 string 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 final especificado. Z é o comando close, que cria uma linha que conecta o ponto atual ao ponto inicial. 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 , LineGeometry, e 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 LineSegmentseguintes classes , BezierSegmente ArcSegment .

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 reta é desenhado de (10.100) a (100.100) e de (100.100) a (100,50). Em seguida, os números primeiro e último segmentos são conectados, porque a PathFigure.IsClosed propriedade é definida como true. O resultado é um triângulo:

Triângulo de caminho

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