Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings
This repository was archived by the owner on Nov 5, 2020. It is now read-only.
/MapViewPlusPublic archive

Use any custom view as custom callout view for MKMapView with cool animations. Use any image as annotation view.

License

NotificationsYou must be signed in to change notification settings

okhanokbay/MapViewPlus

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

35 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Swift 5.0iOS 10.0+VersionLicensePlatform

About

MapViewPlus gives you the missing methods of MapKit which are:imageForAnnotation andcalloutViewForAnnotationView delegate methods.

  • Return any UIImage fromimageForAnnotation (image shouldn't have paddings)
  • Create any UIView to use as your custom callout view and return it fromcalloutViewForAnnotationView
  • MapViewPlus will:
    1. Add an anchor view to bottom of your callout view
    2. Combine callout view with the anchor view and add shadow to both of them
    3. Add a cool animation toCalloutAndAnchorView
    4. Make it user interaction enabled (this may be easy but tricky sometimes)
    5. Scrolls map view to show the callout view completely after tapping the annotation view
    6. Even give a ready-to-use template for callout view
    7. Forward all of the delegate methods ofMKMapView to your subclass ofMapViewPlus (exceptmapView:viewForAnnotation:)

Requirements

  • Swift 5.0
  • iOS 10.0+

Installation

MapViewPlus is available throughCocoaPods. To installit, simply add the following line to your Podfile:

pod'MapViewPlus'

If you don't use CocoaPods, you can drag and drop all the classes and use it in your project.

How to use

1) If you are using Interface Builder, set your map view's class and module as MapViewPlus:

2) Setup your Callout View Model:

import UIKitimport MapViewPlus// CalloutViewModel is a protocol of MapVieWPlus. Currently, it has no requirements to its conformant classes.classYourCalloutViewModel:CalloutViewModel{vartitle:Stringvarimage:UIImageinit(title:String, image:UIImage){self.title= titleself.image= image}}

3) Setup your CalloutView:

  • Create any view in an xib file (or programmatically):

  • Wire your view to your callout view class:
import UIKitimport MapViewPlus// CalloutViewPlus is a protocol of MapViewPlus. // Currently, it has just one requirement -> func configureCallout(_ viewModel: CalloutViewModel)classYourCalloutView:UIView,CalloutViewPlus{@IBOutlet weakvarlabel:UILabel!@IBOutlet weakvarimageView:UIImageView!func configureCallout(_ viewModel:CalloutViewModel){letviewModel= viewModelas!YourCalloutViewModel    label.text= viewModel.title    imageView.image= viewModel.image}}

4) Setup your Annotations in your View Controller:

import UIKitimport CoreLocationimport MapViewPlusclassYourViewController:UIViewController{@IBOutlet weakvarmapView:MapViewPlus!overridefunc viewDidLoad(){    super.viewDidLoad()    //Required    mapView.delegate=selfletviewModel=YourCalloutViewModel(title:"Cafe", image:UIImage(named:"cafe.png")!)letannotation=AnnotationPlus(viewModel: viewModel,                                    coordinate:CLLocationCoordinate2DMake(50.11,8.68))varannotations:[AnnotationPlus]=[]    annotations.append(annotation)    mapView.setup(withAnnotations: annotations)}}

5) Return the image for Annotation and the View for Callout

extensionYourViewController:MapViewPlusDelegate{func mapView(_ mapView:MapViewPlus, imageFor annotation:AnnotationPlus)->UIImage{returnUIImage(named:"your_annotation_image.png")!}func mapView(_ mapView:MapViewPlus, calloutViewFor annotationView:AnnotationViewPlus)->CalloutViewPlus{letcalloutView=Bundle.main.loadNibNamed("YourCalloutView", owner:nil, options:nil)!.firstas!YourCalloutViewreturn calloutView}}

This is it. You are all set and ready to go now.

Customization (Optional)

MapViewPlus is highly customizable:

CalloutViewCustomizerDelegate

  • Change the center of the callout view related to anchor view and callout view:
func mapView(_ mapView:MapViewPlus, centerForCalloutViewOf annotationView:AnnotationViewPlus)->CalloutViewPlusCenter
  • Change the bounds for callout view without changing the frames in Interface Builder. If you don't use this delegate method, then your callout view's frame will stay the same as the Interface Builder file. You can also use this to change frame dynamically according to the data in callout view!
func mapView(_ mapView:MapViewPlus, boundsForCalloutViewOf annotationView:AnnotationViewPlus)->CalloutViewPlusBound
  • Change the inset of anchor view related to callout view. Anchor view will go under the callout view as amount the value you returned from this method. Defaults to 0.
func mapView(_ mapView:MapViewPlus, insetFor calloutView:CalloutViewPlus)->CGFloat
  • Change the animation type forshowing the callout view. Defaults to.fromBottom and available types are,.fromTop,.fromBottom,.fromLeft,.fromRight
func mapView(_ mapView:MapViewPlus, animationTypeForShowingCalloutViewOf annotationView:AnnotationViewPlus)->CalloutViewShowingAnimationType
  • Change the animation type forhiding the callout view. Defaults to.toBottom and available types are,.toTop,.toBottom,.toLeft,.toRight
func mapView(_ mapView:MapViewPlus, animationTypeForHidingCalloutViewOf annoationView:AnnotationViewPlus)->CalloutViewHidingAnimationType

AnchorViewCustomizerDelegate

  • Change the height for anchor. Anchor viewwill always draw a equilateral triangle by taking the value you supplied as the triangle's height. You can change the height and the anchor view will calculate the necessary size for you:
func mapView(_ mapView:MapViewPlus, heightForAnchorOf calloutView:CalloutViewPlus)->CGFloat
  • Change the background color of anchor view. This is very important. You can supply any color you want for the anchor view. Generally you would like to make this color as same as the background color of your callout view. Just change it like:
func mapView(_ mapView:MapViewPlus, fillColorForAnchorOf calloutView:CalloutViewPlus)->UIColor

Notes

DefaultCalloutView

  • MapViewPlus supplies you a ready-to-go template for callout view. You can see the usage example of it in the example project.
  • It allows you to specify the source of the image. It has three options:
    1. .downloadable(imageURL: URL, placeholder: UIImage?)
      • Downloads the image with the help of Kingfisher framework
    2. .fromBundle(image: UIImage)
    3. .none

Forwarding Delegate Methods

MapViewPlus uses methods fromMKMapViewDelegate, but not all of them. It forwards all of the delegate methods exceptmapView:viewForAnnotation:. This method is used internally and won't be redirected to your subclass.

Normally,MapViewPlus will abstract you fromMapKit when you don't want to use the other methods ofMKMapViewDelegate. But when you want to use the other methods fromMKMapViewDelegate, you can easily do that without any extra efforts. Just write them down and they will get called byMapViewPlusDelegate. Please see howmapView(_:regionDidChangeAnimated:) method is being called inDefaultCalloutViewController.swift (in the example project) even if you don't conform toMKMapViewDelegate. If in the future, some new methods are added toMKMapViewDelegate, they will be automagically forwarded to you byMapViewPlusDelegate without a new version of the framework. There is no wrapping occuring in the background.

Example

To run the example project, clone the repo, and runpod install from the Example directory first.

Screenshots

License

MapViewPlus is available under the MIT license. See the LICENSE file for more info.

About

Use any custom view as custom callout view for MKMapView with cool animations. Use any image as annotation view.

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Contributors2

  •  
  •  

[8]ページ先頭

©2009-2026 Movatter.jp