Xamarin.Forms Mnohoúhelníky mapy a čar

Stáhnout ukázku Stažení ukázky

PolygonPrvky Polyline , a umožňují Circle zvýraznit konkrétní oblasti na mapě. Je Polygon plně uzavřený tvar, který může mít barvu tahu a výplně. A Polyline je čára, která zcela neuvozuje oblast. CircleZvýrazní kruhovou oblast mapy:

a čar na mapě "Snímek obrazovky mnohoúhelníku a čar mapy, viOSu a Androidu– Mnohoúhelník a line na mapě – Kruh na mapě –Snímek kruhu mapyv iOSu a Androidu – Kruh na mapě

Třídy PolygonPolyline , Circle a jsou odvozené od MapElement třídy , která zpřístupňuje následující vázání vlastností:

  • StrokeColor je Color objekt, který určuje barvu čáry.
  • StrokeWidth je float objekt, který určuje šířku čáry.

Třída Polygon definuje další vlastnost s váže:

  • FillColor je Color objekt, který určuje barvu pozadí mnohoúhelníku.

Třídy a navíc definují vlastnost , což je seznam objektů, které určují PolygonPolyline body GeoPathPosition tvaru.

Třída Circle definuje následující vázání vlastností:

  • Center je objekt, který definuje střed kruhu v zeměpisné šířce a Position délce.
  • Radius je Distance objekt, který definuje poloměr kruhu v metrech, kilometrůch nebo milách.
  • FillColor je Color vlastnost, která určuje barvu v kruhu.

Poznámka

Pokud vlastnost StrokeColor není zadaná, tah se ve výchozím nastavení zobrazí jako černá. Pokud vlastnost FillColor nezadáte, výplň se ve výchozím nastavení zobrazí jako transparentní. Proto pokud není zadána žádná vlastnost, tvar bude mít černou osnovu bez výplně.

Vytvoření mnohoúhelníku

Objekt lze přidat do mapy vytvořením Polygon instance a jeho přidáním do kolekce MapElements mapy. V jazyce XAML to lze provést takto:

<ContentPage ...
             xmlns:maps="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps">
     <maps:Map>
         <maps:Map.MapElements>
             <maps:Polygon StrokeColor="#FF9900"
                           StrokeWidth="8"
                           FillColor="#88FF9900">
                 <maps:Polygon.Geopath>
                     <maps:Position>
                         <x:Arguments>
                             <x:Double>47.6368678</x:Double>
                             <x:Double>-122.137305</x:Double>
                         </x:Arguments>
                     </maps:Position>
                     ...
                 </maps:Polygon.Geopath>
             </maps:Polygon>
         </maps:Map.MapElements>
     </maps:Map>
</ContentPage>

Ekvivalentní kód jazyka C# je:

using Xamarin.Forms.Maps;
// ...
Map map = new Map
{
  // ...
};

// instantiate a polygon
Polygon polygon = new Polygon
{
    StrokeWidth = 8,
    StrokeColor = Color.FromHex("#1BA1E2"),
    FillColor = Color.FromHex("#881BA1E2"),
    Geopath =
    {
        new Position(47.6368678, -122.137305),
        new Position(47.6368894, -122.134655),
        new Position(47.6359424, -122.134655),
        new Position(47.6359496, -122.1325521),
        new Position(47.6424124, -122.1325199),
        new Position(47.642463,  -122.1338932),
        new Position(47.6406414, -122.1344833),
        new Position(47.6384943, -122.1361248),
        new Position(47.6372943, -122.1376912)
    }
};

// add the polygon to the map's MapElements collection
map.MapElements.Add(polygon);

Vlastnosti StrokeColorStrokeWidth a jsou určeny k přizpůsobení mnohoúhelníkového obrysu. Hodnota vlastnosti odpovídá hodnotě vlastnosti, ale má zadanou hodnotu alfa, aby byla transparentní, což umožňuje, aby byla podkladová mapa viditelná FillColorStrokeColor prostřednictvím tvaru. Vlastnost GeoPath obsahuje seznam objektů Position definujících zeměpisné souřadnice mnohoúhelníkových bodů. Po přidání objektu do kolekce objektu se na mapě PolygonMapElements vykreslí objekt Map .

Poznámka

A Polygon je plně uzavřený tvar. První a poslední bod se automaticky připojí, pokud se neshodují.

Vytvoření line

