Navigation SDK در حال حاضر فقط برای مشتریان منتخب در دسترس است. برای کسب اطلاعات بیشتر با واحد فروش تماس بگیرید .

طراحی نقشه جدید به زودی به پلتفرم نقشه های گوگل ارائه می شود. این به‌روزرسانی برای استایل نقشه شامل یک پالت رنگ پیش‌فرض جدید و بهبودهایی در تجربیات نقشه و قابلیت استفاده است. همه سبک‌های نقشه به‌طور خودکار در مارس 2025 به‌روزرسانی می‌شوند. برای اطلاعات بیشتر در مورد در دسترس بودن و نحوه انتخاب زودتر، به سبک نقشه جدید برای پلتفرم Google Maps مراجعه کنید.

این صفحه به‌وسیله ‏Cloud Translation API‏ ترجمه شده است.

رابط کاربری ناوبری را تغییر دهید

با استفاده از Navigation SDK برای iOS، می‌توانید تجربه کاربری با نقشه خود را با تعیین اینکه کدام یک از کنترل‌ها و عناصر رابط کاربری داخلی روی نقشه ظاهر می‌شوند و کدام حرکات را مجاز می‌کنید، تغییر دهید. همچنین می توانید ظاهر بصری رابط کاربری ناوبری را تغییر دهید. برای دستورالعمل‌های مربوط به تغییرات قابل قبول در رابط کاربری ناوبری، به صفحه خط‌مشی‌ها مراجعه کنید.

کنترل‌های رابط کاربری نقشه

Navigation SDK برخی از کنترل‌های UI داخلی مشابه آنچه در Google Maps برای برنامه iOS یافت می‌شود، ارائه می‌کند. با استفاده از کلاس GMSUISettings می‌توانید قابلیت مشاهده این کنترل‌ها را تغییر دهید. تغییراتی که در این کلاس ایجاد می‌کنید بلافاصله روی نقشه منعکس می‌شوند.

قطب نما

Navigation SDK یک گرافیک قطب نما را ارائه می دهد که در گوشه سمت راست بالای نقشه تحت شرایط خاص و تنها در صورت فعال بودن ظاهر می شود. قطب نما فقط زمانی ظاهر می شود که دوربین به گونه ای باشد که دارای یک یاتاقان غیر از شمال دقیق (یک یاتاقان غیر صفر) باشد. هنگامی که کاربر روی قطب نما کلیک می کند، دوربین به موقعیتی با یاتاقان صفر (جهت پیش فرض) متحرک می شود و کمی بعد قطب نما محو می شود.

اگر پیمایش فعال باشد و حالت دوربین روی "دنبال کردن" تنظیم شود، قطب نما قابل مشاهده باقی می ماند و ضربه زدن روی قطب نما بین زاویه دید دوربین کج و نمای کلی تغییر می کند.

قطب نما به طور پیش فرض غیرفعال است. می‌توانید با تنظیم ویژگی compassButton در GMSUISettings روی YES ، قطب‌نما را فعال کنید. با این حال، نمی توانید قطب نما را مجبور کنید همیشه نشان داده شود.

سریع

mapView.settings.compassButton = true

هدف-C

mapView.settings.compassButton = YES;

دکمه موقعیت مکانی من

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

سریع

mapView.settings.myLocationButton = true

هدف-C

mapView.settings.myLocationButton = YES;

دکمه مرکز جدید

وقتی پیمایش فعال است، وقتی کاربر نمای نقشه را پیمایش می‌کند، دکمه تازه‌تر ظاهر می‌شود و زمانی که کاربر برای مرکز کردن مجدد نقشه ضربه می‌زند، ناپدید می‌شود. برای اینکه اجازه دهید دکمه Renter نمایش داده شود، ویژگی recenterButtonEnabled GMSUISettings را روی YES تنظیم کنید. برای جلوگیری از ظاهر شدن دکمه Renter، recenterButtonEnabled روی NO تنظیم کنید.

سریع

mapView.settings.isRecenterButtonEnabled = true

هدف-C

mapView.settings.recenterButtonEnabled = YES;

