ناوبری را برای CarPlay فعال کنید

مهم: همه برنامه‌های توسعه‌یافته برای استفاده با CarPlay به مجوز CarPlay از اپل نیاز دارند و باید از دستورالعمل‌های CarPlay اپل پیروی کنند. این راهنما روش‌های استانداردی را ارائه می‌کند که باید از آنها پیروی کنید، اما هنوز باید برنامه خود را برای تأیید ارسال کنید تا بتوانید آن را برای CarPlay راه‌اندازی کنید. برای جزئیات بیشتر به راهنمای برنامه نویسی برنامه CarPlay اپل و دستورالعمل های رابط انسانی CarPlay مراجعه کنید.

این بخش توضیح می‌دهد که چگونه می‌توانید از Navigation SDK با کتابخانه Apple CarPlay برای نمایش تجربه پیمایش برنامه‌تان در یونیت‌های اصلی داخل داشبورد استفاده کنید. اگر سیستم داشبورد راننده از CarPlay پشتیبانی می‌کند، رانندگان می‌توانند با اتصال تلفن خود به دستگاه، از برنامه شما مستقیماً روی نمایشگر خودروی خود استفاده کنند. راهنمای صوتی نیز روی بلندگوهای خودرو اجرا می شود.

شما برنامه CarPlay خود را از مجموعه ای از الگوهای رابط کاربری ارائه شده توسط اپل می سازید. برنامه شما مسئول انتخاب الگو برای نمایش و ارائه داده های داخل آن است.

سیستم درون داشبورد عناصر تعاملی تایید شده ایمنی را نمایش می‌دهد تا راننده بتواند با خیال راحت به مقصد خود بدون حواس‌پرتی ناخواسته حرکت کند. همچنین می‌توانید برنامه‌تان را طوری برنامه‌ریزی کنید که راننده بتواند با ویژگی‌های خاص برنامه‌تان، مانند پذیرش یا رد سفارش، یا مشاهده مکان مشتری روی نقشه، تعامل داشته باشد. همچنین می‌توان به‌روزرسانی‌های وضعیت سفارش را طوری برنامه‌ریزی کرد که در واحد داخل داشبورد ظاهر شوند.

تصویر سمت چپ نمونه ای از نمایشگر ناوبری CarPlay را نشان می دهد. تصویر سمت راست همان ناوبری را نشان می دهد که در تلفن ظاهر می شود.

برپایی

با CarPlay شروع کنید

ابتدا با مستندات اپل آشنا شوید:

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

Navigation SDK را تنظیم کنید

1. هنگامی که اسناد اپل را مطالعه کردید، آماده کار با Navigation SDK هستید.
2. اگر قبلاً Navigation SDK را در برنامه خود ادغام نکرده اید ، پروژه خود را تنظیم کنید .
3. فید راهنمای TurnByTurn را برای برنامه خود فعال کنید .
4. اختیاری. از نمادهای ایجاد شده از Navigation SDK استفاده کنید.
5. نقشه را با استفاده از کلاس GMSMapView ارائه شده در کلاس UIView بکشید. برای اطلاعات بیشتر به پیمایش مسیر مراجعه کنید. CPNavigationSession را با داده های کتابخانه TurnByTurn پر کنید.

نقشه و رابط کاربری ناوبری را بکشید

کلاس GMSMapView یک نقشه و CPMapTemplate رابط کاربری را در صفحه‌های CarPlay رندر می‌کند. بسیاری از عملکردهای مشابه GMSMapView را برای تلفن ها ارائه می دهد، اما با تعامل محدود.

سریع

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)
}

هدف-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 محدود می‌کند. از این تماس‌ها برای پشتیبانی از تعامل محدود راننده با نقشه روی صفحه‌نمایش داشبورد استفاده کنید.

برای پشتیبانی از اقدامات اضافی کاربر، یک آرایه از CPMapButton ایجاد کنید و آن را به CPMapTemplate.mapButtons اختصاص دهید.

کد زیر فعل و انفعالات متحرک و دکمه‌هایی را برای حرکت، بزرگ‌نمایی و کوچک‌نمایی و ارائه موقعیت مکانی کاربر ایجاد می‌کند.

تعاملات متحرک

سریع

// 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
}

هدف-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;
}

استفاده از دکمه های رایج

سریع

// 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)
    }
}

هدف-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 می تواند به ارائه برخی از این اطلاعات مانند نماد، متن و زمان باقیمانده کمک کند.

شنونده تنظیم کنید

دستورالعمل‌های راه‌اندازی شنونده رویداد را در Enable turn-by-turn feed داده دنبال کنید.

اطلاعات ناوبری را پر کنید

بخش اول نمونه کد زیر نحوه ایجاد تخمین سفر CarPlay را با ترجمه GMSNavigationNavInfo.timeToCurrentStepSeconds به CPTravelEstimate نشان می دهد. می‌توانید در مورد این و سایر عناصر نمایشگر در Enable turn-by-turn feed اطلاعات بیشتر بخوانید.

قسمت دوم نمونه نحوه ایجاد یک شی و ذخیره آن را در قسمت userInfo CPManuevers نشان می دهد. این امر CPManeuverDisplayStyle را تعیین می‌کند که برای اطلاعات هدایت مسیر نیز استفاده می‌شود. برای اطلاعات بیشتر به راهنمای برنامه نویسی برنامه CarPlay اپل مراجعه کنید.

سریع

// 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
}

هدف-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
• فید داده گام به گام را فعال کنید
• مسیری را پیمایش کنید