הפעלת הניווט ב-CarPlay

חשוב: כל האפליקציות שפותחו לשימוש ב-CarPlay מחייבות הרשאה ל-CarPlay מ-Apple ועליהן לעמוד בהנחיות CarPlay. במדריך הזה מפורטות השיטות המקובלות, אבל עדיין צריך לשלוח את האפליקציה לאישור כדי להפעיל אותה ב-CarPlay. לקבלת פרטים נוספים, אפשר לעיין במדריך התכנות של אפליקציית CarPlay של Apple ובהנחיות לממשק האנושי של CarPlay.

בקטע הזה מוסבר איך להשתמש ב-API של הניווט עם הספרייה של Apple CarPlay כדי להציג את חוויית הניווט של האפליקציה ביחידות הראשיות (בראש הדף) שבלוח הציור. אם מערכת מרכז השליטה של הנהג תומכת ב-CarPlay, הנהגים יכולים להשתמש באפליקציה ישירות במסך הרכב על ידי חיבור הטלפון ליחידה. ההנחיה הקולית פועלת גם ברמקולים של הרכב.

היצירה של אפליקציית CarPlay מבוססת על קבוצה של תבניות לממשק המשתמש של Apple. האפליקציה אחראית לבחור את התבנית שתוצג ולספק את הנתונים שבתוכה.

במערכת שבלוח הבקרה מוצגים הרכיבים האינטראקטיביים שאושרו על ידי בטיחות, כדי שהנהג יוכל לנווט בבטחה ליעד שלו בלי הסחות דעת. בנוסף, תוכלו לתכנת את האפליקציה כך שהנהג יוכל להשתמש בתכונות ספציפיות לאפליקציה, כמו קבלה או דחייה של הזמנות או הצגת המיקום של הלקוח במפה. אפשר גם לתכנת את העדכונים של סטטוס ההזמנה כך שהם יופיעו ביחידה שבלוח הבקרה.

בתמונה שמופיעה בצד ימין אפשר לראות דוגמה לתצוגת ניווט של CarPlay. בתמונה בצד שמאל מוצג אותו ניווט כמו בטלפון.

הגדרה

לתחילת השימוש ב-CarPlay

תחילה, כדאי להכיר את מסמכי התיעוד של Apple:

• https://developer.apple.com/carplay/
• https://developer.apple.com/carplay/documentation/CarPlay-App-Programming-Guide.pdf

הגדרת ה-SDK לניווט

1. אחרי שתקראו את התיעוד של Apple, תוכלו להתחיל לעבוד עם ה-API של הניווט.
2. הגדר את הפרויקט שלך אם עדיין לא שילבת את ה-SDK של הניווט באפליקציה שלך.
3. הפעילו את פיד ההנחיות של TurnByTurn עבור האפליקציה.
4. זה שינוי אופציונלי. משתמשים בסמלים שנוצרו מ-Navigation SDK.
5. משרטטים את המפה באמצעות המחלקה GMSMapView שסופקה במחלקה UIView. מידע נוסף מופיע במאמר ניווט במסלול. מאכלסים את CPNavigationSession בנתונים מספריית TurnByTurn.

שרטוט המפה וממשק המשתמש לניווט

המחלקה GMSMapView מעבדת את המפה, וה-CPMapTemplate מציג את ממשק המשתמש במסכים של CarPlay. הוא מספק חלק גדול מהפונקציונליות של ה-GMSMapView בטלפונים, אבל עם יכולת אינטראקטיבית מוגבלת.

Swift

init(window: CPWindow) {
    super.init(nibName: nil, bundle: nil)
    self.window = window

    // More CPMapTemplate initialization

}

override func viewDidLoad() {
    super.viewDidLoad()

    let mapViewOptions = GMSMapViewOptions()
    mapViewOptions.screen = window.screen
    mapViewOptions.frame = self.view.bounds

    mapView = GMSMapView(options: mapViewOptions)
    mapView.autoresizingMask = [.flexibleHeight, .flexibleWidth]
    mapView.settings.isNavigationHeaderEnabled = false
    mapView.settings.isNavigationFooterEnabled = false

    // Disable buttons: in CarPlay, no part of the map is clickable.
    // The app should instead place these buttons in the appropriate slots of the CarPlay template.
    mapView.settings.compassButton = false
    mapView.settings.isRecenterButtonEnabled = false
    mapView.shouldDisplaySpeedometer = false
    mapView.isMyLocationEnabled = true

    self.view.addSubview(mapView)
}

Objective-C

- (instancetype)initWithWindow:(CPWindow *)window {
  self = [super initWithNibName:nil bundle:nil];
  if (self) {
    _window = window;

  // More CPMapTemplate initialization
  }
}

- (void)viewDidLoad {
  [super viewDidLoad];
  GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
  options.screen = _window.screen;
  options.frame = self.view.bounds;
  _mapView = [[GMSMapView alloc] initWithOptions:options];
  _mapView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
  _mapView.settings.navigationHeaderEnabled = NO;
  _mapView.settings.navigationFooterEnabled = NO;

  // Disable buttons: in CarPlay, no part of the map is clickable.
  // The app should instead place these buttons in the appropriate slots of the CarPlay template.
  _mapView.settings.compassButton = NO;
  _mapView.settings.recenterButtonEnabled = NO;

  _mapView.shouldDisplaySpeedometer = NO;
  _mapView.myLocationEnabled = YES;

  [self.view addSubview:_mapView];
}

הפעלת אינטראקציה במפה

כדי לשמור על בטיחות הנהג, מערכת CarPlay מגבילה את האינטראקציה על פני המסך לסדרת אמצעי CPMapTemplateDelegate. אפשר להשתמש בקריאות חוזרות (callback) כאלה כדי לתמוך באינטראקציה מוגבלת של הנהג עם המפה במסך שבלוח הבקרה.

כדי לתמוך בפעולות משתמש נוספות, צריך ליצור מערך של CPMapButton ולהקצות אותו ל-CPMapTemplate.mapButtons.

הקוד הבא יוצר אינטראקציות של הזזה ולחצנים להזזה, להגדלה ולהקטנה, ולציון המיקום של המשתמש.

הזזת האינטראקציות

Swift

// MARK: CPMapTemplateDelegate
func mapTemplate(_ mapTemplate: CPMapTemplate, panBeganWith direction: CPMapTemplate.PanDirection) {

}

func mapTemplate(_ mapTemplate: CPMapTemplate, panWith direction: CPMapTemplate.PanDirection) {
    let scrollAmount = scrollAmount(for: direction)
    let scroll = GMSCameraUpdate.scrollBy(x: scrollAmount.x, y: scrollAmount.y)
    mapView.animate(with: scroll)
}

func mapTemplate(_ mapTemplate: CPMapTemplate, panEndedWith direction: CPMapTemplate.PanDirection) {
}

func scrollAmount(for panDirection: CPMapTemplate.PanDirection) -> CGPoint {
    let scrollDistance = 80.0
    var scrollAmount = CGPoint(x: 0, y: 0)
    switch panDirection {
        case .left:
            scrollAmount.x -= scrollDistance
            break;
        case .right:
            scrollAmount.x += scrollDistance
            break;
        case .up:
            scrollAmount.y += scrollDistance
            break;
        case .down:
            scrollAmount.y -= scrollDistance
            break;
        default:
            break;
    }
    if scrollAmount.x != 0 && scrollAmount.y != 0 {
        // Adjust length if scrolling diagonally.
        scrollAmount = CGPointMake(scrollAmount.x * sqrt(1.0/2.0), scrollAmount.y * sqrt(1.0/2.0))
    }
    return scrollAmount
}

Objective-C

#pragma mark - CPMapTemplateDelegate

- (void)mapTemplate:(CPMapTemplate *)mapTemplate panBeganWithDirection:(CPPanDirection)direction {
}

- (void)mapTemplate:(CPMapTemplate *)mapTemplate panWithDirection:(CPPanDirection)direction {
CGPoint scrollAmount = [self scrollAmountForPanDirection:direction];
GMSCameraUpdate *scroll = [GMSCameraUpdate scrollByX:scrollAmount.x Y:scrollAmount.y];
[_mapView animateWithCameraUpdate:scroll];
}

- (void)mapTemplate:(CPMapTemplate *)mapTemplate panEndedWithDirection:(CPPanDirection)direction {
}
- (CGPoint)scrollAmountForPanDirection:(CPPanDirection)direction {
  static const CGFloat scrollDistance = 80.;
  CGPoint scrollAmount = {0., 0.};
  if (direction & CPPanDirectionLeft) {
    scrollAmount.x = -scrollDistance;
  }
  if (direction & CPPanDirectionRight) {
    scrollAmount.x = scrollDistance;
  }
  if (direction & CPPanDirectionUp) {
    scrollAmount.y = -scrollDistance;
  }
  if (direction & CPPanDirectionDown) {
    scrollAmount.y = scrollDistance;
  }
  if (scrollAmount.x != 0 && scrollAmount.y != 0) {
  // Adjust length if scrolling diagonally.
  scrollAmount =
    CGPointMake(scrollAmount.x * (CGFloat)M_SQRT1_2, scrollAmount.y * (CGFloat)M_SQRT1_2);
  }
  return scrollAmount;
}

שימושים נפוצים בלחצנים

Swift

// MARK: Create Buttons

func createMapButtons() -> [CPMapButton] {
    let panButton = mapButton(systemImageName: "dpad.fill") { [weak self] in
        self?.didTapPanButton()
    }

    let zoomOutButton = mapButton(systemImageName: "minus.magnifyingglass") { [weak self] in
        self?.didTapZoomOutButton()
    }

    let zoomInButton = mapButton(systemImageName: "plus.magnifyingglass") { [weak self] in
        self?.didTapZoomInButton()
    }

    let myLocationButton = mapButton(systemImageName: "location") { [weak self] in
        self?.didTapMyLocationButton()
    }

    let mapButtons = [panButton, zoomOutButton, zoomInButton, myLocationButton]
    return mapButtons
}

func mapButton(systemImageName: String, handler: @escaping () -> Void) -> CPMapButton {

}


// MARK: Button callbacks

@objc func didTapPanButton() {
    mapTemplate?.showPanningInterface(animated: true)
}

@objc func didTapZoomOutButton() {
    mapView.animate(with: GMSCameraUpdate.zoomOut())
}

@objc func didTapZoomInButton() {
    mapView.animate(with: GMSCameraUpdate.zoomIn())
}

@objc func didTapMyLocationButton() {
    if let lastLocation = lastLocation {
        let cameraPosition = GMSCameraPosition(target: lastLocation.coordinate, zoom: 15)
        mapView.animate(to: cameraPosition)
    }
}

Objective-C

#pragma mark - Create Buttons

- (NSArray<CPMapButton *>*)createMapButtons {
    NSMutableArray<CPMapButton *> *mapButtons = [NSMutableArray<CPMapButton *> array];

    __weak __typeof__(self) weakSelf = self;
    CPMapButton *panButton = [self mapButtonWithSystemImageNamed:@"dpad.fill"
                                                        handler:^(CPMapButton *_) {
                                                        [weakSelf didTapPanButton];
                                                        }];
    [mapButtons addObject:panButton];

    CPMapButton *zoomOutButton =
        [self mapButtonWithSystemImageNamed:@"minus.magnifyingglass"
                                    handler:^(CPMapButton *_Nonnull mapButon) {
                                    [weakSelf didTapZoomOutButton];
                                    }];
    [mapButtons addObject:zoomOutButton];

    CPMapButton *zoomInButton =
        [self mapButtonWithSystemImageNamed:@"plus.magnifyingglass"
                                    handler:^(CPMapButton *_Nonnull mapButon) {
                                    [weakSelf didTapZoomInButton];
                                    }];
    [mapButtons addObject:zoomInButton];

    CPMapButton *myLocationButton =
        [self mapButtonWithSystemImageNamed:@"location"
                                    handler:^(CPMapButton *_Nonnull mapButton) {
                                    [weakSelf didTapMyLocationButton];
                                    }];
    [mapButtons addObject:myLocationButton];
    return mapButtons;
}

#pragma mark - Button Callbacks

- (void)didTapZoomOutButton {
[_mapView animateWithCameraUpdate:[GMSCameraUpdate zoomOut]];
}

- (void)didTapZoomInButton {
[_mapView animateWithCameraUpdate:[GMSCameraUpdate zoomIn]];
}

- (void)didTapMyLocationButton {
CLLocation *location = self.lastLocation;
if (location) {
    GMSCameraPosition *position =
        [[GMSCameraPosition alloc] initWithTarget:self.lastLocation.coordinate zoom:15.];
    [_mapView animateToCameraPosition:position];
}
}

- (void)didTapPanButton {
[_mapTemplate showPanningInterfaceAnimated:YES];
_isPanningInterfaceEnabled = YES;
}

- (void)didTapStopPanningButton {
[_mapTemplate dismissPanningInterfaceAnimated:YES];
_isPanningInterfaceEnabled = NO;
}

הערה: אי אפשר לבחור מסלולים חלופיים במסך CarPlay. צריך לבחור אותם מהטלפון לפני ש-CarPlay פועל.

הצגת מסלול הניווט

בקטע הזה מוסבר איך להגדיר מאזין לפיד נתונים ואיך לאכלס את הוראות הניווט בחלוניות של הנחיות הניווט ושל אומדני הנסיעה. למידע נוסף, קראו את הקטע "בניית אפליקציית ניווט ב-CarPlay" במדריך התכנות של אפליקציות CarPlay.

בחלוניות של הנחיות ושל אומדן הנסיעה יש כרטיס ניווט שמציג פרטי ניווט שקשורים לנסיעה הנוכחית. הספרייה TurnByTurn ב-Navigation SDK יכולה לעזור לכם לספק חלק מהמידע הזה, כמו סמלים, טקסט והזמן שנותר.

הגדרת מאזין

פעל לפי ההוראות להגדרת event listener במאמר הפעלת פיד נתונים מפורט.

אכלוס של פרטי הניווט

בחלק הראשון של דוגמת הקוד הבאה מוסבר איך לתרגם את GMSNavigationNavInfo.timeToCurrentStepSeconds לCPTravelEstimate כדי ליצור אומדני נסיעות של CarPlay. אפשר לקרוא מידע נוסף על רכיבי התצוגה האלה ועל רכיבי תצוגה אחרים במאמר הפעלת פיד נתונים מפורט.

החלק השני של הדוגמה מראה איך ליצור אובייקט ולאחסן אותו בשדה userInfo של CPManuevers. ההגדרה קובעת את הערך CPManeuverDisplayStyle, שמשמש גם למידע על הנחייה בין נתיבים. למידע נוסף, תוכלו לעיין במדריך התכנות של אפליקציית CarPlay של Apple.

Swift

// Get a CPTravelEstimate from GMSNavigationNavInfo
func getTravelEstimates(from navInfo:GMSNavigationNavInfo) -> CPTravelEstimates {
    let distanceRemaining = navInfo.roundedDistance(navInfo.distanceToCurrentStepMeters)
    let timeRemaining = navInfo.roundedTime(navInfo.timeToCurrentStepSeconds)
    let travelEstimates = CPTravelEstimates(distanceRemaining: distanceRemaining, timeRemaining: timeRemaining)
    return travelEstimates
}

//  Create an object to be stored in the userInfo field of CPManeuver to determine the CPManeuverDisplayStyle. 

/** An object to be stored in the userInfo field of a CPManeuver. */

struct ManeuverUserInfo {
    var stepInfo: GMSNavigationStepInfo
    var isLaneGuidance: Bool
}

func mapTemplate(_ mapTemplate: CPMapTemplate, displayStyleFor maneuver: CPManeuver) -> CPManeuverDisplayStyle {
    let userInfo = maneuver.userInfo
    if let maneuverUserInfo = userInfo as? ManeuverUserInfo {
        return maneuverUserInfo.isLaneGuidance ? .symbolOnly : .leadingSymbol
    }
    return .leadingSymbol
}

// Get a CPManeuver with instructionVariants and symbolImage from GMSNavigationStepInfo
func getManeuver(for stepInfo: GMSNavigationStepInfo) -> CPManeuver {
    let maneuver = CPManeuver()
    maneuver.userInfo = ManeuverUserInfo(stepInfo: stepInfo, isLaneGuidance: false)
    switch stepInfo.maneuver {
        case .destination:
            maneuver.instructionVariants = ["Your destination is ahead."]
            break
        case .destinationLeft:
            maneuver.instructionVariants = ["Your destination is ahead on your left."]
            break
        case .destinationRight:
            maneuver.instructionVariants = ["Your destination is ahead on your right."]
            break
        default:
            maneuver.attributedInstructionVariants = currentNavInfo?.instructions(forStep: stepInfo, options: instructionOptions)
            break
    }
    maneuver.symbolImage = stepInfo.maneuverImage(with: instructionOptions.imageOptions)
    return maneuver
}

