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

Android için Navigasyon SDK'sını kullanarak haritanızda hangi yerleşik kullanıcı arayüzü kontrollerinin ve öğelerinin görüneceğini belirleyerek haritanızla kullanıcı deneyimini değiştirebilirsiniz. Navigasyon kullanıcı arayüzünün görünümünü de ayarlayabilirsiniz. Gezinme kullanıcı arayüzünde yapılabilecek kabul edilebilir değişikliklerle ilgili yönergeler için Politikalar sayfasını inceleyin.

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

Harita kullanıcı arayüzü kontrolleri

Navigasyon görünümüne özel kullanıcı arayüzü öğeleri yerleştirmek için harita kullanıcı arayüzü kontrollerini kullanarak doğru konumlandırma yapın. Yerleşik düzen değiştiğinde Android için Navigasyon SDK'sı, özel kontrollerinizi otomatik olarak yeniden konumlandırır. Her pozisyon için aynı anda bir özel kontrol görünümü ayarlayabilirsiniz. Tasarımınız birden fazla kullanıcı arayüzü öğesi gerektiriyorsa bunları bir ViewGroup içine yerleştirip setCustomControl yöntemine iletebilirsiniz.

setCustomControl yöntemi, CustomControlPosition enum'da tanımlandığı şekilde konumlar sağlar:

  • SECONDARY_HEADER (yalnızca portre modunda görünür)
  • BOTTOM_START_BELOW
  • BOTTOM_END_BELOW
  • FOOTER
Dikey yön için özel kontrol konumları.
Dikey yön için özel kontrol konumları
Yatay yön için özel kontrol konumları.
Yatay yön için özel kontrol konumları

Özel kontrol ekleme

  1. Özel kullanıcı arayüzü öğesi veya ViewGroup ile bir Android görünümü oluşturun.
  2. Görünümün bir örneğini almak için XML'i genişletin veya özel görünümü örneklendirin.
  3. CustomControlPosition enum'dan seçilen özel kontrol konumuyla NavigationView.setCustomControl veya NavigationFragment.setCustomControl kullanın.

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

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

Özel kontrolleri kaldırma

Özel bir denetimi kaldırmak için setCustomControl yöntemini bir null görünüm parametresi ve seçilen özel denetim konumuyla çağırın.

Örneğin, aşağıdaki snippet özel ikincil başlığı kaldırır ve varsayılan içeriğe döner:

mNavFragment.setCustomControl(null, CustomControlPosition.SECONDARY_HEADER);

Özel kontrol konumları

İkincil başlık

Dikey yön için ikincil başlık özel kontrol konumu.
Dikey yön için ikincil başlık özel kontrol konumu

Bu özel kontrol konumunu kullanmak için konumu CustomControlPosition.SECONDARY_HEADER değerinden setCustomControl değerine geçirin.

Varsayılan olarak, gezinme modundaki ekran düzenleri, birincil başlığın altında bulunan ikincil başlık için bir konum sağlar. Bu ikincil başlık, şerit yardımı gibi durumlarda 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, kontrolünüz varsayılan ikincil başlık içeriğini kapsar. Gezinme görünümünüzün arka planı varsa bu arka plan, ikincil başlık tarafından kaplanarak yerinde kalır. Uygulamanız özel kontrolü kaldırdığında, bunun yerine varsayılan ikincil başlıklar 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 desteklenir. landscape mode dilinde ikincil başlık kullanılamaz ve düzen değişmez.

Alt başlangıç

Dikey yön için alt başlangıç özel kontrol konumu.
Dikey yön için alt başlangıç özel kontrol konumu
Yatay yön için alt başlangıç özel kontrol konumu.
Yatay yön için alt başlangıç özel kontrol konumu

Bu özel kontrol konumunu kullanmak için konumu CustomControlPosition.BOTTOM_START_BELOW ile setCustomControl arasında iletin.

Bu özel kontrol konumu, haritanın sol alt köşesinde yer alır. Hem portrait mode hem de landscape mode'da, TVS kartının ve/veya özel altbilginin üzerinde (veya her ikisi de yoksa haritanın alt kısmında) yer alır. Yeniden ortalama düğmesi ve Google logosu dahil olmak üzere Nav SDK öğeleri, özel kontrol görünümünün yüksekliğini hesaba katmak için yukarı taşınır. Bu kontrol, görünür harita sınırlarının içine yerleştirilir. Bu nedenle, haritanın alt veya başlangıç kenarlarına eklenen dolgular bu kontrolün konumunu da değiştirir.

