Gezinme kullanıcı arayüzünü değiştirme

Android için Gezinme SDK'sını kullanarak, haritada yerleşik kullanıcı arayüzü denetimlerinden ve öğelerinden hangilerinin görüneceğini belirleyerek haritanızla kullanıcı deneyimini değiştirebilirsiniz. Ayrıca, gezinme arayüzünün görsel görünümünü de ayarlayabilirsiniz. Gezinme kullanıcı arayüzünde kabul edilebilir değişikliklerle ilgili kurallar için Politikalar sayfasına bakın.

Bu dokümanda, haritanızın kullanıcı arayüzünü iki şekilde nasıl değiştirebileceğiniz açıklanmaktadır:

Harita kullanıcı arayüzü kontrolleri

Harita kullanıcı arayüzü kontrolleri, navigasyon görünümünün üst kısmında yer alır. Android için Gezinme SDK'sı, yerleşik düzen değiştiğinde özel denetimlerinizi otomatik olarak yeniden konumlandırır. Düzenin her konumu için bir özel denetim ayarlayabilirsiniz. Özel kontrol, bir kullanıcı arayüzü öğesi olabilir veya tasarımınız daha fazlası gerektiriyorsa birden fazla kullanıcı arayüzü öğesi içeren bir ViewGroup kullanabilirsiniz.

setCustomControl yöntemi, CustomControlPosition sıralamasında tanımlandığı gibi konumları sağlar:

  • SECONDARY_HEADER (yalnızca dikey modda görünür)
  • BOTTOM_START_BELOW
  • BOTTOM_END_BELOW

Bu resimde, sürücüyü sürücünün konumuyla ilgili bilgilendiren bir kullanıcı arayüzü kontrolünün çeşitli konumlarından örnekler gösterilmektedir.

Özel Denetim Konumları

Özel bir ikincil üstbilgi ekleme

Varsayılan olarak, gezinme modundaki ekran düzenleri birincil başlığın altında bulunan ikincil bir başlık için bir konum sağlar. Bu ikincil başlık, şerit rehberliği gibi gerektiğinde görünür. Uygulamanız, özel içerik için düzenin bu ikincil başlık konumunu kullanabilir. Bu özelliği kullandığınızda, denetiminiz tüm varsayılan ikincil başlık içeriklerini kapsar. Gezinme görünümünüzün bir arka planı varsa, bu arka plan ikincil başlıkla kapsanarak yerinde kalır. Uygulamanız özel denetimi kaldırdığında, bunun yerine herhangi bir varsayılan ikincil başlık görünebilir.

Özel ikincil üstbilgi konumu, üst kenarını birincil başlığın alt kenarıyla hizalar. Bu konum yalnızca portrait mode içinde desteklenir. landscape mode ürününde ikincil üstbilgi kullanılamaz ve düzen değişmez.

  1. Özel kullanıcı arayüzü öğesi veya ViewGroup ile bir Android View oluşturun.
  2. İkincil üstbilgi olarak eklemek üzere görünümün bir örneğini almak için XML'i şişirin veya özel görünümü somutlaştırın.
  3. SECONDARY_HEADER olarak NavigationView.setCustomControl veya SupportNavigationFragment.setCustomControl ile CustomControlPosition özelliğini kullanın.

    Aşağıdaki örnek bir parça oluşturur ve ikincil üstbilgi konumuna bir özel denetim ekler.

     mNavFragment.setCustomControl(getLayoutInflater().
       inflate(R.layout.your_custom_control, null),
       CustomControlPosition.SECONDARY_HEADER);
    

İkincil üstbilgiyi kaldırma

İkincil üstbilgiyi kaldırıp varsayılan içeriğe dönmek için setCustomControl yöntemini kullanın.

Görünümü kaldırmak için görünümü null olarak ayarlayın.

mNavFragment.setCustomControl(null, CustomControlPosition.SECONDARY_HEADER);

Gezinme görünümünün alt kısmına özel denetim ekleme