لوازم جانبی رابط کاربری نقشه

Navigation SDK لوازم جانبی UI را ارائه می دهد که در حین پیمایش مشابه موارد موجود در Google Maps برای برنامه iOS ظاهر می شوند. می‌توانید دید یا ظاهر بصری این کنترل‌ها را همانطور که در این بخش توضیح داده شده است، تنظیم کنید. تغییراتی که در اینجا ایجاد می‌کنید در سفر بعدی راننده منعکس می‌شوند.

سرصفحه و پاورقی ناوبری

در حین پیمایش، هدر پیمایش در بالای صفحه و پاورقی پیمایش در پایین ظاهر می شود. هدر ناوبری نام خیابان و جهت پیچ بعدی در مسیر و همچنین جهت پیچ بعدی را نشان می دهد. فوتر ناوبری زمان و مسافت تخمین زده شده تا مقصد و همچنین زمان تخمینی رسیدن را نشان می دهد.

می‌توانید نمایان بودن هدر و پاورقی پیمایش را تغییر دهید و رنگ‌های آن را با استفاده از ویژگی‌های زیر به صورت برنامه‌نویسی تنظیم کنید:

navigationHeaderEnabled — کنترل می کند که آیا هدر پیمایش قابل مشاهده است (پیش فرض true است).
navigationFooterEnabled — کنترل می کند که آیا پاورقی پیمایش قابل مشاهده است (پیش فرض true است).
navigationHeaderPrimaryBackgroundColor — رنگ پس زمینه اصلی را برای سربرگ پیمایش تنظیم می کند.
navigationHeaderSecondaryBackgroundColor — رنگ پس زمینه ثانویه را برای سرصفحه پیمایش تنظیم می کند.

مثال کد زیر روشن کردن قابلیت مشاهده برای سرصفحه و پاورقی، سپس تنظیم navigationHeaderPrimaryBackgroundColor به آبی و navigationHeaderSecondaryBackgroundColor را به قرمز نشان می دهد.

سریع

mapView.settings.isNavigationHeaderEnabled = true
mapView.settings.isNavigationFooterEnabled = true
mapView.settings.navigationHeaderPrimaryBackgroundColor = .blue
mapView.settings.navigationHeaderSecondaryBackgroundColor = .red

هدف-C

mapView.settings.navigationHeaderEnabled = YES;
mapView.settings.navigationFooterEnabled = YES;
mapView.settings.navigationHeaderPrimaryBackgroundColor = [UIColor blueColor];
mapView.settings.navigationHeaderSecondaryBackgroundColor = [UIColor redColor];

نمای سرصفحه لوازم جانبی ناوبری

می توانید برنامه خود را با جایگزین کردن نمای هدر پیمایش ثانویه با نمای لوازم جانبی سفارشی شده خود سفارشی کنید. شما این کار را با ایجاد یک نمای انجام می دهید که پروتکل GMSNavigationAccessoryView را پیاده سازی می کند. این پروتکل یک روش لازم دارد: -heightForAccessoryViewConstrainedToSize:onMapView: . حداکثر اندازه موجود برای نمای خود در mapView داده شده به شما داده می شود و باید ارتفاع مورد نیاز نمای خود را ارائه دهید.

سپس می‌توانید با فراخوانی setHeaderAccessoryView: MapView نماهای فعلی را متحرک می‌کند و سپس در نمای سفارشی شما متحرک می‌شود. هدر پیمایش باید قابل مشاهده باشد تا نمای سفارشی شما نمایش داده شود.

برای حذف نمای جانبی هدر سفارشی، nil به setHeaderAccessoryView:

اگر نمای شما باید در هر زمانی اندازه تغییر کند، می‌توانید invalidateLayoutForAccessoryView: را فراخوانی کنید، و از نمائی که نیاز به تغییر اندازه دارد عبور کنید.

مثال

مثال کد زیر یک نمای سفارشی را نشان می دهد که پروتکل GMSNavigationAccessoryView را پیاده سازی می کند. سپس از این نمای سفارشی برای تنظیم نمای لوازم جانبی هدر ناوبری سفارشی استفاده می شود.

