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

Android için Navigasyon SDK'sını kullanarak, yeni sürümdeki haritanızda, yerleşik kullanıcı arayüzü kontrollerinden ve öğelerinden hangisinin tıklayın. Gezinme kullanıcı arayüzünün görsel görünümünü de ayarlayabilirsiniz. Öner Politikalar sayfasına gidin. üzerinde gerçekleştirilen kabul edilebilir değişikliklerle ilgili yönergelerdir.

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. İlgili içeriği oluşturmak için kullanılan Android için Navigasyon SDK'sı özel denetimlerinizi otomatik olarak yeniden konumlandırır yerleşik düzen değiştiğinde ortaya çıkar. Düzenin her konumu için tek bir özel kontrol. Özel kontrol, bir kullanıcı arayüzü öğesi olabilir. daha fazla kullanıcı arayüzü öğesi gerektirdiğinden ViewGroup öğesini birden fazla kullanıcı arayüzü öğesi ile kullanabilirsiniz.

setCustomControl yöntem CustomControlPosition içinde tanımlandığı şekilde konumları sağlar enum:

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

Örneğin, aşağıdaki resimlerde bir kullanıcı arayüzü kontrolünün çeşitli konumlarına ilişkin örnekler gösterilmektedir araç paylaşımı sürücüsüne, yolcu alma sırasında yolcunun konumu hakkında bilgi veren

Özel Denetim
Konumlar

Özel bir ikincil üstbilgi ekleme

Varsayılan olarak, gezinme modundaki ekran düzenleri, ikincil birincil başlığın altında bulunur. Bu ikincil üstbilgi, irdelenmesi gerekebilir. Uygulamanız bu ikincil başlığı kullanabilir özel içerik düzeninin konumunu belirler. Bu özelliği kullandığınızda kontrolü herhangi bir varsayılan ikincil üstbilgi içeriğini kapsar. Gezinme görünümünüzde arka plan olarak kalırsa, bu arka plan ikincil başlığın içinde kalır. Uygulamanız özel denetimi kaldırdığında, varsayılan ikincil üstbilgiler görünür.

Özel ikincil başlık konumu, üst kenarını birincil üstbilgidir. Bu konum yalnızca portrait mode dilinde desteklenmektedir. İçinde landscape mode, ikincil üstbilgi kullanılamaz ve düzen unutmayın.

  1. Android View oluşturma öğesini kullanın.
  2. XML'yi şişirin veya görünümündeyken ikincil üstbilgi olarak ekleyin.
  3. NavigationView.setCustomControl veya CustomControlPosition olarak SupportNavigationFragment.setCustomControl İKİNCİL_BAŞLIK.

    Aşağıdaki örnekte bir parça oluşturulur ve ikincil başlık konumu.

     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 geri dönmek için setCustomControl yöntemini çağırı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, dokümanın alt kenarına hizalı özel bir kontrol belirtebilir gezinme görünümünü kullanabilirsiniz. Uygulamanız özel kontrolü eklediğinde, yeniden ortala düğmesi ve buna yer açmak için yukarıya taşındığını varsayalım.

  1. Android View oluşturma bunu, eklemek istediğiniz kullanıcı arayüzü öğesiyle veya görünüm grubuyla değiştirin.
  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 kullanılacak kontrolü ve konumu belirleyin.

Aşağıdaki örnekteView SupportNavigationFragment:

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 kontrolün konumunu değiştirin.

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ı, uygulamasında bulunan gezinme işlevlerine benzer. Bu denetimlerin görünürlüğünü veya görsel görünümünü aşağıdaki seçenekleri kullanarak ayarlayabilirsiniz: bu bölümde açıklanmıştır. Burada yaptığınız değişiklikler sonraki gezinme oturumunda anlatacağım.

Politikalar sayfasını ziyaret edin: gezinme kullanıcı arayüzünde kabul edilebilir değişiklikler.

Kodu göster

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

