Haritanın stilini ayarlama

Bu kılavuzda, bir geziyi takip ederken iOS uygulamanızda gösterilen haritayı nasıl stillendirebileceğiniz açıklanmaktadır.

Başlamadan önce

Bir haritayı stillendirmeden önce, aşağıdaki özelliklerin uygulandığı bir tüketici uygulamanız olmalıdır:

• Harita görünümü. Harita görünümünü başlatma bölümüne bakın.

• Harita görünümü etkinliklerini işlemenin bir yolu. Harita görünümü etkinliklerini işleme başlıklı makaleyi inceleyin.

Ayrıca Tüketici SDK'sının ihtiyaç duyduğu arka uç hizmetlerini ve Tüketici SDK'sını da ayarlamanız gerekir. Ayrıntılar için Tüketici SDK'sını ayarlama ve Fleet Engine nedir? başlıklı makaleleri inceleyin.

Harita özelleştirmeleri

Kullanılabilen özelleştirmeler şunlardır:

• Haritayı stilize etme: Bulut tabanlı harita stillerini kullanarak harita renklerini, çoklu çizgileri ve diğer harita özelliklerini stilize edebilirsiniz. Haritayı stillendirme bölümüne bakın.

• Kamera yakınlaştırmasını ayarlama: Bir yolculuğa odaklanmak için yerleşik özelliği kullanabilir veya kendi kamera seçeneklerinizi ayarlayabilirsiniz. Bir geziye odaklanmak için kamera yakınlaştırmasını ayarlama başlıklı makaleyi inceleyin.

• İşaretçileri ve çoklu çizgileri özelleştirme: Uygulama tasarımınıza özel işaretçiler ve rota çoklu çizgileri ekleyebilirsiniz. Bu tasarım öğeleri, Tüketici uygulamanızın aracın rotasının dinamik bir önizlemesini göstermesini sağlar. İşaretçileri özelleştirme ve Çoklu çizgileri özelleştirme başlıklı makaleleri inceleyin.

  SDK, bu seçenekleri consumerMapStyleCoordinator özelliği aracılığıyla sağlar. Bu özelliğe GMTCMapView sınıfı üzerinden erişilebilir.

Haritayı bulut tabanlı harita stilleriyle biçimlendirme

Bulut tabanlı harita stillerini kullanarak harita bileşeninin görünümünü ve tarzını özelleştirin. Google Haritalar'ı kullanan uygulamalarınız için Google Cloud Console'da harita stilleri oluşturup düzenleyebilirsiniz. Bu işlem için kodunuzda herhangi bir değişiklik yapmanız gerekmez. Daha fazla bilgi için Bulut tabanlı harita stilleri sayfasında platformunuzu seçin.

Hem ConsumerMapView hem de ConsumerMapFragment sınıfları bulut tabanlı harita stillerini destekler. Bulut tabanlı harita stillerini kullanmak için seçilen harita oluşturucunun LATEST olduğundan emin olun. Aşağıdaki bölümlerde, projenizde bulut tabanlı harita stillerinin nasıl kullanılacağına dair örnekler gösterilmektedir.

ConsumerMapView

ConsumerMapView içinde bulut tabanlı harita stillerini kullanmak için GoogleMapOptions üzerinde mapId alanını ayarlayın ve GoogleMapOptions değerini getConsumerGoogleMapAsync(ConsumerMapReadyCallback, Fragment, GoogleMapOptions) veya getConsumerGoogleMapAsync(ConsumerMapReadyCallback, FragmentActivity, GoogleMapOptions) yöntemine iletin.

Örnek

public class SampleAppActivity extends AppCompatActivity {

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    ConsumerMapView mapView = findViewById(R.id.consumer_map_view);

    if (mapView != null) {
      GoogleMapOptions optionsWithMapId = new GoogleMapOptions().mapId("map-id");
      mapView.getConsumerGoogleMapAsync(
          new ConsumerMapReadyCallback() {
            @Override
            public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
              // ...
            }
          },
          /* fragmentActivity= */ this,
          /* googleMapOptions= */ optionsWithMapId);
    }
  }
}

class SampleAppActivity : AppCompatActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    val mapView = findViewById(R.id.consumer_map_view) as ConsumerMapView

    val optionsWithMapId = GoogleMapOptions().mapId("map-id")
    mapView.getConsumerGoogleMapAsync(
      object : ConsumerGoogleMap.ConsumerMapReadyCallback() {
        override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
          // ...
        }
      },
      /* fragmentActivity= */ this,
      /* googleMapOptions= */ optionsWithMapId)
  }
}

ConsumerMapFragment

ConsumerMapFragments'ta bulut tabanlı harita stillerini kullanmanın iki yolu vardır:

• XML ile statik olarak.
• newInstance ile dinamik olarak.

XML ile statik olarak

ConsumerMapFragment içinde XML ile bulut tabanlı harita stillerini kullanmak için belirtilen mapId ile map:mapId XML özelliğini ekleyin. Aşağıdaki örneğe bakın:

<fragment
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:map="http://schemas.android.com/apk/res-auto"
    android:name="com.google.android.libraries.mapsplatform.transportation.consumer.view.ConsumerMapFragment"
    android:id="@+id/consumer_map_fragment"
    map:mapId="map-id"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

newInstance ile dinamik olarak

ConsumerMapFragment içinde newInstance ile bulut tabanlı harita stillerini kullanmak için GoogleMapOptions üzerinde mapId alanını ayarlayın ve GoogleMapOptions değerini newInstance değerine iletin. Aşağıdaki örneğe bakın:

public class SampleFragmentJ extends Fragment {

  @Override
  public View onCreateView(
      @NonNull LayoutInflater inflater,
      @Nullable ViewGroup container,
      @Nullable Bundle savedInstanceState) {

    final View view = inflater.inflate(R.layout.consumer_map_fragment, container, false);

    GoogleMapOptions optionsWithMapId = new GoogleMapOptions().mapId("map-id");
    ConsumerMapFragment consumerMapFragment = ConsumerMapFragment.newInstance(optionsWithMapId);

    getParentFragmentManager()
        .beginTransaction()
        .add(R.id.consumer_map_fragment, consumerMapFragment)
        .commit();

    consumerMapFragment.getConsumerGoogleMapAsync(
        new ConsumerMapReadyCallback() {
          @Override
          public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
            // ...
          }
        });

    return view;
  }
}

class SampleFragment : Fragment() {
  override fun onCreateView(
    inflater: LayoutInflater,
    container: ViewGroup?,
    savedInstanceState: Bundle?): View? {

    val view = inflater.inflate(R.layout.consumer_map_fragment, container, false)

    val optionsWithMapId = GoogleMapOptions().mapId("map-id")
    val consumerMapFragment = ConsumerMapFragment.newInstance(optionsWithMapId)

    parentFragmentManager
      .beginTransaction()
      .add(R.id.consumer_map_fragment, consumerMapFragment)
      .commit()

    consumerMapFragment.getConsumerGoogleMapAsync(
      object : ConsumerMapReadyCallback() {
        override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
          // ...
        }
      })

    return view
  }
}

Kamera yakınlaştırmasını bir geziye odaklanacak şekilde ayarlama

Etkin bir gezi paylaşımı oturumu sırasında kullanıcının, aracın rotadaki yakın görünümü yerine yolculuk boyunca aracın daha geniş bir görünümünü görmesi faydalı olur. Bunu yapmak için yerleşik AutoCamera kullanarak veya kamera davranışını aşağıdaki gibi kendiniz özelleştirerek kamera yakınlaştırma seviyesini ayarlarsınız:

• AutoCamera: AutoCamera kullanmak istiyorsanız herhangi bir işlem yapmanız gerekmez. Kamera varsayılan olarak geziyi takip eder.

• Kamera davranışını özelleştirme: Kamera davranışını özelleştirmek için AutoCamera ayarını devre dışı bırakmanız ve ardından özelleştirmelerinizi yapmanız gerekir.

AutoCamera, kamerayı varsayılan olarak ortalar

Tüketici SDK'sı, Haritalar SDK'sının yerleşik Konumum düğmesinde varsayılan olarak etkinleştirilen bir AutoCamera özelliği sunar. Kamera, gezi rotasına ve bir sonraki gezi ara noktasına odaklanmak için yakınlaştırır.

AutoCamera özelliğini kullanmak istiyorsanız etkinleştirildiğinden emin olun. Daha fazla bilgi için allowCameraAutoUpdate başlıklı makaleyi inceleyin.

Haritalar SDK'sı için Konumum düğmesiyle ilgili ayrıntıları iOS için Haritalar SDK'sı belgelerindeki Konumum düğmesi bölümünde bulabilirsiniz.

Kamera davranışını özelleştirme

Kamera davranışını daha fazla kontrol etmek için AutoCamera özelliğini devre dışı bırakıp kamera davranışını özelleştirebilirsiniz.

AllowCameraAutoUpdate özelliğiyle AutoCamera özelliğini devre dışı bırakın veya etkinleştirin.

Daha fazla kamera özelleştirmesi için iOS için Haritalar SDK'sı belgelerindeki Kamerayı hareket ettirme bölümüne bakın.

Sırada ne var?

iOS'te bir geziyi takip etme