הגדרת מפה

בחירת פלטפורמה: Android iOS

כדי לעקוב אחרי נסיעה באפליקציה של הצרכן, קודם צריך להגדיר מפה ולהוסיף תמיכה במפות וקטורים, אם יש צורך.

כדי להגדיר מפה באפליקציה:

  1. הגדרת קטע מפה כדי לעקוב אחרי נסיעה.
  2. הוספת תמיכה בשכבת בסיס של מפות ובבקר תצוגה.
  3. מוסיפים תמיכה בגרפיקה וקובצי וקטורים ל-Android כדי להציג מפות וקטורים, אם יש צורך.

אחרי שמגדירים מפה, אפשר להוסיף תצוגות נוספות ואמצעי בקרה של המצלמה כדי להתאים אישית את חוויית הצפייה. פרטים נוספים זמינים במאמר הוספת סגנון למפה.

שלב 1: מגדירים קטע מפה כדי לעקוב אחרי נסיעה

כדי להגדיר מפה, מוסיפים קטע מפה או תצוגה כדי ליצור את המפה שבה משתפים נסיעה על פי דרישה באפליקציה של הצרכן. כדי להגדיר את המפה, פועלים באחת מהשיטות הבאות:

  • ConsumerMapFragment: משתמשים בו כדי להגדיר את המפה באמצעות Fragment.

  • ConsumerMapView: משמש להגדרת מפה עם View.

התכונות הן זהות בשתי השיטות, לכן עליכם לבחור את השיטה שמתאימה יותר לאפליקציה שלכם.

שתי השיטות מפורטות בהרחבה בקטע הבא.

הוספת קטע או תצוגה של מפה

כדי ליצור מפה שמוצגת בה התקדמות הנסיעה באמצעות קטע קוד ב-Android או תצוגה, פועלים לפי השלבים הבאים ומעיינים בדוגמאות הקוד.

  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. קוראים ל-getConsumerGoogleMapAsync() מהשיטה onCreate().

Java

 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. מתקשרים למספר getConsumerGoogleMapAsync() מ-onCreate(). בנוסף לפרמטר של הקריאה החוזרת, צריך לכלול את הפרטים הבאים:

    • הפעילות או הפלח שמכילים את הרכיב. סוג הבסיס של הפעילות או של הפלח חייב להיות FragmentActivity או Fragment תומך (בהתאמה), כי הם מספקים גישה למחזור החיים שלו.

    • GoogleMapOptions (שיכול להיות null), שמכיל מאפייני תצורה של MapView.

Java

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 בפעילות, מלבד העובדה שהחלק מקוד מנפח את הפריסה שכוללת את MapView בשיטה onCreateView() של החלק מקוד.

Java

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, שתיהן מחזירות את ConsumerGoogleMap ב-ConsumerMapReadyCallback באופן אסינכרוני.

    ConsumerGoogleMap היא מחלקת עטיפה למחלקה GoogleMap. הוא משתמש ב-API שזהה ל-GoogleMap כדי שהאפליקציה תוכל לקיים אינטראקציה עם המפה. כך האפליקציה יכולה לקיים אינטראקציה חלקה עם אותה מפה בסיסית של Google. לדוגמה, GoogleMap מאפשרת רק רישום של קריאה חוזרת אחת, אבל ConsumerGoogleMap תומכת בשתי קריאות חוזרות רשומות. קריאות החזרה האלה מאפשרות לאפליקציה לרשום קריאות חוזרות (callbacks) שנקראות ברצף.

  • עלו על ConsumerController מ-ConsumerGoogleMap ב-getConsumerController().

    ConsumerController מספק גישה לתכונות של שיתוף נסיעות, כמו מעקב אחרי נסיעות, שליטה בסטטוס הנסיעה והגדרת מיקומים.

כדי להבין איך מוסיפים את ConsumerGoogleMap ו-ConsumerController לאפליקציה ב-Java וב-Kotlin, אפשר לעיין בדוגמאות הבאות.

Java

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 ובקובצי drawable וקטוריים באופן הבא:

  1. מוסיפים את הקוד הבא לפעילות. הקוד הזה מרחיב את AppCompatActivity כך שיאפשר להשתמש ב-Vector drawables ב-Consumer SDK.

Java

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

// ...

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

Kotlin

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

// ...

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

המאמרים הבאים

מעקב אחרי נסיעה ב-Android

התאמת סגנון למפה