Xamarin.Forms Tvary
A Shape
je typ View
, který umožňuje nakreslit obrazec na obrazovku. Shape
objekty lze použít uvnitř tříd rozložení a většiny ovládacích prvků, protože Shape
třída je odvozena od View
třídy.
Xamarin.FormsObrazce jsou k dispozici v oboru názvů v Xamarin.Forms.Shapes
systémech iOS, Android, macOS, Univerzální platforma Windows (UPW) a Windows Presentation Foundation (WPF).
Shape
definuje následující vlastnosti:
Aspect
, typuStretch
, popisuje, jak obrazec vyplní přidělený prostor. Výchozí hodnota této vlastnosti jeStretch.None
.Fill
, typuBrush
, označuje štětec použitý k malování interiéru obrazce.Stroke
, typuBrush
označuje štětec použitý k vykreslení obrysu obrazce.StrokeDashArray
, typuDoubleCollection
, který představuje kolekcidouble
hodnot, které označují vzor pomlček a mezer, které se používají k obrysu obrazce.StrokeDashOffset
, typudouble
, určuje vzdálenost v pomlčkovém vzoru, kde začíná pomlčka. Výchozí hodnota této vlastnosti je 0,0.StrokeLineCap
, typuPenLineCap
, popisuje obrazec na začátku a na konci čáry nebo segmentu. Výchozí hodnota této vlastnosti jePenLineCap.Flat
.StrokeLineJoin
, typuPenLineJoin
, určuje typ spojení, které se používá na vrcholech obrazce. Výchozí hodnota této vlastnosti jePenLineJoin.Miter
.StrokeMiterLimit
, typudouble
, určuje omezení poměru délky miteru na polovinuStrokeThickness
obrazce. Výchozí hodnota této vlastnosti je 10,0.StrokeThickness
, typudouble
označuje šířku obrysu obrazce. Výchozí hodnota této vlastnosti je 1,0.
Tyto vlastnosti jsou podporovány BindableProperty
objekty, což znamená, že mohou být cíle datových vazeb a stylovány.
Xamarin.Forms definuje počet objektů, které jsou odvozeny z Shape
třídy. Jedná se Ellipse
o , , Line
Path
, Polygon
, Polyline
a Rectangle
.
Malování obrazců
Brush
objekty se používají k malování obrazců Stroke
a Fill
:
<Ellipse Fill="DarkBlue"
Stroke="Red"
StrokeThickness="4"
WidthRequest="150"
HeightRequest="50"
HorizontalOptions="Start" />
V tomto příkladu jsou zadány tahy a výplně Ellipse
:
Důležité
Brush
objekty používají převaděč typů, který umožňuje Color
zadání hodnot pro Stroke
vlastnost.
Pokud neurčíte Brush
objekt pro Stroke
hodnotu 0 nebo pokud nastavíte StrokeThickness
hodnotu 0, nebude ohraničení kolem obrazce nakresleno.
Další informace o Brush
objektech naleznete v tématu Xamarin.Forms Štětce. Další informace o platných Color
hodnotách naleznete v tématu Barvy v Xamarin.Forms.
Roztažení obrazců
Shape
objekty mají Aspect
vlastnost typu Stretch
. Tato vlastnost určuje, jak Shape
se obsah objektu roztáhne tak, aby vyplnil Shape
prostor rozložení objektu. Prostor Shape
rozložení objektu je velikost prostoru, který Shape
je přidělen Xamarin.Forms systémem rozložení, a to z důvodu explicitního WidthRequest
a HeightRequest
nastavení nebo z důvodu jeho HorizontalOptions
a VerticalOptions
nastavení.
Výčet Stretch
definuje následující členy:
None
, což označuje, že obsah zachovává původní velikost. Toto je výchozí hodnotaShape.Aspect
vlastnosti.Fill
, což označuje, že obsah je změněn tak, aby vyplnil cílové dimenze. Poměr stran není zachován.Uniform
, což označuje, že obsah se mění tak, aby odpovídal cílovým dimenzím a zachoval poměr stran.UniformToFill
, označuje, že obsah je změněn tak, aby vyplnil cílové rozměry při zachování poměru stran. Pokud se poměr stran cílového obdélníku liší od zdroje, zdrojový obsah se vystřihne tak, aby se vešel do cílových dimenzí.
Následující XAML ukazuje, jak nastavit Aspect
vlastnost:
<Path Aspect="Uniform"
Stroke="Yellow"
Fill="Red"
BackgroundColor="LightGray"
HorizontalOptions="Start"
HeightRequest="100"
WidthRequest="100">
<Path.Data>
<!-- Path data goes here -->
</Path.Data>
</Path>
V tomto příkladu objekt Path
nakreslí srdce. Objekt Path
a vlastnosti jsou nastaveny na 100 jednotek nezávislých na zařízení a jeho Aspect
vlastnost je nastavena na Uniform
.HeightRequest
WidthRequest
V důsledku toho se obsah objektu mění tak, aby odpovídal cílovým dimenzím a zachoval poměr stran:
Kreslení přerušovaných obrazců
Shape
objekty mají StrokeDashArray
vlastnost typu DoubleCollection
. Tato vlastnost představuje kolekci double
hodnot, které označují vzor pomlček a mezer, které se používají k obrysu obrazce. A DoubleCollection
je hodnota ObservableCollection
double
. Každá double
z kolekcí určuje délku pomlčky nebo mezery. První položka v kolekci, která se nachází v indexu 0, určuje délku pomlčky. Druhá položka v kolekci, která se nachází v indexu 1, určuje délku mezery. Objekty s sudou hodnotou indexu proto určují pomlčky, zatímco objekty s lichou hodnotou indexu určují mezery.
Shape
objekty mají StrokeDashOffset
také vlastnost typu double
, která určuje vzdálenost v rámci vzoru pomlčky, kde začíná pomlčka. Pokud tuto vlastnost nastavíte, bude mít plnou osnovu Shape
.
Přerušované obrazce lze kreslit nastavením obou StrokeDashArray
StrokeDashOffset
vlastností. Vlastnost StrokeDashArray
by měla být nastavena na jednu nebo více double
hodnot s každou dvojicí oddělenou jednou čárkou a/nebo jednou nebo více mezerami. Například "0.5 1.0" a "0,5,1.0" jsou obě platné.
Následující příklad XAML ukazuje, jak nakreslit přerušovaný obdélník:
<Rectangle Fill="DarkBlue"
Stroke="Red"
StrokeThickness="4"
StrokeDashArray="1,1"
StrokeDashOffset="6"
WidthRequest="150"
HeightRequest="50"
HorizontalOptions="Start" />
V tomto příkladu se nakreslí vyplněný obdélník přerušovaným tahem:
Řídicí čára končí
Čára má tři části: počáteční čepici, tělo čáry a koncovou čepici. Počáteční a koncová zakončení popisují obrazec na začátku a konci čáry nebo segmentu.
Shape
objekty mají StrokeLineCap
vlastnost typu PenLineCap
, která popisuje obrazec na začátku a konci čáry nebo segmentu. Výčet PenLineCap
definuje následující členy:
Flat
, který představuje zakončení, které se neprodlouží za poslední bod čáry. To je srovnatelné s žádným limitem řádku a je výchozí hodnotouStrokeLineCap
vlastnosti.Square
, který představuje obdélník, který má výšku rovnou tloušťku čáry a délku rovnající se polovině tloušťky čáry.Round
, který představuje středník, který má průměr, který se rovná tloušťkě čáry.
Důležité
Vlastnost StrokeLineCap
nemá žádný vliv, pokud ji nastavíte na obrazec, který nemá žádné počáteční nebo koncové body. Například tato vlastnost nemá žádný vliv, pokud ji nastavíte na objekt nebo Ellipse
Rectangle
.
Následující XAML ukazuje, jak nastavit StrokeLineCap
vlastnost:
<Line X1="0"
Y1="20"
X2="300"
Y2="20"
StrokeLineCap="Round"
Stroke="Red"
StrokeThickness="12" />
V tomto příkladu je červená čára zaokrouhlená na začátku a na konci řádku:
Spojení řídicích čar
Shape
objekty mají StrokeLineJoin
vlastnost typu PenLineJoin
, která určuje typ spojení, které se používá na vrcholech obrazce. Výčet PenLineJoin
definuje následující členy:
Miter
, který představuje pravidelné úhlové vrcholy. Toto je výchozí hodnotaStrokeLineJoin
vlastnosti.Bevel
, který představuje zkosené vrcholy.Round
, který představuje zaokrouhlené vrcholy.
Poznámka:
StrokeLineJoin
Pokud je vlastnost nastavena na Miter
, StrokeMiterLimit
lze vlastnost nastavit na double
omezení délky miter spojnic v obrazci.
Následující XAML ukazuje, jak nastavit StrokeLineJoin
vlastnost:
<Polyline Points="20 20,250 50,20 120"
Stroke="DarkBlue"
StrokeThickness="20"
StrokeLineJoin="Round" />
V tomto příkladu má tmavě modrá křivka zaokrouhlené spojení na vrcholech: