Customize map view

This guide will cover customization of the mapview, such as choosing your own hero marker, show/hide UI elements on the map.

Setup Customization Delegate

HTViewCustomizationDelegate Delegate protocol methods deals with the way the map view appear. After iniitializing HyperTrack Map instance and embeding it in your view as described here, you have to set up the HyperTrack's customization delegate.

class MapViewController: UIViewController, HTViewCustomizationDelegate {
    override func viewDidAppear() {
        super.viewDidAppear()
        // initialize HyperTrack Map and embed it in your view
            ...
        // Configure view customization delegate in HyperTrack map
        hyperTrackMap.setHTViewCustomizationDelegate(customizationDelegate: self)
    }
}
@interface MapViewController() <HTViewCustomizationDelegate>

...

@end

@implementation MapViewController

- (void)viewDidAppear {
    [super viewDidAppear];
    // initialize HyperTrack Map and embed it in your view
        ...
    // Configure view customization delegate in HyperTrack map
    [map setHTViewCustomizationDelegateWithCustomizationDelegate:self];
}

@end

Customize Info View

Info view shows the details about the action like the eta, distnace remaining and the current status of user to whom the action is assigned.

Address Info

The default behaviour shows the info view on the map. You can show/hide it by implementing the following delegate method.

func showInfoViewForActionID(map: HTMap, actionID: String) -> Bool {
    return false
}
- (BOOL) showInfoViewForActionIDWithMap:(HTMap *)map actionID:(NSString *)actionID {
    return false;
}

If you are looking for adding your own info view on top of HyperTrack's map view then you should hide HyperTrack's info view. For refreshing your info view, you have to setup an event delegate and implement the delegate method didRefreshData to listen for updates on action object.

class MapViewController: UIViewController, HTViewCustomizationDelegate,HTEventsDelegate {
    override func viewDidAppear() {
        super.viewDidAppear()
        // setup Hypertrack's event delegate 
        HyperTrack.setEventsDelegate(eventDelegate: self)
    }

     func didRefreshData(forAction: HyperTrackAction){
        // use the status info object to update your info view
        var statusInfo = forAction.getStatusCardInfo()

        // update your info view based on status info object

    }
}
@interface MapViewController() <HTViewCustomizationDelegate>

...

@end

@implementation MapViewController

    - (void)viewDidAppear {
            [super viewDidAppear];
            // setup Hypertrack's event delegate 
         [HyperTrack setEventsDelegateWithEventDelegate:self];
    }

    - (void)didRefreshDataForAction:(HyperTrackAction * _Nonnull)forAction{

         // use the status info object to update your info view
        HTStatusInfo * statusInfo = [forAction getStatusCardInfo];

        // update your info view based on status info object

    }

@end

Customizing User's Marker

You can customize the user marker by implementing the following delegate method of HTViewCustomizationDelegate. You have to return an image to which you want to change the marker.

func heroMarkerImageForActionID(map: HTMap, actionID: String) -> UIImage {
        let image = UIImage.init(named: "customMarker")
        return image
}
-(UIImage *)heroMarkerImageForActionIDWithMap:(HTMap *)map actionID:(NSString *)actionID{
    UIImage * image = [UIImage imageNamed:@"customMarker"];
    return image;
}

Customize Destination Marker

You can customize the destination marker by implementing the following delegate method of HTViewCustomizationDelegate. You have to return an image to which you want to change the marker.

func expectedPlaceMarkerImageForActionID(map: HTMap, actionID: String) -> UIImage {
    let image = UIImage.init(named: "customDestinationMarker")
    return image!
}

-(UIImage *)expectedPlaceMarkerImageForActionIDWithMap:(HTMap *)map actionID:(NSString *)actionID{
    UIImage * image = [UIImage imageNamed:@"customDestinationMarker"];
    return image;
}

results matching ""

    No results matching ""