// Get the lane image for a CPManeuver from GMSNavigationStepInfo
func laneGuidanceManeuver(for stepInfo: GMSNavigationStepInfo) -> CPManeuver? {
    let maneuver = CPManeuver()
    maneuver.userInfo = ManeuverUserInfo(stepInfo: stepInfo, isLaneGuidance: true)
    let lanesImage = stepInfo.lanesImage(with: imageOptions)
    guard let lanesImage = lanesImage else { return nil }
    maneuver.symbolImage = lanesImage
    return maneuver
}

Objective-C

// Get a CPTravelEstimate from GMSNavigationNavInfo
- (nonull CPTravelEstimates *)travelEstimates:(GMSNavigationNavInfo *_Nonnull navInfo) {
NSMeasurement<NSUnitLength *> *distanceRemaining = [navInfo roundedDistance:navInfo.distanceToCurrentStepMeters];
NSTimeInterval timeRemaining = [navInfo roundedTime:navInfo.timeToCurrentStepSeconds];
CPTravelEstimate* travelEstimate = [[CPTravelEstimates alloc] initWithDistanceRemaining:distanceRemaining
                                                timeRemaining:timeRemaining];
}
//  Create an object to be stored in the userInfo field of CPManeuver to determine the CPManeuverDisplayStyle. 

/** An object to be stored in the userInfo field of a CPManeuver. */
@interface ManeuverUserInfo : NSObject

@property(nonatomic, readonly, nonnull) GMSNavigationStepInfo *stepInfo;
@property(nonatomic, readonly, getter=isLaneGuidance) BOOL laneGuidance;

- (nonnull instancetype)initWithStepInfo:(GMSNavigationStepInfo *)stepInfo
                        isLaneGuidance:(BOOL)isLaneGuidance NS_DESIGNATED_INITIALIZER;

- (instancetype)init NS_UNAVAILABLE;

@end

- (CPManeuverDisplayStyle)mapTemplate:(CPMapTemplate *)mapTemplate
            displayStyleForManeuver:(nonnull CPManeuver *)maneuver {
ManeuverUserInfo *userInfo = maneuver.userInfo;
return userInfo.laneGuidance ? CPManeuverDisplayStyleSymbolOnly : CPManeuverDisplayStyleDefault;
}
// Get a CPManeuver with instructionVariants and symbolImage from GMSNavigationStepInfo
- (nonnull CPManeuver *)maneuverForStep:(nonnull GMSNavigationStepInfo *)stepInfo {
CPManeuver *maneuver = [[CPManeuver alloc] init];
maneuver.userInfo = [[ManeuverUserInfo alloc] initWithStepInfo:stepInfo isLaneGuidance:NO];
switch (stepInfo.maneuver) {
    case GMSNavigationManeuverDestination:
    maneuver.instructionVariants = @[ @"Your destination is ahead." ];
    break;
    case GMSNavigationManeuverDestinationLeft:
    maneuver.instructionVariants = @[ @"Your destination is ahead on your left." ];
    break;
    case GMSNavigationManeuverDestinationRight:
    maneuver.instructionVariants = @[ @"Your destination is ahead on your right." ];
    break;
    default: {
    maneuver.attributedInstructionVariants =
        [_currentNavInfo instructionsForStep:stepInfo options:_instructionOptions];
    break;
    }
}
maneuver.symbolImage = [stepInfo maneuverImageWithOptions:_instructionOptions.imageOptions];
return maneuver;
}
// Get the lane image for a CPManeuver from GMSNavigationStepInfo
- (nullable CPManeuver *)laneGuidanceManeuverForStep:(nonnull GMSNavigationStepInfo *)stepInfo {
CPManeuver *maneuver = [[CPManeuver alloc] init];
maneuver.userInfo = [[ManeuverUserInfo alloc] initWithStepInfo:stepInfo isLaneGuidance:YES];
UIImage *lanesImage = [stepInfo lanesImageWithOptions:_imageOptions];
if (!lanesImage) {
    return nil;
}
maneuver.symbolImage = lanesImage;
return maneuver;
}

תמרונים

מערכת CarPlay משתמשת במחלקה CPManeuver כדי לספק הדרכה במסלול מפורט. למידע נוסף על תמרונים והנחיה בין נתיבים, ראו הפעלת פיד נתונים של מסלול מפורט.

מסמכים קשורים

• https://developer.apple.com/carplay/
• https://developer.apple.com/carplay/documentation/CarPlay-App-Programming-Guide.pdf
• https://developer.apple.com/design/human-interface-guidelines/carplay
• הפעלת פיד נתונים מפורט
• ניווט במסלול