Alt uç

Dikey yön için alt uç özel kontrol konumu.
Dikey yön için alt uç özel kontrol konumu
Yatay yön için alt uç özel kontrol konumu.
Yatay yön için alt uç özel kontrol konumu

Bu özel kontrol konumunu kullanmak için konumu CustomControlPosition.BOTTOM_END_BELOW değerinden setCustomControl değerine geçirin.

Bu özel kontrol konumu, haritanın alt uç köşesinde yer alır. portrait mode uygulamasında, TVS kartının ve/veya özel altbilginin üzerinde (veya ikisi de yoksa haritanın alt kısmında) yer alır ancak landscape mode uygulamasında haritanın alt kısmıyla hizalanır. Uç tarafta (LTR'de sağ taraf) görünen tüm Nav SDK öğeleri, özel kontrol görünümünün yüksekliğini hesaba katmak için yukarı taşınır. Bu kontrol, görünür harita sınırları içinde yer alır. Bu nedenle, haritanın alt veya uç kenarlarına eklenen dolgular bu kontrolün konumunu da değiştirir.

Dikey yön için altbilgi özel kontrol konumu.
Dikey yön için altbilgi özel kontrol konumu
Yatay yön için altbilgi özel kontrol konumu.
Yatay yön için altbilgi özel kontrol konumu

Bu özel kontrol konumunu kullanmak için konumu CustomControlPosition.FOOTER ile setCustomControl arasında iletin.

Bu özel kontrol konumu, özel bir altbilgi görünümü için tasarlanmıştır. Nav SDK TVS kartı görünür durumdaysa bu kontrol, kartın üzerinde yer alır. Aksi takdirde, kontrol haritanın alt kısmıyla hizalanır. BOTTOM_START_BELOW ve BOTTOM_END_BELOW özel kontrollerinin aksine bu kontrol, görünür harita sınırlarının dışına yerleştirilir. Bu nedenle, haritaya eklenen dolgular bu kontrolün konumunu değiştirmez.

portrait mode uygulamasında özel altbilgi tam genişliktedir. Hem CustomControlPosition.BOTTOM_START_BELOW hem de CustomControlPosition.BOTTOM_END_BELOW konumlarındaki özel kontrollerin yanı sıra yeniden ortalama düğmesi ve Google logosu gibi Nav SDK kullanıcı arayüzü öğeleri, özel kontrol altbilgisinin üzerinde konumlandırılır. Şerit simgesinin varsayılan konumu, özel altbilgi yüksekliğini hesaba katar.

landscape mode sürümünde özel altbilgi, Navigasyon SDK'sı TVS kartı gibi yarı genişlikte ve başlangıç tarafına (soldan sağa dillerde sol taraf) hizalanır. CustomControlPosition.BOTTOM_START_BELOW konumundaki özel kontroller ve yeniden ortalama düğmesi ile Google logosu gibi Nav SDK kullanıcı arayüzü öğeleri, özel kontrol altbilgisinin üzerinde konumlandırılır. CustomControlPosition.BOTTOM_END_BELOW konumundaki özel kontroller ve bitiş tarafındaki (LTR'de sağ taraf) tüm Nav SDK kullanıcı arayüzü öğeleri, haritanın alt kısmıyla hizalı kalır. Altbilgi, haritanın son tarafına kadar uzanmadığından özel bir altbilgi olduğunda şerit simgesinin varsayılan konumu değişmez.

CustomControlPosition.BOTTOM_START_BELOW ve CustomControlPosition.BOTTOM_END_BELOW konumlarındaki özel kontrollerin yanı sıra yeniden ortalama düğmesi ve Google logosu gibi Navigasyon SDK'sı kullanıcı arayüzü öğeleri, özel kontrol altbilgisinin üzerine yerleştirilir.

Harita kullanıcı arayüzü aksesuarları

Android için Navigasyon SDK'sı, navigasyon sırasında Android için Google Haritalar uygulamasındakilere benzer 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 bir sonraki navigasyon oturumunda geçerli olur.

