Condividi tramite

Xamarin.Forms Forme: Percorso

  • Articolo

La Path classe deriva dalla Shape classe e può essere usata per disegnare curve e forme complesse. Queste curve e forme vengono spesso descritte usando Geometry oggetti . Per informazioni sulle proprietà che la Path classe eredita dalla Shape classe , vedere Xamarin.Forms Forme.

Path definisce le proprietà seguenti:

  • Data, di tipo Geometry, che specifica la forma da disegnare.
  • RenderTransform, di tipo Transform, che rappresenta la trasformazione applicata alla geometria di un percorso prima che venga disegnata.

Queste proprietà sono supportate da BindableProperty oggetti, il che significa che possono essere destinazioni di data binding e stili.

Per altre informazioni sulle trasformazioni, vedere Xamarin.Forms Trasformazioni di percorso.

Creare un percorso

Per disegnare un percorso, creare un Path oggetto e impostarne la Data proprietà. Esistono due tecniche per impostare la Data proprietà:

  • Puoi impostare un valore stringa per Data in XAML, usando la sintassi di markup del percorso. Con questo approccio, il Path.Data valore usa un formato di serializzazione per la grafica. In genere, questo valore stringa non viene modificato manualmente dopo la creazione. Si usano invece strumenti di progettazione per modificare i dati ed esportarli come frammento di stringa utilizzabile dalla Data proprietà .
  • È possibile impostare la Data proprietà su un Geometry oggetto . Può trattarsi di un oggetto specifico Geometry o di un GeometryGroup oggetto che funge da contenitore che può combinare più oggetti geometry in un singolo oggetto.

Creare un percorso con la sintassi di markup del percorso

L'esempio XAML seguente mostra come disegnare un triangolo usando la sintassi di markup del percorso:

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

La Data stringa inizia con il comando di spostamento, indicato da M, che stabilisce un punto di inizio assoluto per il percorso. L è il comando della riga, che crea una linea retta dal punto iniziale al punto finale specificato. Z è il comando close, che crea una riga che connette il punto corrente al punto iniziale. Il risultato è un triangolo:

Triangolo del percorso

Per altre informazioni sulla sintassi di markup del percorso, vedere Xamarin.Forms Sintassi di markup path.

Creare un percorso con oggetti Geometry

Le curve e le forme possono essere descritte utilizzando Geometry oggetti , che vengono utilizzati per impostare la Path proprietà dell'oggetto Data . Sono disponibili diversi Geometry oggetti tra cui scegliere. Le EllipseGeometryclassi , LineGeometrye RectangleGeometry descrivono forme relativamente semplici. Per creare forme più complesse o creare curve, utilizzare un oggetto PathGeometry.

PathGeometry gli oggetti sono costituiti da uno o più PathFigure oggetti. Ogni PathFigure oggetto rappresenta una forma diversa. Ogni PathFigure oggetto è costituito da uno o più PathSegment oggetti, ognuno dei quali rappresenta una parte di connessione della forma. I tipi di segmento includono le LineSegmentclassi , BezierSegmente ArcSegment seguenti.

L'esempio XAML seguente illustra come disegnare un triangolo usando un PathGeometry oggetto :

<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>

In questo esempio il punto iniziale del triangolo è (10.100). Un segmento di linea viene disegnato da (10.100) a (100.100) e da (100.100) a (100.50). Le figure prima e gli ultimi segmenti sono quindi connessi, perché la PathFigure.IsClosed proprietà è impostata su true. Il risultato è un triangolo:

Triangolo del percorso

Per altre informazioni sulle geometrie, vedere Xamarin.Forms Geometrie.