将缺失的三角形（工具提示）添加到标注自定义 MKAnnotationView 子类

Question

我创建了一个自定义 MKAnnotationView，它工作正常，但它弹出为一个矩形，没有三角形（与漫画中有人说话时的三角形相同），它是从图钉中出来的。有没有办法自动添加三角形？

这是我的 MKAnnotationView 子类：

class ShikmimAnnotationView: MKAnnotationView{

let selectedLabel:UILabel = UILabel.init(frame:CGRect(x: 0, y: 0, width: 140, height: 40))

override func setSelected(_ selected: Bool, animated: Bool) {
    super.setSelected(false, animated: animated)
    if(selected)
    {
        // Do customization, for example:
        //let defaults = UserDefaults.standard

        selectedLabel.font = UIFont(name: "Heebo-Regular.ttf", size: 18)
        selectedLabel.text = "(גדליהו אלון 13, ירושלים\n     (3 דק' הגעה"
        selectedLabel.numberOfLines = 3
        selectedLabel.sizeToFit()
        selectedLabel.textColor = UIColor.white
        selectedLabel.textAlignment = .center
        selectedLabel.backgroundColor = UIColor.darkGray
        selectedLabel.layer.borderColor = UIColor.white.cgColor
        selectedLabel.layer.borderWidth = 2
        selectedLabel.layer.cornerRadius = 5
        selectedLabel.layer.masksToBounds = true

        selectedLabel.center.x = 0.5 * self.frame.size.width;
        selectedLabel.center.y = -0.5 * selectedLabel.frame.height;
        self.addSubview(selectedLabel)
        self.image = UIImage(named: "map_pin_next_stop-2.png")

    }
    else
    {
        selectedLabel.removeFromSuperview()
    }
}
}

这是我在 VC 中初始化它的方式：

   internal func mapView(_ mapView: MKMapView, viewFor annotation: MKAnnotation) -> MKAnnotationView? {

    if let annotation = annotation as? MyLocation {
        let identifier = "reuse"
        var view: ShikmimAnnotationView
        if let dequeuedView = mapView.dequeueReusableAnnotationView(withIdentifier: identifier){
            dequeuedView.annotation = annotation
            view = dequeuedView as! ShikmimAnnotationView
        } else {
            view = ShikmimAnnotationView(annotation: annotation, reuseIdentifier: identifier)
            view.image = UIImage(named: "map_pin_next_stop-2.png")
            view.canShowCallout = false
            //view.calloutOffset = CGPoint(x: -5, y: 5)
            //view.rightCalloutAccessoryView = UIButton(type: .detailDisclosure) as UIView
        }

        return view
    }
    return nil
}

Answer 1

您可以使用 BezierPath 绘制这个三角形。这是此视图的 class。您可以在情节提要中设置视图大小或在 ShikmimAnnotationView 中以编程方式设置视图 class.

class TriangleView: UIView {

let shapeLayer = CAShapeLayer()

override func drawRect(rect: CGRect) {

    // Get Height and Width
    let layerHeight = self.layer.frame.height
    let layerWidth = self.layer.frame.width

    // Create Path
    let bezierPath = UIBezierPath()

    // Draw Points
    bezierPath.moveToPoint(CGPoint(x: 0, y: 0))
    bezierPath.addLineToPoint(CGPoint(x: layerWidth, y: 0))
    bezierPath.addLineToPoint(CGPoint(x: layerWidth / 2, y: layerHeight))
    bezierPath.addLineToPoint(CGPoint(x: 0, y: 0))
    bezierPath.closePath()

    // Apply Color
    UIColor(red: (2/255), green: (35/255), blue: (73/255), alpha: 1).setFill()
    bezierPath.fill()

    // Mask to Path

    shapeLayer.path = bezierPath.CGPath
    self.layer.mask = shapeLayer
  }
}

将缺失的三角形（工具提示）添加到标注自定义 MKAnnotationView 子类

Adding missing triangle(tooltip) to callout custom MKAnnotationView subclass

mapkit

mkannotationview

swift