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

Android için Navigasyon SDK'sını kullanarak, yerleşik kullanıcı arayüzü denetimlerinden ve öğelerinden hangilerinin haritada görüneceğini belirleyerek haritanızla kullanıcı deneyimini değiştirebilirsiniz. Gezinme kullanıcı arayüzünün görsel görünümünü de ayarlayabilirsiniz. Gezinme kullanıcı arayüzünde kabul edilebilir değişiklikler ile 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, gezinme görünümünün üst kısmında bulunur. Android için Gezinme SDK'sı, yerleşik düzen değiştiğinde özel kontrollerinizi otomatik olarak yeniden konumlandırır. Düzenin her konumu için bir özel kontrol ayarlayabilirsiniz. Özel kontrol, bir kullanıcı arayüzü öğesi olabilir veya tasarımınız daha fazlasını gerektiriyorsa birden fazla kullanıcı arayüzü öğesi içeren bir ViewGroup kullanabilirsiniz.

setCustomControl yöntemi, CustomControlPosition sıralaması içinde tanımlanan konumları sağlar:

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

Örneğin, aşağıdaki resimlerde, araç paylaşımı sürücüsüne yolcu alma sırasında bulunduğu konum hakkında bilgi veren kullanıcı arayüzü kontrolünün çeşitli konumlarına dair örnekler gösterilmektedir.

Özel Kontrol
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, gerektiğinde (ör. şerit yardımı ile) görünür. Uygulamanız, özel içerik düzeninin bu ikincil başlık konumunu kullanabilir. Bu özelliği kullandığınızda, denetiminiz varsayılan ikincil başlık içeriğinin herhangi bir kısmını kapsar. Gezinme görünümünüzün bir arka planı varsa bu arka plan, ikincil başlığın altında kalır. Uygulamanız özel denetimi kaldırdığında, onun yerine varsayılan bir ikincil başlık görünebilir.

Özel ikincil başlık konumu, üst kenarını birincil başlığın alt kenarıyla hizalar. Bu konum yalnızca portrait mode dilinde desteklenmektedir. landscape mode ürününde ikincil üst bilgi 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 başlık olarak eklenecek görünümün bir örneğini almak için XML'i şişirin veya özel görünümü örneklendirin.
  3. NavigationView.setCustomControl veya SupportNavigationFragment.setCustomControl öğesini, İKİNCİL_BAŞLIK olarak CustomControlPosition ile kullanın.

    Aşağıdaki örnekte bir parça oluşturulur ve ikincil başlık konumuna bir özel kontrol eklenir.

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

İkincil üstbilgiyi kaldırma

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

Kaldırmak için görünümü null değerine ayarlayın.

mNavFragment.setCustomControl(null, CustomControlPosition.SECONDARY_HEADER);

Gezinme görünümünün alt kısmına özel bir kontrol ekleyin

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

  1. Eklemek istediğiniz kullanıcı arayüzü öğesi veya görünüm grubunu kullanarak bir Android View 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ıp kullanılacak denetimi ve konumu belirtin.

Aşağıdaki örnekte SupportNavigationFragment öğesine eklenen özel bir 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 kontrolü 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 değerine ayarlayın.

mNavFragment.setCustomControl(null, CustomControlPosition.BOTTOM_END_BELOW);

Harita kullanıcı arayüzü aksesuarları

Android için Navigasyon SDK'sı, gezinme sırasında görünen Android için Google Haritalar uygulamasındakilere benzer kullanıcı arayüzü aksesuarları sağlar. Bu denetimlerin 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 bir sonraki gezinme oturumuna yansıtılır.

Gezinme kullanıcı arayüzünde yapılan kabul edilebilir değişiklikler hakkındaki yönergeler için Politikalar sayfasına bakın.

Kodu göster

Gezinme başlığını değiştirme

Gezinme başlığının ve varsa başlığın altında görünen sonraki dönüş göstergesinin temasını değiştirmek için SupportNavigationFragment.setStylingOptions() veya NavigationView.setStylingOptions() tuşları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ı kapatma

Haritadaki trafik katmanını etkinleştirmek veya devre dışı bırakmak için GoogleMap.setTrafficEnabled() düğmesini kullanın. Bu ayar, haritada bir bütün olarak gösterilen trafik yoğunluğu göstergelerini etkiler. Bununla birlikte, rota üzerindeki trafik göstergeleri navigasyon aracını 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ştir

Harita kullanıcı arayüzünde trafik ışıklarını etkinleştirebilir ve tabelaları durdurabilirsiniz. Bu özellik sayesinde kullanıcı, rota boyunca trafik ışıklarının veya dur işareti simgelerinin gösterilmesini etkinleştirerek daha verimli ve doğru geziler için daha iyi bağlam sağlayabilir.

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 numaralı telefonu arayın.

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

Özel işaretçi ekleme

Android için Navigasyon SDK'sı artık işaretçiler için Google Haritalar API'lerini kullanıyor. Daha fazla bilgi için Google Maps API belgelerine gidin.

Kayan metin

Kayan metin, Google ilişkilendirmesini kapsamadığı sürece uygulamanızın herhangi bir yerine ekleyebilirsiniz. Navigasyon SDK'sı, metnin haritadaki bir enlem/boylama veya etikete sabitlenmesini desteklemez. Daha fazla bilgi için Bilgi pencereleri'ne gidin.

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

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

// Hız Sınırı simgesini görüntüler mNavFragment.setSpeedLimitIconEnabled(true);

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

Gece modunu ayarla

Gece modunun davranışını programlı bir şekilde kontrol edebilirsiniz. Gece modunu açmak veya kapatmak için NavigationView.setForceNightMode() veya SupportNavigationFragment.setForceNightMode() kullanın ya da Android için Navigasyon SDK'sının bunu kontrol etmesine izin verin.

  • AUTO Gezinme SDK'sının cihaz konumuna ve yerel saate göre uygun modu belirlemesini sağlar.
  • FORCE_NIGHT, gece modunu zorlar.
  • FORCE_DAY, gün modunu açık tutar.

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

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

Yol tarifi listesini göster

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

Yaşam döngüsü etkinliklerini, NavigationView ürününde olduğu gibi DirectionsListView öğesine yönlendirdiğinizden emin olun. Örneğin:

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

Alternatif rotalar gizleniyor

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

Numaralandırma DeğeriAçıklama
AlternateRoutesStrategy.SHOW_ALL Varsayılan. En fazla iki alternatif rota görüntüler.
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 nasıl tamamen 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ğ kenarında görünen dikey bir çubuktur. Bu özellik etkinleştirildiğinde, kullanıcının varış noktası ve mevcut konumuyla birlikte gezinin tamamı için bir genel bakış görüntülenir.

Kullanıcıların, yakınlaştırmaya gerek kalmadan, trafik gibi yaklaşan sorunları hızlıca tahmin edebilmesini sağlar. Daha sonra gerekirse seyahati yeniden yönlendirebilirler. Kullanıcı geziyi yeniden yönlendirirse ilerleme çubuğu, o noktadan yeni bir gezi başlamış gibi sıfırlanır.

Gezi ilerleme çubuğunda aşağıdaki durum göstergeleri görüntülenir:

  • Geçen rota: Gezinin geçen kısmı.

  • Mevcut konum: Kullanıcının seyahatte bulunduğu konum.

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

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

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

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