הגדרת מפה

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

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

כדי להגדיר מפה באפליקציה, פועלים לפי השלבים הבאים:

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

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

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

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

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

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

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

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

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

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

  1. מגדירים קטע או תצוגה בקובץ ה-XML של פריסת האפליקציה שנמצא בתיקייה /res/layout. מגדירים את מפת הנסיעה כקטע באמצעות ConsumerMapFragment או כתצוגה באמצעות ConsumerMapView.

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

  2. מהשיטה של onCreate(), קוראים ל-getConsumerGoogleMapAsync(callback), שמחזירה את ConsumerGoogleMap באופן אסינכרוני בקריאה החוזרת.

  3. אפשר להשתמש בלחצן ConsumerGoogleMap כדי להציג את התקדמות הנסיעה ולעדכן אותה לפי הצורך.

דוגמה להוספת ConsumerMapFragment

  1. מגדירים את ה-fragment בקובץ ה-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() באמצעות ה-method‏ 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 היא מחלקת wrapper למחלקה GoogleMap. הוא משתמש בממשק API ששווה ל-GoogleMap כדי שהאפליקציה תוכל ליצור אינטראקציה עם המפה. כך האפליקציה יכולה ליצור אינטראקציה חלקה עם אותה מפת Google בסיסית. לדוגמה, GoogleMap מאפשר רק רישום של קריאה חוזרת אחת, אבל ConsumerGoogleMap תומך ברישום של שתי קריאות חוזרות. הקריאות החוזרות האלה מאפשרות לאפליקציה לרשום קריאות חוזרות שמופעלות ברצף.

  • אפשר לקבל 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 ובנכסי וקטור באמצעות השלבים הבאים:

  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

עיצוב מפה