Uygulamanız, gezinme görünümünün alt kenarına hizalı özel bir denetim belirtebilir. Uygulamanız özel kontrol eklediğinde, yeniden ortala düğmesi ve Google logosu bunu karşılayacak şekilde yukarı hareket eder.

  1. Eklemek istediğiniz kullanıcı arayüzü öğesi veya görünüm grubuyla bir Android Görünümü oluşturun.
  2. Gezinme görünümünü veya parçasını oluşturun.
  3. Gezinme görünümünde veya parçasında setCustomControl yöntemini çağırın ve kontrolü ve kullanılacak konumu belirtin.

Aşağıdaki örnekte, SupportNavigationFragment öğesine eklenmiş bir özel View gösterilmektedir:

private SupportNavigationFragment mNavFragment;
mNavFragment = (SupportNavigationFragment)
  getFragmentManager().findFragmentById(R.id.navigation_fragment);

// Create the custom control view.
MyCustomView myCustomView = new MyCustomView();

// Add the custom control to the bottom end corner of the layout.
mNavFragment.setCustomControl(myCustomView, CustomControlPosition.
  BOTTOM_END_BELOW);

Özel denetimleri kaldırma

Özel denetimi kaldırmak için setCustomControl yöntemini kullanın ve kaldırmak istediğiniz denetimin konumunu belirtin.

Bu konum için görünümü null olarak ayarlayın.

mNavFragment.setCustomControl(null, CustomControlPosition.BOTTOM_END_BELOW);

Harita kullanıcı arayüzü aksesuarları

Android için Gezinme SDK'sı, navigasyon sırasında Android için Google Haritalar uygulamasında bulunanlara benzer şekilde görünen kullanıcı arayüzü aksesuarları sağlar. Bu kontrollerin görünürlüğünü veya görsel görünümünü bu bölümde açıklandığı şekilde ayarlayabilirsiniz. Burada yaptığınız değişiklikler sürücünün bir sonraki seyahatine yansıtılır.

Gezinme arayüzünde kabul edilebilir değişiklikler ile ilgili yönergeler için Politikalar sayfasına bakın.

Kodu göster

Gezinme üstbilgisini değiştirme

Gezinme başlığının temasını ve mümkün olduğunda başlığın altında görünen sonraki dönüş göstergesini değiştirmek için SupportNavigationFragment.setStylingOptions() veya NavigationView.setStylingOptions() aracını kullanın.

Aşağıdaki özellikleri ayarlayabilirsiniz:

Özellik TürüÖzellikler
Arka plan rengi
  • Birincil gün modu - gezinme başlığının gündüz rengi
  • İkincil gün modu - sonraki dönüş göstergesinin gündüz rengi
  • Birincil gece modu - gezinme başlığının gece rengi
  • İkincil gece modu - sonraki dönüş göstergesinin gece rengi
Talimatlar için metin öğeleri
  • Metin rengi
  • Yazı tipi
  • İlk satırın metin boyutu
  • İkinci satırın metin boyutu
Sonraki adımlar için metin öğeleri
  • Yazı tipi
  • Mesafe değerinin metin rengi
  • Mesafe değerinin metin boyutu
  • Uzaklık birimlerinin metin rengi
  • Uzaklık birimlerinin metin boyutu
Manevra simgeleri
  • Büyük manevra simgesinin rengi
  • Küçük manevra simgesinin rengi
Şerit yardımı
  • Önerilen şerit veya şeritlerin rengi

Aşağıdaki örnekte, stil seçeneklerinin nasıl ayarlanacağı gösterilmektedir:

private SupportNavigationFragment mNavFragment;
mNavFragment = (SupportNavigationFragment) getFragmentManager()
  .findFragmentById(R.id.navigation_fragment);