سریع

class MyCustomView: UIView, GMSNavigationAccessoryView {
…
  func heightForAccessoryViewConstrained(to size: CGSize, on mapView: GMSMapView) -> CGFloat {
    // viewHeight gets calculated as the height your view needs.
    return viewHeight
  }
…
}

let customView = MyCustomView(...)
mapView.setHeaderAccessory(customView)

// At some later point customView changes size.
mapView.invalidateLayout(forAccessoryView: customView)

// Remove the custom header accessory view.
mapView.setHeaderAccessory(nil)

هدف-C

@interface MyCustomView : UIView <GMSNavigationAccessoryView>
…
@end

@implementation MyCustomView
…
- (CGFloat)heightForAccessoryViewConstrainedToSize:(CGSize)size onMapView:(GMSMapView *)mapView {
  // viewHeight gets calculated as the height your view needs.
  return viewHeight;
}
…
@end

MyCustomView *customView = [[MyCustomView alloc] init…];
[_mapView setHeaderAccessoryView:customView];

// At some later point customView changes size.
[_mapView invalidateLayoutForAccessoryView:customView];

// Remove the custom header accessory view.
[_mapView setHeaderAccessoryView:nil];

فهرست مسیرها

می توانید دستورالعمل های گام به گام را در برنامه خود ارائه دهید. مثال زیر یک راه ممکن برای انجام این کار را نشان می دهد. این مراحل ممکن است بسته به اجرای خودتان متفاوت باشد.

پس از اینکه setDestinations در GMSNavigator (ناوبر) با موفقیت تکمیل شد و guidanceActive در ناوبر فعال شد، یک دکمه نقطه ورود را فعال کنید.
پس از ضربه زدن کاربر بر روی دکمه نقطه ورود، یک GMSNavigationDirectionsListController (کنترل کننده) با ناوبری مرتبط با GMSMapView ( mapView ) ایجاد کنید.
کنترل‌کننده را به نمونه‌ای از UIViewController (کنترل‌کننده مشاهده) اضافه کنید، و directionsListView به عنوان یک نمای فرعی از کنترل‌کننده view اضافه کنید. متدهای reloadData و invalidateLayout روی کنترل‌کننده باید مانند UICollectionView فراخوانی شوند.
نمایش کنترلر را روی سلسله مراتب نمایش کنترلر برنامه فشار دهید.

مثال کد زیر افزودن یک DirectionsListViewController را نشان می دهد.

سریع

override func viewDidLoad() {
  super.viewDidLoad()
  // Add the directionsListView to the host view controller's view.
  let directionsListView = directionsListController.directionsListView
  directionsListView.frame = self.view.frame
  self.view.addSubview(directionsListView)
  directionsListView.translatesAutoresizingMaskIntoConstraints = false
  directionsListView.topAnchor.constraint(equalTo: self.view.topAnchor).isActive = true
  directionsListView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor).isActive = true
  directionsListView.trailingAnchor.constraint(equalTo: self.view.trailingAnchor).isActive = true
  directionsListView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true
  ...
}

override func viewWillAppear(_ animated: Bool) {
  super.viewWillAppear(animated)
  // Ensure data is fresh when the view appears.
  directionsListController.reloadData()
  ...
}

override func willTransition(to newCollection: UITraitCollection, with coordinator: UIViewControllerTransitionCoordinator) {
  super.willTransition(to: newCollection, with: coordinator)
  // Invalidate the layout during rotation.
  coordinator.animate(alongsideTransition: {_ in
    self.directionsListController.invalidateLayout()
  })
  ...
}

هدف-C

- (void)viewDidLoad {
  [super viewDidLoad];
  // Add the directionsListView to the host view controller's view.
  UIView *directionsListView = _directionsListController.directionsListView;
  directionsListView.frame = self.view.bounds;
  [self.view addSubview:directionsListView];
  directionsListView.translatesAutoresizingMaskIntoConstraints = NO;
  [directionsListView.topAnchor constraintEqualToAnchor:self.view.topAnchor].active = YES;
  [directionsListView.leadingAnchor constraintEqualToAnchor:self.view.leadingAnchor].active = YES;
  [directionsListView.trailingAnchor constraintEqualToAnchor:self.view.trailingAnchor].active = YES;
  [directionsListView.bottomAnchor constraintEqualToAnchor:self.view.bottomAnchor].active = YES;
  ...
}

