지도 설정

플랫폼 선택: Android iOS

소비자 앱에서 여행을 팔로우하려면 먼저 필요한 경우 벡터 지도에 대한 지원을 추가합니다.

앱에서 지도를 설정하려면 다음 단계를 따르세요.

  1. 여정 공유를 위한 지도 프래그먼트를 정의합니다.
  2. 지도 기본 레이어 및 뷰 컨트롤러에 대한 지원을 추가합니다.
  3. 벡터를 표시하도록 Android 벡터 그래픽 지원 추가 사용할 수 있습니다.

지도를 정의한 후 뷰와 카메라를 추가할 수 있습니다. 컨트롤을 만들 수 있습니다. 자세한 내용은 지도 스타일 지정을 참조하세요.

1단계: 여정 공유를 위한 지도 프래그먼트 정의

지도 조각 또는 보기를 추가하여 지도를 정의하려면 소비자 앱에서 주문형 여행을 공유합니다. 지도를 정의하려면 다음 방법 중 하나를 따릅니다.

두 방법 모두 특성이 동일하므로 사용할 방법을 선택하세요. 애플리케이션에 더 적합합니다

두 방법 모두 다음 섹션에서 더 자세히 설명합니다.

지도 조각 또는 보기 추가

다음 중 하나를 사용하여 이동 상황을 표시하는 지도를 만들려면 프래그먼트나 뷰를 포함하려면 다음 단계를 따르고 코드 예제를 참조하세요.

  1. 다음 위치에 있는 애플리케이션 레이아웃 XML 파일에서 프래그먼트나 뷰를 정의합니다. /res/layout 다음을 사용하여 여정 공유 지도를 프래그먼트로 정의합니다. ConsumerMapFragment 또는 ConsumerMapView를 사용하여 뷰로 만듭니다.

    그러면 프래그먼트 또는 뷰가 여정에 대한 액세스를 제공합니다. 공유 지도를 만들 수 있습니다. 또한 지도는 ConsumerController에 대한 핸들을 추가하여 앱에서 사용자 여정 공유 환경을 맞춤설정할 수 있습니다

  2. onCreate() 메서드에서 getConsumerGoogleMapAsync(callback)를 호출합니다. 이 메서드는 콜백에서 ConsumerGoogleMap를 비동기식으로 반환합니다.

  3. ConsumerGoogleMap를 사용하여 이동 상황을 표시하고 필요에 따라 업데이트합니다.

ConsumerMapFragment 추가 방법 예

  1. 다음에 표시된 대로 애플리케이션 레이아웃 XML 파일에서 프래그먼트를 정의합니다. 다음 코드 예를 참고하세요.

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

  2. onCreate()에서 getConsumerGoogleMapAsync()에 전화 걸기 메서드를 사용하여 축소하도록 요청합니다.

자바

 public class SampleAppActivity extends AppCompatActivity {

   @Override
   protected void onCreate(Bundle savedInstanceState) {

     // Find the ConsumerMapFragment.
     ConsumerMapFragment consumerMapFragment =
         (ConsumerMapFragment) fragmentManager.findFragmentById(R.id.consumer_map_fragment);

     // Initiate the callback that returns the map.
     if (consumerMapFragment != null) {
       consumerMapFragment.getConsumerGoogleMapAsync(
           new ConsumerMapReadyCallback() {
             // The map returned in the callback is used to access the ConsumerController.
             @Override
             public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
               ConsumerController consumerController = consumerGoogleMap.getConsumerController();
             }
           });
     }
   }

 }

Kotlin

 class SampleAppActivity : AppCompatActivity() {
   override fun onCreate(savedInstanceState: Bundle?) {
     // Find the ConsumerMapFragment.
     val consumerMapFragment =
       fragmentManager.findFragmentById(R.id.consumer_map_fragment) as ConsumerMapFragment

     consumerMapFragment.getConsumerGoogleMapAsync(
       object : ConsumerMapReadyCallback() {
         override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
           val consumerController = consumerGoogleMap.getConsumerController()!!
         }
       }
     )
   }
 }

ConsumerMapView 추가 방법 예

  1. 다음에 정의된 대로 프래그먼트 또는 활동에서 뷰를 사용합니다. XML 파일입니다.

     <com.google.android.libraries.mapsplatform.transportation.consumer.view.ConsumerMapView
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:id="@+id/consumer_map_view"
     android:layout_width="match_parent"
     android:layout_height="match_parent" />

  2. onCreate()에서 getConsumerGoogleMapAsync()를 호출합니다. 포함 콜백 매개변수 외에 다음 세부정보를 포함합니다.

    • 포함하는 활동 또는 프래그먼트 활동 또는 프래그먼트 기본 클래스는 FragmentActivity 또는 지원 Fragment여야 합니다. (각각)가 포함됩니다.

    • 구성을 포함하는 GoogleMapOptions (null일 수 있음) MapView의 속성입니다.

자바

public class SampleAppActivity extends AppCompatActivity {

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