// Set the styling options on the fragment.
mNavFragment.setStylingOptions(new StylingOptions()
  .primaryDayModeThemeColor(0xff1A237E)
  .secondaryDayModeThemeColor(0xff3F51B5)
  .primaryNightModeThemeColor(0xff212121)
  .secondaryNightModeThemeColor(0xff424242)
  .headerLargeManeuverIconColor(0xffffff00)
  .headerSmallManeuverIconColor(0xffffa500)
  .headerNextStepTypefacePath("/system/fonts/NotoSerif-BoldItalic.ttf")
  .headerNextStepTextColor(0xff00ff00)
  .headerNextStepTextSize(20f)
  .headerDistanceTypefacePath("/system/fonts/NotoSerif-Italic.ttf")
  .headerDistanceValueTextColor(0xff00ff00)
  .headerDistanceUnitsTextColor(0xff0000ff)
  .headerDistanceValueTextSize(20f)
  .headerDistanceUnitsTextSize(18f)
  .headerInstructionsTypefacePath("/system/fonts/NotoSerif-BoldItalic.ttf")
  .headerInstructionsTextColor(0xffffff00)
  .headerInstructionsFirstRowTextSize(24f)
  .headerInstructionsSecondRowTextSize(20f)
  .headerGuidanceRecommendedLaneColor(0xffffa500));

Trafik katmanını devre dışı bırakma

Haritadaki trafik katmanını etkinleştirmek veya devre dışı bırakmak için GoogleMap.setTrafficEnabled() aracını kullanın. Bu ayar, haritada bir bütün olarak gösterilen trafik yoğunluğunun göstergelerini etkiler. Ancak, rotadaki gezgin tarafından çizilen trafik göstergelerini etkilemez.

private GoogleMap mMap;
// Get the map, and when the async call returns, setTrafficEnabled
// (callback will be on the UI thread)
mMap = mNavFragment.getMapAsync(navMap -> navMap.setTrafficEnabled(false));

Trafik ışıklarını ve dur işaretlerini etkinleştirin

Harita kullanıcı arayüzünde trafik ışıklarını ve dur işaretlerini etkinleştirebilirsiniz. Bu özellik sayesinde sürücü, rotası boyunca trafik ışıklarının veya dur işareti simgelerinin gösterilmesini sağlayabilir. Böylece, daha verimli ve doğru yolculuklar için daha iyi bağlam sağlanmış olur.

Trafik ışıkları ve dur işaretleri, Navigasyon SDK'sında varsayılan olarak devre dışıdır. Bu özelliği etkinleştirmek istiyorsanız her özellik için ayrı ayrı DisplayOptions çağrısı yapın.

DisplayOptions displayOptions =
  new DisplayOptions().showTrafficLights(true).showStopSigns(true);

Özel işaretçiler ekleme

Android için Gezinme SDK'si artık işaretçiler için Google Haritalar API'lerini kullanıyor. Daha fazla bilgi için Haritalar API'si dokümanlarına göz atın.

Kayan metin

Google ilişkilendirmesini kapsamadığı sürece uygulamanızın herhangi bir yerine kayan metin ekleyebilirsiniz. Gezinme SDK'sı, metnin haritadaki bir enlem/boylama veya bir etikete bağlanmasını desteklemez. Daha fazla bilgi için Bilgi pencereleri bölümüne gidin.

Hız sınırını göster

Hız sınırı simgesini programlı olarak gösterebilir veya gizleyebilirsiniz. Hız sınırı simgesini görüntülemek veya gizlemek için NavigationView.setSpeedLimitIconEnabled() ya da SupportNavigationFragment.setSpeedLimitIconEnabled() aracını kullanın. Etkinleştirildiğinde, rehberlik sırasında alt köşede hız sınırı simgesi görüntülenir. Simge, aracın gittiği yolun hız sınırını gösterir. Simge yalnızca güvenilir hız sınırı verilerinin bulunduğu yerlerde görünür.

// Display the Speed Limit icon
mNavFragment.setSpeedLimitIconEnabled(true);

Yeniden ortalama düğmesi görüntülendiğinde hız sınırı simgesi geçici olarak gizlenir.

Gece modunu ayarla