- (void)viewWillAppear:(BOOL)animated {
  [super viewWillAppear:animated];
  // Ensure data is fresh when the view appears.
  [_directionsListController reloadData];
  ...
}

- (void)willTransitionToTraitCollection:(UITraitCollection *)newCollection
              withTransitionCoordinator:(id<UIViewControllerTransitionCoordinator>)coordinator {
  [super willTransitionToTraitCollection:newCollection withTransitionCoordinator:coordinator];
  void(^animationBlock)(id <UIViewControllerTransitionCoordinatorContext>context) =
      ^void(id <UIViewControllerTransitionCoordinatorContext>context) {
    [_directionsListController invalidateLayout];
  };
  // Invalidate the layout during rotation.
  [coordinator animateAlongsideTransition:animationBlock
                               completion:nil];
  ...
}

...

نوار پیشرفت سفر

نوار پیشرفت سفر به ناوبری اضافه شد.

نوار پیشرفت سفر یک نوار عمودی است که هنگام شروع ناوبری در لبه سمت راست انتهایی نقشه ظاهر می شود. وقتی فعال باشد، یک نمای کلی برای کل سفر به همراه مقصد و موقعیت فعلی راننده را نمایش می دهد.

این امکان را برای رانندگان فراهم می کند تا بدون نیاز به بزرگنمایی سریع هر گونه مشکل آتی مانند ترافیک را پیش بینی کنند. سپس در صورت لزوم می توانند مسیر سفر را تغییر دهند. اگر راننده مسیر سفر را تغییر دهد، نوار پیشرفت بازنشانی می‌شود، گویی سفر جدیدی از آن نقطه شروع شده است.

نوار پیشرفت سفر نشانگرهای وضعیت زیر را نشان می دهد:

وضعیت ترافیک - وضعیت ترافیک آینده.
مکان فعلی - مکان فعلی راننده در سفر.
مسیر سپری شده - بخش سپری شده از سفر.

نوار پیشرفت سفر را با تنظیم ویژگی navigationTripProgressBarEnabled در GMSUISettings فعال کنید.

سریع

mapView.settings.isNavigationTripProgressBarEnabled = true

هدف-C

mapView.settings.navigationTripProgressBarEnabled = YES;

چراغ های راهنمایی و رانندگی و علائم ایست

علائم ایست و چراغ های راهنمایی در طول مسیریابی نشان داده شده است.

می‌توانید چراغ‌های راهنمایی و علائم توقف را در mapView فعال کنید. با استفاده از این ویژگی، راننده می تواند نمایش چراغ های راهنمایی یا نمادهای ایست را در مسیر خود فعال کند و زمینه بهتری را برای سفرهای کارآمدتر و دقیق تر فراهم کند.

به طور پیش‌فرض، چراغ‌های راهنمایی و علائم توقف در Navigation SDK برای iOS غیرفعال هستند. برای فعال کردن این ویژگی، تنظیمات GMSMapView برای هر گزینه به طور مستقل فراخوانی کنید: showsTrafficLights و showsStopSigns .

سریع

mapView.settings.showsTrafficLights = YES;
mapView.settings.showsStopSigns = YES;

هدف-C

mapView.settings.showsTrafficLights = true;
mapView.settings.showsStopSigns = true;

کنترل سرعت سنج

وقتی پیمایش فعال است، Navigation SDK برای iOS یک کنترل محدودیت سرعت را در گوشه پایینی نقشه نشان می‌دهد که محدودیت سرعت فعلی را نشان می‌دهد. هنگامی که راننده از حد مجاز سرعت فراتر رفت، کنترل برای نمایش سرعت سنج دوم با سرعت فعلی راننده گسترش می یابد.