Gezinme kullanıcı arayüzünde kabul edilebilir değişikliklerle ilgili yönergeler için Politikalar sayfasını inceleyin.

Kodu görüntüleme

Hedef vurgulama ve girişler

placeID ile bir varış noktası oluşturulduğunda, varış noktası binası vurgulanır ve mümkün olduğunda bir giriş simgesi gösterilir. Bu görsel ipuçları, kullanıcıların hedeflerini ayırt etmelerine ve hedeflerine gitmelerine yardımcı olur.

placeID ile hedef oluşturmak için Waypoint.Builder.setPlaceIdString() yöntemini kullanın.

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

Navigasyon 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 NavigationFragment.setStylingOptions() veya NavigationView.setStylingOptions() simgesini kullanın.

Aşağıdaki özellikleri ayarlayabilirsiniz:

Özellik TürüÖzellikler
Arka plan rengi
  • Birincil gündüz modu: Navigasyon başlığının gündüz rengi
  • İkincil gündüz 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
Talimatlarla ilgili 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 ölçü birimlerinin metin rengi
  • Uzaklık ölçü birimlerinin metin boyutu
Manevra simgeleri
  • Büyük manevra simgesinin rengi
  • Küçük manevra simgesinin rengi
Şerit yardımı
  • Önerilen şeritlerin rengi

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

private NavigationFragment mNavFragment;
mNavFragment = (NavigationFragment) getSupportFragmentManager()
  .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() simgesini kullanın. Bu ayar, haritada gösterilen trafik yoğunluğu göstergelerini bir bütün olarak etkiler. Ancak navigasyon cihazı tarafından çizilen rotadaki 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ı ve dur işaretleri

Navigasyon rotası boyunca trafik ışığı ve dur işareti simgeleri.

Navigasyon etkinken haritada trafik ışıkları ve dur işaretleri gösterilir. Böylece kullanıcılara rota ve yaklaşan manevralar hakkında daha fazla bilgi verilir. 8.0.0 sürümünden itibaren bu özelliği devre dışı bırakamazsınız.

Ö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 Maps API belgelerine gidin.

Kayan metin

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

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

Hız sınırı simgesini programatik olarak gösterebilir veya gizleyebilirsiniz. Hız sınırı simgesini göstermek veya gizlemek için NavigationView.setSpeedLimitIconEnabled() veya NavigationFragment.setSpeedLimitIconEnabled() simgesini kullanın. Etkinleştirildiğinde, hız sınırı simgesi rehberlik sırasında alt köşede gösterilir. Simge, aracın seyahat ettiği yolun hız sınırını gösterir. Simge yalnızca güvenilir hız sınırı verilerinin mevcut olduğu konumlarda görünür.

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

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

Gece modunu ayarlama

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

  • AUTO Navigasyon SDK'sının, cihazın konumuna ve yerel saate göre uygun modu belirlemesine olanak tanır.
  • FORCE_NIGHT, gece modunu zorunlu olarak etkinleştirir.
  • FORCE_DAY, gündüz modunu zorunlu kılar.

Aşağıdaki örnekte, bir gezinme parçası içinde gece modunun zorunlu olarak etkinleştirilmesi gösterilmektedir:

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

Yol tarifi listesini görüntüleme

Öncelikle 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ü olaylarını, NavigationView ile olduğu gibi DirectionsListView'e yönlendirdiğinizden emin olun. Örneğin:

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

Alternatif rotaları gizle

Kullanıcı arayüzü çok fazla bilgiyle karmaşık hale geldiğinde, varsayılandan (iki) daha az alternatif rota göstererek veya hiç alternatif rota göstermeyerek karmaşıklığı azaltabilirsiniz. Rotaları getirmeden önce RoutingOptions.alternateRoutesStrategy() yöntemini aşağıdaki numaralandırma değerlerinden biriyle çağırarak bu seçeneği yapılandırabilirsiniz:

Numaralandırma DeğeriAçıklama
AlternateRoutesStrategy.SHOW_ALL Varsayılan. En fazla iki alternatif rota gösterir.
AlternateRoutesStrategy.SHOW_ONE Bir alternatif rota gösterir (varsa).
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

Navigasyona gezi ilerleme çubuğu eklendi.

