iOS 11'de MapKit'teki Yeni Özellikler
iOS 11, MapKit'e aşağıdaki yeni özellikleri ekler:
Yakınlaştırma sırasında işaretçileri otomatik olarak gruplandırma
Örnekte, yeni iOS 11 ek açıklama kümeleme özelliğinin nasıl uygulandığı gösterilmektedir.
1. Alt sınıf oluşturma MKPointAnnotation
Nokta ek açıklama sınıfı, haritadaki her işaretçiyi temsil eder. Kullanılarak veya kullanılarak bir diziden MapView.AddAnnotations()
tek tek MapView.AddAnnotation()
eklenebilirler.
Nokta ek açıklama sınıflarının görsel gösterimi yoktur; yalnızca işaretçiyle ilişkili verileri (en önemlisi, Coordinate
haritadaki enlem ve boylam olan özellik) ve tüm özel özellikleri temsil etmek için gereklidir:
public class Bike : MKPointAnnotation
{
public BikeType Type { get; set; } = BikeType.Tricycle;
public Bike(){}
public Bike(NSNumber lat, NSNumber lgn, NSNumber type)
{
Coordinate = new CLLocationCoordinate2D(lat.NFloatValue, lgn.NFloatValue);
switch(type.NUIntValue) {
case 0:
Type = BikeType.Unicycle;
break;
case 1:
Type = BikeType.Tricycle;
break;
}
}
}
2. Tek işaretçiler için alt MKMarkerAnnotationView
sınıf oluşturma
İşaretçi ek açıklaması görünümü, her ek açıklamanın görsel gösterimidir ve aşağıdaki gibi özellikler kullanılarak stillendirilir:
- MarkerTintColor : İşaretçinin rengi.
- GlyphText : İşaretçide görüntülenen metin.
- GlyphImage : İşaretçide görüntülenen görüntüyü ayarlar.
- DisplayPriority – Harita işaretçilerle dolu olduğunda z sırasını (yığınlama davranışını) belirler. , veya
DefaultHigh
DefaultLow
türlerindenRequired
birini kullanın.
Otomatik kümelemeye destek olmak için şunları da ayarlamanız gerekir:
- ClusteringIdentifier – Bu, hangi işaretçilerin birlikte kümelendiğini denetler. Tüm işaretçileriniz için aynı tanımlayıcıyı kullanabilir veya bunların birlikte gruplandırma şeklini denetlemek için farklı tanımlayıcılar kullanabilirsiniz.
[Register("BikeView")]
public class BikeView : MKMarkerAnnotationView
{
public static UIColor UnicycleColor = UIColor.FromRGB(254, 122, 36);
public static UIColor TricycleColor = UIColor.FromRGB(153, 180, 44);
public override IMKAnnotation Annotation
{
get {
return base.Annotation;
}
set {
base.Annotation = value;
var bike = value as Bike;
if (bike != null){
ClusteringIdentifier = "bike";
switch(bike.Type){
case BikeType.Unicycle:
MarkerTintColor = UnicycleColor;
GlyphImage = UIImage.FromBundle("Unicycle");
DisplayPriority = MKFeatureDisplayPriority.DefaultLow;
break;
case BikeType.Tricycle:
MarkerTintColor = TricycleColor;
GlyphImage = UIImage.FromBundle("Tricycle");
DisplayPriority = MKFeatureDisplayPriority.DefaultHigh;
break;
}
}
}
}
3. İşaretçi kümelerini temsil etmek için oluşturma MKAnnotationView
bir işaretçi kümesini temsil eden ek açıklama görünümü basit bir görüntü olsa da, kullanıcılar uygulamanın birlikte gruplandırılan işaretçi sayısı hakkında görsel ipuçları sağlamasını bekler.
Örnek, kümedeki işaretçi sayısını işlemek için CoreGraphics'i ve her işaretçi türünün oranının daire grafiği gösterimini kullanır.
Ayrıca şunları da ayarlamalısınız:
- DisplayPriority – Harita işaretçilerle dolu olduğunda z sırasını (yığınlama davranışını) belirler. , veya
DefaultHigh
DefaultLow
türlerindenRequired
birini kullanın. - CollisionMode –
Circle
veyaRectangle
.
[Register("ClusterView")]
public class ClusterView : MKAnnotationView
{
public static UIColor ClusterColor = UIColor.FromRGB(202, 150, 38);
public override IMKAnnotation Annotation
{
get {
return base.Annotation;
}
set {
base.Annotation = value;
var cluster = MKAnnotationWrapperExtensions.UnwrapClusterAnnotation(value);
if (cluster != null)
{
var renderer = new UIGraphicsImageRenderer(new CGSize(40, 40));
var count = cluster.MemberAnnotations.Length;
var unicycleCount = CountBikeType(cluster.MemberAnnotations, BikeType.Unicycle);
Image = renderer.CreateImage((context) => {
// Fill full circle with tricycle color
BikeView.TricycleColor.SetFill();
UIBezierPath.FromOval(new CGRect(0, 0, 40, 40)).Fill();
// Fill pie with unicycle color
BikeView.UnicycleColor.SetFill();
var piePath = new UIBezierPath();
piePath.AddArc(new CGPoint(20,20), 20, 0, (nfloat)(Math.PI * 2.0 * unicycleCount / count), true);
piePath.AddLineTo(new CGPoint(20, 20));
piePath.ClosePath();
piePath.Fill();
// Fill inner circle with white color
UIColor.White.SetFill();
UIBezierPath.FromOval(new CGRect(8, 8, 24, 24)).Fill();
// Finally draw count text vertically and horizontally centered
var attributes = new UIStringAttributes() {
ForegroundColor = UIColor.Black,
Font = UIFont.BoldSystemFontOfSize(20)
};
var text = new NSString($"{count}");
var size = text.GetSizeUsingAttributes(attributes);
var rect = new CGRect(20 - size.Width / 2, 20 - size.Height / 2, size.Width, size.Height);
text.DrawString(rect, attributes);
});
}
}
}
public ClusterView(){}
public ClusterView(MKAnnotation annotation, string reuseIdentifier) : base(annotation, reuseIdentifier)
{
DisplayPriority = MKFeatureDisplayPriority.DefaultHigh;
CollisionMode = MKAnnotationViewCollisionMode.Circle;
// Offset center point to animate better with marker annotations
CenterOffset = new CoreGraphics.CGPoint(0, -10);
}
private nuint CountBikeType(IMKAnnotation[] members, BikeType type) {
nuint count = 0;
foreach(Bike member in members){
if (member.Type == type) ++count;
}
return count;
}
}
4. Görünüm sınıflarını kaydetme
Harita görünümü denetimi oluşturulduğunda ve bir görünüme eklendiğinde, harita yakınlaştırılıp uzaklaştırıldığında otomatik kümeleme davranışını etkinleştirmek için ek açıklama görünümü türlerini kaydedin:
MapView.Register(typeof(BikeView), MKMapViewDefault.AnnotationViewReuseIdentifier);
MapView.Register(typeof(ClusterView), MKMapViewDefault.ClusterAnnotationViewReuseIdentifier);
5. Haritayı işleyin!
Eşleme işlendiğinde, ek açıklama işaretçileri yakınlaştırma düzeyine bağlı olarak kümelenir veya işlenir. Yakınlaştırma düzeyi değiştikçe, işaretçiler kümelerin içinde ve dışında hareket eder.
MapKit ile veri görüntüleme hakkında daha fazla bilgi için Haritalar bölümüne bakın.
Pusula Düğmesi
iOS 11, pusulayı haritanın dışına çıkarma ve görünümün başka bir yerinde işleme özelliği ekler.
Pusulaya benzeyen bir düğme oluşturun (harita yönü değiştirildiğinde canlı animasyon dahil) ve bunu başka bir denetimde işler.
Aşağıdaki kod bir pusula düğmesi oluşturur ve gezinti çubuğunda işler:
var compass = MKCompassButton.FromMapView(MapView);
compass.CompassVisibility = MKFeatureVisibility.Visible;
NavigationItem.RightBarButtonItem = new UIBarButtonItem(compass);
MapView.ShowsCompass = false; // so we don't have two compasses!
özelliği, ShowsCompass
harita görünümünde varsayılan pusulanın görünürlüğünü denetlemek için kullanılabilir.
Ölçek Görünümü
Görünüm hiyerarşisinde başka bir yere eklemek üzere ölçek görünümünün bir örneğini almak için yöntemini kullanarak MKScaleView.FromMapView()
ölçeği görünümün başka bir yerinde ekleyin.
var scale = MKScaleView.FromMapView(MapView);
scale.LegendAlignment = MKScaleViewAlignment.Trailing;
scale.TranslatesAutoresizingMaskIntoConstraints = false;
View.AddSubview(scale); // constraints omitted for simplicity
MapView.ShowsScale = false; // so we don't have two scale displays!
özelliği, ShowsScale
harita görünümünde varsayılan pusulanın görünürlüğünü denetlemek için kullanılabilir.
Kullanıcı İzleme Düğmesi
Kullanıcı izleme düğmesi, haritayı kullanıcının geçerli konumuna ortalar. Düğmenin MKUserTrackingButton.FromMapView()
bir örneğini almak, biçimlendirme değişiklikleri uygulamak ve görünüm hiyerarşisinde başka bir yere eklemek için yöntemini kullanın.
var button = MKUserTrackingButton.FromMapView(MapView);
button.Layer.BackgroundColor = UIColor.FromRGBA(255,255,255,80).CGColor;
button.Layer.BorderColor = UIColor.White.CGColor;
button.Layer.BorderWidth = 1;
button.Layer.CornerRadius = 5;
button.TranslatesAutoresizingMaskIntoConstraints = false;
View.AddSubview(button); // constraints omitted for simplicity