می‌توانید سطوح هشدار را برای تغییر قالب‌بندی نمایشگر سرعت‌سنج زمانی که راننده به میزان مشخصی از حد مجاز سرعت فراتر می‌رود، تنظیم کنید. برای مثال، می‌توانید مشخص کنید که سرعت فعلی با رنگ متن قرمز زمانی که راننده از حد مجاز سرعت 5 مایل در ساعت فراتر می‌رود، و با رنگ پس‌زمینه قرمز زمانی که راننده 10 مایل بر ساعت از حد مجاز تجاوز می‌کند، با رنگ پس‌زمینه قرمز نمایش داده شود.

برای نمایش کنترل محدودیت سرعت، ویژگی shouldDisplaySpeedometer GMSUISettings را روی YES تنظیم کنید. برای غیرفعال کردن نمایش کنترل محدودیت سرعت، shouldDisplaySpeedometer روی NO تنظیم کنید.

سریع

mapView.shouldDisplaySpeedometer = true

هدف-C

mapView.shouldDisplaySpeedometer = YES;

برای اطلاعات بیشتر در مورد تنظیم هشدارها برای سرعت سنج، به پیکربندی هشدارهای سرعت سنج مراجعه کنید.

نشانگرهای مقصد

می توانید با تنظیم ویژگی showsDestinationMarkers در GMSUISettings نشانگرهای مقصد را برای یک مسیر مشخص نشان دهید یا پنهان کنید. مثال زیر خاموش کردن نشانگرهای مقصد را نشان می دهد.

سریع

mapView.settings.showsDestinationMarkers = false

هدف-C

mapView.settings.showsDestinationMarkers = NO;

ویژگی های تجربه نقشه

Navigation SDK این امکان را در اختیار شما قرار می دهد که تجربه ناوبری را برای کاربران خود سفارشی کنید. تغییراتی که در نمونه خود ایجاد می‌کنید در طول به‌روزرسانی بعدی برنامه شما توسط درایور منعکس می‌شوند.

حرکات پیش فرض نقشه را غیرفعال کنید

می‌توانید با تنظیم ویژگی‌های کلاس GMSUISettings ، که به عنوان ویژگی GMSMapView در دسترس است، حرکات پیش‌فرض روی نقشه را غیرفعال کنید. ژست های زیر را می توان به صورت برنامه ریزی فعال و غیرفعال کرد. توجه داشته باشید که غیرفعال کردن ژست دسترسی برنامه‌ای به تنظیمات دوربین را محدود نمی‌کند.

scrollGestures - فعال یا غیرفعال بودن حرکات اسکرول را کنترل می کند. در صورت فعال بودن، کاربران می‌توانند انگشت خود را برای حرکت به دوربین بکشند.
zoomGestures - فعال یا غیرفعال بودن حرکات زوم را کنترل می کند. در صورت فعال بودن، کاربران می‌توانند برای بزرگ‌نمایی دوربین، دو بار ضربه بزنند، دو انگشت ضربه بزنند یا نیشگون بگیرند. توجه داشته باشید که وقتی scrollGestures فعال است، دوبار ضربه زدن یا نیشگون گرفتن آن ممکن است دوربین را تا نقطه مشخص شده حرکت دهد.
tiltGestures - فعال یا غیرفعال بودن حرکات شیب را کنترل می کند. اگر فعال باشد، کاربران می‌توانند از یک تند کشیدن دو انگشتی عمودی به پایین یا بالا برای کج کردن دوربین استفاده کنند.
rotateGestures - فعال یا غیرفعال بودن حرکات چرخشی را کنترل می کند. در صورت فعال بودن، کاربران می توانند از حرکت چرخش دو انگشتی برای چرخاندن دوربین استفاده کنند.

در این مثال، هر دو حرکت حرکت و زوم غیرفعال شده است.

سریع

mapView.settings.scrollGestures = false
mapView.settings.zoomGestures = false

هدف-C

mapView.settings.scrollGestures = NO;
mapView.settings.zoomGestures = NO;

کنترل های موقعیت و عناصر UI