Tekliflerinizi otomatikleştirmek ve optimize etmek için SupportNavigationFragment.setStylingOptions() veya NavigationView.setStylingOptions() veya sonraki dönüş göstergesinin temasını değiştirmek için varsa başlığın altında görünür.

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

Tekliflerinizi otomatikleştirmek ve optimize etmek için GoogleMap.setTrafficEnabled() trafik katmanını etkinleştirin veya devre dışı bırakın. Bu ayar, bütün olarak haritada gösterilen trafik yoğunluğu göstergeleri. Ancak, rota üzerindeki trafik göstergelerini etkiler.

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ı, kontrol panelinin yanında trafik ışıklarının veya dur işareti simgelerinin gösterilmesini etkinleştirebilir. Böylece daha verimli ve isabetli geziler için daha iyi bağlam bilgisi sunar.

Varsayılan olarak, trafik ışıkları ve dur işaretleri Gezinme SDK'sı. Bu özelliği etkinleştirmek için şu numarayı arayın: DisplayOptions her bir özellik için ayrı ayrı.

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. Şuraya gidin: Haritalar API'si dokümanları konulu videomuzu izleyin.

Kayan metin

Kayan metin, Google ilişkilendirmesi. Gezinme SDK'sı metin sabitlemeyi desteklemiyor bir enlem/boylama veya bir etikete ekleyin. Bilgi Daha fazlası için Windows'u kullanabilirsiniz ekleyebilirsiniz.

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

Hız sınırı simgesini programatik olarak gösterebilir veya gizleyebilirsiniz. Tekliflerinizi otomatikleştirmek ve optimize etmek için NavigationView.setSpeedLimitIconEnabled() veya SupportNavigationFragment.setSpeedLimitIconEnabled() hız sınırı simgesini görüntüleyin veya gizleyin. Etkinleştirildiğinde, hız sınırı simgesi bir alt köşede gösterilir. Simge, hız sınırını gösterir bir görünüm oluşturabilirsiniz. Simge yalnızca şu konumlarda görünür (güvenilir hız sınırı verilerinin bulunduğu siteler)

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

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

Gece modunu ayarla

Gece modunun davranışını programlı bir şekilde kontrol edebilirsiniz. Tekliflerinizi otomatikleştirmek ve optimize etmek için NavigationView.setForceNightMode() veya SupportNavigationFragment.setForceNightMode() gece modunu açın veya kapatın ya da Android için Navigasyon SDK'sının işleyeceğiz.

  • AUTO Gezinme SDK'sının konuma ve yerel saate göre uygun modda gösterilir.
  • FORCE_NIGHT, gece modunu zorlar.
  • FORCE_DAY, gün modunu açık tutar.

Aşağıdaki örnekte, navigasyonda gece modunun açılmaya zorlanması gösterilmektedir parça:

// 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, DirectionsListView'a olduğu gibi yönlendirdiğinizden emin olun. NavigationView ile birlikte. Örneğin:

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

Alternatif rotalar gizleniyor

Kullanıcı arayüzü çok fazla bilgiyle karıştırılırsa Varsayılandan (iki) daha az alternatif rota görüntüleyerek karmaşayı azaltır veya hiçbir alternatif rota görüntülemeyerek. Bu seçeneği, RoutingOptions.alternateRoutesStrategy() öğesini çağırarak rotaları getirirsiniz yöntemini kullanın:

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, sağ kenarda görünen dikey bir çubuktur haritada gösterilir. Bu seçenek etkinleştirildiğinde, kullanıcının varış noktası ve mevcut konumuyla birlikte seyahatin tamamını gösterir.

Kullanıcılar yaşanabilecek sorunları hızlı bir şekilde tahmin edebilmeleri için trafik olarak ayarlayın. Daha sonra gerekirse gerekir. Kullanıcı geziyi başka bir yere yönlendirirse, ilerleme çubuğu yeni bir o noktadan itibaren başladı.

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ı.

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

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