Objekt lze přidat do mapy vytvořením Polyline instance a jeho přidáním do kolekce MapElements mapy. V jazyce XAML to lze provést takto:

<ContentPage ...
             xmlns:maps="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps">
     <maps:Map>
         <maps:Map.MapElements>
             <maps:Polyline StrokeColor="Blue"
                            StrokeWidth="12">
                 <maps:Polyline.Geopath>
                     <maps:Position>
                         <x:Arguments>
                             <x:Double>47.6381401</x:Double>
                             <x:Double>-122.1317367</x:Double>
                         </x:Arguments>
                     </maps:Position>
                     ...
                 </maps:Polyline.Geopath>
             </maps:Polyline>
         </maps:Map.MapElements>
     </maps:Map>
</ContentPage>
using Xamarin.Forms.Maps;
// ...
Map map = new Map
{
  // ...
};
// instantiate a polyline
Polyline polyline = new Polyline
{
    StrokeColor = Color.Blue,
    StrokeWidth = 12,
    Geopath =
    {
        new Position(47.6381401, -122.1317367),
        new Position(47.6381473, -122.1350841),
        new Position(47.6382847, -122.1353094),
        new Position(47.6384582, -122.1354703),
        new Position(47.6401136, -122.1360819),
        new Position(47.6403883, -122.1364681),
        new Position(47.6407426, -122.1377019),
        new Position(47.6412558, -122.1404056),
        new Position(47.6414148, -122.1418647),
        new Position(47.6414654, -122.1432702)
    }
};

// add the polyline to the map's MapElements collection
map.MapElements.Add(polyline);

K StrokeColorStrokeWidth přizpůsobení řádku se zadá vlastnosti a . Vlastnost GeoPath obsahuje seznam objektů Position definujících zeměpisné souřadnice bodů line. Po přidání objektu do kolekce objektu se na mapě PolylineMapElements vykreslí objekt Map .

Vytvoření kruhu

Objekt lze přidat do mapy vytvořením Circle instance a jeho přidáním do kolekce MapElements mapy. V jazyce XAML to lze provést takto:

<ContentPage ...
             xmlns:maps="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps">
      <maps:Map>
          <maps:Map.MapElements>
              <maps:Circle StrokeColor="#88FF0000"
                           StrokeWidth="8"
                           FillColor="#88FFC0CB">
                  <maps:Circle.Center>
                      <maps:Position>
                          <x:Arguments>
                              <x:Double>37.79752</x:Double>
                              <x:Double>-122.40183</x:Double>
                          </x:Arguments>
                      </maps:Position>
                  </maps:Circle.Center>
                  <maps:Circle.Radius>
                      <maps:Distance>
                          <x:Arguments>
                              <x:Double>250</x:Double>
                          </x:Arguments>
                      </maps:Distance>
                  </maps:Circle.Radius>
              </maps:Circle>             
          </maps:Map.MapElements>
          ...
      </maps:Map>
</ContentPage>

Ekvivalentní kód jazyka C# je:

using Xamarin.Forms.Maps;
// ...
Map map = new Map();

// Instantiate a Circle
Circle circle = new Circle
{
    Center = new Position(37.79752, -122.40183),
    Radius = new Distance(250),
    StrokeColor = Color.FromHex("#88FF0000"),
    StrokeWidth = 8,
    FillColor = Color.FromHex("#88FFC0CB")
};

// Add the Circle to the map's MapElements collection
map.MapElements.Add(circle);

Umístění objektu na Circle objektu Map je určeno hodnotou vlastností a CenterRadius . Vlastnost definuje střed kruhu v zeměpisné šířce a délce, zatímco vlastnost definuje poloměr kruhu CenterRadius v metrech. Vlastnosti StrokeColorStrokeWidth a jsou určeny k přizpůsobení obrysu kruhu. Hodnota FillColor vlastnosti určuje barvu v kruhu. Obě hodnoty barev určují alfa kanál, který umožňuje, aby byla podkladová mapa viditelná prostřednictvím kruhu. Objekt Circle se vykreslí na mapě po jeho přidání do MapElements kolekce Map .

Poznámka

Třída má rozšiřující metodu, která převádí objekt (který definuje hodnoty vlastností a ) na seznam objektů, které tvoří souřadnice zeměpisné šířky a délky ohraničení GeographyUtilsToCircumferencePositionsCircleCenterRadiusPosition kruhu.