我希望在地图上使用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
添加多个按钮?
因为我所见过的所有教程都只是“如何添加细节按钮”。
答案 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
}
}
答案 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
}
像魅力一样工作