با استفاده از ویژگی های زیر می توانید کنترل ها و سایر عناصر رابط کاربری را نسبت به موقعیت سرصفحه و پاورقی پیمایش قرار دهید:

navigationHeaderLayoutGuide
navigationFooterLayoutGuide

مثال کد زیر استفاده از راهنماهای طرح بندی را برای قرار دادن یک جفت برچسب در نمای نقشه نشان می دهد:

سریع

/* Add a label to the top left, positioned below the header. */
let topLabel = UILabel()
topLabel.text = "Top Left"
mapView.addSubview(topLabel)
topLabel.translatesAutoresizingMaskIntoConstraints = false
topLabel.topAnchor.constraint(equalTo: mapView.navigationHeaderLayoutGuide.bottomAnchor).isActive = true
topLabel.leadingAnchor.constraint(equalTo: mapView.leadingAnchor).isActive = true

/* Add a label to the bottom right, positioned above the footer. */
let bottomLabel = UILabel()
bottomLabel.text = "Bottom Right"
mapView.addSubview(bottomLabel)
bottomLabel.translatesAutoresizingMaskIntoConstraints = false
bottomLabel.bottomAnchor.constraint(equalTo: mapView.navigationFooterLayoutGuide.topAnchor).isActive = true
bottomLabel.trailingAnchor.constraint(equalTo: mapView.trailingAnchor).isActive = true

هدف-C

/* Add a label to the top left, positioned below the header. */
UILabel *topLabel = [[UILabel alloc] init];
topLabel.text = @"Top Left";
[view addSubview:topLabel];
topLabel.translatesAutoresizingMaskIntoConstraints = NO;
[topLabel.topAnchor
    constraintEqualToAnchor:mapView.navigationHeaderLayoutGuide.bottomAnchor].active = YES;
[topLabel.leadingAnchor constraintEqualToAnchor:mapView.leadingAnchor].active = YES;

/* Add a label to the bottom right, positioned above the footer. */
UILabel *bottomLabel = [[UILabel alloc] init];
bottomLabel.text = @"Bottom Right";
[view addSubview:bottomLabel];
bottomLabel.translatesAutoresizingMaskIntoConstraints = NO;
[bottomLabel.bottomAnchor
    constraintEqualToAnchor:mapView.navigationFooterLayoutGuide.topAnchor].active = YES;
[bottomLabel.trailingAnchor constraintEqualToAnchor:mapView.trailingAnchor].active = YES;

مخفی کردن مسیرهای جایگزین

هنگامی که رابط کاربری با اطلاعات بیش از حد به هم ریخته می شود، می توانید با نمایش مسیرهای جایگزین کمتری نسبت به حالت پیش فرض (دو) یا با نمایش هیچ مسیر جایگزین، درهم ریختگی را کاهش دهید. می توانید این گزینه را قبل از واکشی مسیرها با پیکربندی GMSNavigationRoutingOptions و تنظیم alternateRoutesStrategy با یکی از مقادیر شمارش زیر پیکربندی کنید:

مقدار شمارش	شرح
GMSNavigationAlternateRoutesStrategyAll	پیش فرض حداکثر دو مسیر جایگزین را نمایش می دهد.
GMSNavigationAlternateRoutesStrategyOne	یک مسیر جایگزین (در صورت وجود) را نشان می دهد.
GMSNavigationAlternateRoutesStrategy هیچکدام	مسیرهای جایگزین را پنهان می کند.

مثال

مثال کد زیر نحوه پنهان کردن مسیرهای جایگزین را به طور کلی نشان می دهد.

سریع

let routingOptions = GMSNavigationRoutingOptions(alternateRoutesStrategy: .none)
navigator?.setDestinations(destinations,
                           routingOptions: routingOptions) { routeStatus in
  ...
}

هدف-C

GMSNavigationRoutingOptions *routingOptions = [[GMSNavigationRoutingOptions alloc] initWithAlternateRoutesStrategy:GMSNavigationAlternateRoutesStrategyNone];
[navigator setDestinations:destinations
            routingOptions:routingOptions
                  callback:^(GMSRouteStatus routeStatus){...}];