Gece modunun davranışını programlı olarak kontrol edebilirsiniz. Gece modunu etkinleştirmek veya devre dışı bırakmak için NavigationView.setForceNightMode() ya da SupportNavigationFragment.setForceNightMode() aracını kullanın ya da Android için Gezinme SDK'sinin kontrol etmesine izin verin.

  • AUTO Gezinme SDK'sının cihaz konumuna ve yerel saate göre uygun modu belirlemesine olanak tanır.
  • FORCE_NIGHT, gece modunu açık kalmaya zorlar.
  • FORCE_DAY, gün modunu açık olmaya zorlar.

Aşağıdaki örnekte, bir gezinme parçası içinde gece modunun açılmaya zorlanması gösterilmektedir:

// Force night mode on.
mNavFragment.setForceNightMode(FORCE_NIGHT);

Yol tarifi listesini görüntüle

İlk olarak, görünümü oluşturun ve hiyerarşinize ekleyin.

void setupDirectionsListView() {
  // Create the view.
  DirectionsListView directionsListView = new DirectionsListView(getApplicationContext());
  // Add the view to your view hierarchy.
  ViewGroup group = findViewById(R.id.directions_view);
  group.addView(directionsListView);

  // Add a button to your layout to close the directions list view.
  ImageButton button = findViewById(R.id.close_directions_button); // this button is part of the container we hide in the next line.
  button.setOnClickListener(
      v -> findViewById(R.id.directions_view_container).setVisibility(View.GONE));
}

NavigationView ile olduğu gibi, yaşam döngüsü olaylarını DirectionsListView için de yönlendirdiğinizden emin olun. Örneğin:

protected void onResume() {
  super.onResume();
  directionsListView.onResume();
}

Alternatif rotalar gizleniyor

Kullanıcı arayüzü çok fazla bilgiyle karıştığında, varsayılandan (iki) daha az alternatif rota görüntüleyerek veya hiç alternatif rota göstermeyerek karmaşıklığı azaltabilirsiniz. Bu seçeneği, rotaları getirmeden önce aşağıdaki numaralandırma değerlerinden biriyle RoutingOptions.alternateRoutesStrategy() yöntemini çağırarak yapılandırabilirsiniz:

Sıralama DeğeriAçıklama
AlternateRoutesStrategy.SHOW_ALL Varsayılan. En fazla iki alternatif rota görüntülenir.
AlternateRoutesStrategy.SHOW_ONE Bir alternatif rota (varsa) görüntüler.
AlternateRoutesStrategy.SHOW_NONE Alternatif rotaları gizler.

Aşağıdaki kod örneğinde, alternatif rotaların tamamen nasıl gizleneceği gösterilmektedir.

RoutingOptions routingOptions = new RoutingOptions();
routingOptions.alternateRoutesStrategy(AlternateRoutesStrategy.SHOW_NONE);
navigator.setDestinations(destinations, routingOptions, displayOptions);

Gezi ilerleme çubuğu

Gezi ilerleme çubuğu navigasyona eklendi.

Gezi ilerleme çubuğu, navigasyon başladığında haritanın sağ son kenarında görünen dikey bir çubuktur. Etkinleştirildiğinde, sürücünün varış yeri ve mevcut konumuyla birlikte seyahatin tamamına genel bir bakış sunar.

Sürücüler, trafik gibi yaklaşan sorunları yakınlaştırmalarına gerek kalmadan hızlı bir şekilde tahmin etmelerini sağlıyor. Gerekirse seyahatin rotasını yeniden çizebilirler. Sürücü yolculuğun rotasını yenilerse ilerleme çubuğu, ilgili noktadan yeni bir gezi başlamış gibi sıfırlanır.

Gezi ilerleme çubuğu aşağıdaki durum göstergelerini gösterir:

  • Geçen rota: Yolculuğun geçen kısmı.

  • Mevcut konum: Sürücünün yolculuktaki mevcut konumu.

  • Trafik durumu: Yaklaşan trafiğin durumu.

  • Son varış noktası: Seyahatin son varış noktası.

NavigationView veya SupportNavigationFragment'ta setTripProgressBarEnabled() yöntemini çağırarak gezi ilerleme çubuğunu etkinleştirin. Örneğin:

// Enable the trip progress bar.
mNavFragment.setTripProgressBarEnabled(true);