Gezi ilerleme çubuğu, navigasyon başladığında haritanın başlangıç/ön tarafında görünen dikey bir çubuktur. Etkinleştirildiğinde, kullanıcının varış noktası ve mevcut konumuyla birlikte tüm geziye dair genel bir bakış sunar.

Bu sayede kullanıcılar, yakınlaştırma yapmadan trafik gibi yaklaşan sorunları önceden görebilir. Ardından, gerekirse gezi için yeni rota çizebilirler. 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 bulunur:

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

  • Mevcut konum: Kullanıcının gezideki mevcut konumu.

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

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

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

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

Gezi ilerleme çubuğu konumu

  • Çubuğun sol tarafı, hız göstergesinin, Google logosunun ve Yeniden ortala düğmesinin (görünür olduğunda) sol tarafıyla kabaca hizalanır. Genişlik 12 dp'dir.
  • Gezi ilerleme çubuğunun yüksekliği sabittir. Daha küçük cihazlardaki dikey alan sınırlamalarına uyum sağlamak için gezi ilerleme çubuğunun görünürlüğü ve yüksekliği, ekran yüksekliğindeki belirli kesme noktalarına göre ayarlanır. Bu kesme noktaları, cihazın yönünden ve haritanın ekranda gerçekte ne kadar yer kapladığından bağımsızdır:
  • Ekran yüksekliği Gezi ilerleme çubuğu görünürlüğü Gezi ilerleme çubuğu yüksekliği Gezi ilerleme çubuğu Y ekseni konumu
    Küçük: 0 dp - 551 dp Görünmez Yok Yok
    Orta: 552 dp - 739 dp Visible 130 dp Başlangıç tarafı kontrollerinin (hız göstergesi / Google logosu / yeniden ortalama düğmesi) üstünde
    Büyük: 740 dp ve üzeri Visible 290 dp Başlangıç tarafı kontrollerinin (hız göstergesi / Google logosu / yeniden ortalama düğmesi) üstünde
  • Gezi ilerleme çubuğu, dönüş kartı veya diğer navigasyon kullanıcı arayüzü öğeleriyle çakışırsa bu diğer öğelerin altında görünür.

Pusula

Navigation SDK, belirli koşullarda ve yalnızca etkinleştirildiğinde haritanın sağ üst köşesinde görünen bir pusula grafiği sağlar. Kullanıcı pusulayı tıkladığında kamera, yönü sıfır (varsayılan yön) olan bir konuma geri döner ve pusula kısa bir süre sonra kaybolur.

Navigasyon etkinleştirilmişse ve kamera modu "takip ediyor" olarak ayarlanmışsa pusula görünür kalır ve pusulaya dokunulduğunda eğik ve genel bakış kamera perspektifleri arasında geçiş yapılır.

Sürücünün dikkatinin dağılmaması için başlık (dikey modda) genişleyip pusulanın varsayılan konumuyla çakışırsa pusula aynı konumda kalır. İkincil bir başlık özel kontrolü veya başlık aksesuar görünümü eklerseniz kullanıcı arayüzü çakışmalarını önlemek için pusula gizlenir.

Pusula, gündüz ve gece modlarının yanı sıra koyu modu da destekler.

Pusula varsayılan olarak etkindir. GoogleMapOptions sınıfındaki compassEnabled yöntemini kullanarak pusulanın etkin olup olmayacağını ayarlayabilirsiniz.

3D binaları kapatma

Performans kısıtlaması olan cihazlarda GoogleMap.setBuildingsEnabled(false) yöntemini çağırarak 3D binaların gösterimini devre dışı bırakabilirsiniz.

Prompt Visibility API (Deneysel)

Prompt Visibility API, Navigation SDK tarafından oluşturulan kullanıcı arayüzü öğeleri ile kendi özel kullanıcı arayüzü öğeleriniz arasındaki çakışmaları önlemenize olanak tanır. Bunun için, Navigation SDK kullanıcı arayüzü öğesi görünmeden hemen önce ve öğe kaldırılır kaldırılmaz geri çağırma alacak bir dinleyici eklemeniz gerekir. Kod örnekleri de dahil olmak üzere daha fazla bilgi için Anlık kesintileri yapılandırma sayfasının Prompt Visibility API bölümüne bakın.