    if (mapView != null) {
      mapView.getConsumerGoogleMapAsync(
          new ConsumerMapReadyCallback() {
            // The map returned in the callback is used to access the ConsumerController.
            @Override
            public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerGoogleMap) {
              ConsumerController consumerController = consumerGoogleMap.getConsumerController();
            }
          }, this, null);
    }
  }

}

Kotlin

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

    mapView.getConsumerGoogleMapAsync(
      object : ConsumerMapReadyCallback() {
        // The map returned in the callback is used to access the ConsumerController.
        override fun onConsumerMapReady(consumerGoogleMap: ConsumerGoogleMap) {
          val consumerController = consumerGoogleMap.getConsumerController()!!
        }
      },
      /* fragmentActivity= */ this,
      /* googleMapOptions= */ null,
    )
  }
}

프래그먼트의 MapView은 활동 내 MapView(프래그먼트가 실행 중인 레이아웃을 확장하는 경우 제외) 프래그먼트 onCreateView() 메서드에 MapView가 포함되어 있어야 합니다.

자바

public class MapViewInFragment extends Fragment {

  @Override
  public View onCreateView(
      @NonNull LayoutInflater layoutInflater,
      @Nullable ViewGroup viewGroup,
      @Nullable Bundle bundle) {
    return layoutInflater.inflate(R.layout.consumer_map_view, viewGroup, false);
  }

}

Kotlin

class MapViewInFragment : Fragment() {
  override fun onCreateView(
    layoutInflater: LayoutInflater,
    container: ViewGroup?,
    savedInstanceState: Bundle?,
  ): View {
    return layoutInflater.inflate(R.layout.consumer_map_view, viewGroup, false)
  }
}

2단계: 지도 기본 레이어 및 뷰 컨트롤러 지원 추가

앱에서 여정 공유를 사용 설정하려면 다음을 추가하세요. ConsumerGoogleMap 및 ConsumerController 클래스를 앱에 추가합니다.

  • ConsumerGoogleMap ConsumerMapFragment 또는 ConsumerMapView는 둘 다 비동기식으로 반환됩니다. ConsumerMapReadyCallback의 ConsumerGoogleMap입니다.

    ConsumerGoogleMap는 GoogleMap 클래스의 래퍼 클래스입니다. 그것은 GoogleMap와 동일한 API로, 앱이 지도와 상호작용할 수 있습니다. 이렇게 하면 앱이 동일한 기본 Google Cloud 콘솔과 있습니다. 예를 들어 GoogleMap는 단일 콜백 등록만 허용하지만 ConsumerGoogleMap는 이중 등록된 콜백을 지원합니다. 이러한 콜백을 통해 앱은 순차적으로 호출되는 콜백을 등록합니다.

  • getConsumerController()의 ConsumerGoogleMap에서 ConsumerController을(를) 받습니다.

    ConsumerController 앱을 통해 다음과 같은 여정 공유 기능을 이용할 수 있습니다. 이동 상황을 모니터링하고, 이동 상태를 제어하고, 위치를 설정할 수 있습니다.

다음에서 앱에 ConsumerGoogleMap 및 ConsumerController를 추가하는 방법 다음 예를 참고하세요.

자바

private ConsumerGoogleMap consumerGoogleMap;
private ConsumerController consumerController;
private ConsumerMapView consumerMapView;

consumerMapView.getConsumerGoogleMapAsync(
    new ConsumerMapReadyCallback() {
      @Override
      public void onConsumerMapReady(@NonNull ConsumerGoogleMap consumerMap) {
        consumerGoogleMap = consumerMap;
        consumerController = consumerMap.getConsumerController();
      }
    },
    this, null);

Kotlin

var consumerGoogleMap: ConsumerGoogleMap
var consumerController: ConsumerController
val consumerMapView = findViewById(R.id.consumer_map_view) as ConsumerMapView

consumerMapView.getConsumerGoogleMapAsync(
  object : ConsumerMapReadyCallback() {
    override fun onConsumerMapReady(consumerMap: ConsumerGoogleMap) {
      consumerGoogleMap = consumerMap
      consumerController = consumerMap.getConsumerController()
    },
    /* fragmentActivity= */ this,
    /* googleMapOptions= */ null,
  }
)

3단계: Android 벡터 그래픽 지원 추가

앱 디자인에서 벡터 그래픽에 대한 지원이 필요한 경우 Android 기기와 벡터 드로어블을 만들려면 다음 단계를 따르세요.

  1. 다음 코드를 활동에 추가합니다. 이 코드는 AppCompatActivity: Consumer SDK에서 벡터 드로어블을 사용합니다.

자바

// ...
import android.support.v7.app.AppCompatActivity;

// ...

public class ConsumerTestActivity extends AppCompatActivity {
  // ...
}

Kotlin

// ...
import android.support.v7.app.AppCompatActivity

// ...

class ConsumerTestActivity : AppCompatActivity() {
  // ...
}

다음 단계

Android에서 여행 팔로우하기 지도 스타일 지정