如何向annotationView添加两个或更多按钮:MKAnnotationView?

时间:2017-04-14 08:30:47

标签: ios swift swift3 mapkit

我希望在地图上使用MKAnnotationView(使用MapKit)并使用下一个属性:

1)图片

2)详情按钮

3)另一个细节按钮

4)另一个细节按钮?

我实际上已经用下一个代码添加了图像和细节按钮:

annotationView.detailCalloutAccessoryView = snapshotView // snapshot view is a custom view
                                                         // with image and its constraints

let detailsButton = UIButton(type: .detailDisclosure)
annotationView.rightCalloutAccessoryView = detailsButton 

那么,问题是如何向MKAnnotationView添加多个按钮?

因为我所见过的所有教程都只是“如何添加细节按钮”。

2 个答案:

答案 0 :(得分:2)

您可以使用detailCalloutAccessoryView的{​​{1}}来实现这一目标。

如何使用MKAnnotationView扩展MKAnnotationView

UIStackView

如何实现这个:

extension MKAnnotationView {

    func conteiner(arrangedSubviews: [UIView]) {
        let stackView = UIStackView(arrangedSubviews: arrangedSubviews)
        stackView.axis = .vertical
        stackView.distribution = .fillEqually
        stackView.alignment = .fill
        stackView.spacing = 5
        stackView.autoresizingMask = [.flexibleLeftMargin, .flexibleRightMargin, .flexibleLeftMargin, .flexibleBottomMargin, .flexibleWidth, .flexibleHeight]
        stackView.translatesAutoresizingMaskIntoConstraints = false

        self.detailCalloutAccessoryView = stackView
    }
}

结果: enter image description here

答案 1 :(得分:1)

我做到了

从左侧和右侧的文档中,calloutAccessoryView的宽度和高度都很低。因此,我们只能在detailCalloutAccessoryView中添加按钮和图像。

这是我的代码。它正在发挥作用。我还没有做过评论。因为理解起来更清楚。

func mapView(_ mapView: MKMapView, didSelect view: MKAnnotationView) {
    if !(view.annotation! is MKUserLocation) {
        let customPin = view.annotation as! CustomPin
        self.spotDetailsForSendToPostsStripController = customPin.spotDetailsItem // its for sending to another controller.

        configureDetailView(annotationView: view, spotPin: customPin.spotDetailsItem)
    }
}

func mapView(_ mapView: MKMapView, viewFor annotation: MKAnnotation) -> MKAnnotationView? {
    if annotation is MKUserLocation {
        return nil
    }

    if !(annotation is CustomPin) {
        return nil
    }

    let identifier = "CustomPin"

    var annotationView = mapView.dequeueReusableAnnotationView(withIdentifier: identifier)
    if annotationView == nil {
        annotationView = MKPinAnnotationView(annotation: annotation, reuseIdentifier: identifier)
        annotationView?.canShowCallout = true
    } else {
        annotationView!.annotation = annotation
    }

    return annotationView
}

func configureDetailView(annotationView: MKAnnotationView, spotPin: SpotDetailsItem) {
    let width = 250
    let height = 250

    let snapshotView = UIView()
    let views = ["snapshotView": snapshotView]
    snapshotView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:[snapshotView(250)]", options: [], metrics: nil, views: views))
    snapshotView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:[snapshotView(250)]", options: [], metrics: nil, views: views))

    let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: width, height: height - 40))

    // configure button1
    let button1 = UIButton(frame: CGRect(x: 0, y: height - 35, width: width / 2 - 5, height: 35))
    button1.setTitle("Info", for: .normal)
    button1.backgroundColor = UIColor.darkGray
    button1.layer.cornerRadius = 5
    button1.layer.borderWidth = 1
    button1.layer.borderColor = UIColor.black.cgColor
    button1.addTarget(self, action: #selector(MainFormController.goToInfo), for: .touchDown)

    // configure button2
    let button2 = UIButton(frame: CGRect(x: width / 2 + 5, y: height - 35, width: width / 2, height: 35))
    button2.setTitle("Posts", for: .normal)
    button2.backgroundColor = UIColor.darkGray
    button2.layer.cornerRadius = 5
    button2.layer.borderWidth = 1
    button2.layer.borderColor = UIColor.black.cgColor
    button2.addTarget(self, action: #selector(MainFormController.goToPosts), for: .touchDown)

    // configure image
    let image = UIImage(contentsOfFile: "plus-512.gif")
    imageView.image = image // implement your own logic
    imageView.layer.cornerRadius = imageView.frame.size.height / 10
    imageView.layer.masksToBounds = true
    imageView.layer.borderWidth = 0
    imageView.contentMode = UIViewContentMode.scaleAspectFill

    // adding it to view
    snapshotView.addSubview(imageView)
    snapshotView.addSubview(button1)
    snapshotView.addSubview(button2)

    annotationView.detailCalloutAccessoryView = snapshotView
}

func goToPosts() {
    print("go to posts") // your implementation(segues and etc)
}

func goToInfo() {
    print("go to info") // your implementation(segues and etc)
}

CustomPin:

class CustomPin: MKPointAnnotation {
    var spotDetailsItem: SpotDetailsItem! // its my info of this place
}

像魅力一样工作

Result