הגדרת מפה

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

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

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

  1. הגדרת קטע מפה למעקב אחרי נסיעה.
  2. הוספת תמיכה בשכבת בסיס של מפות וב-view controller.
  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. מגדירים את הפרגמנט בקובץ ה-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(). בנוסף לפרמטר של הקריאה החוזרת (callback), צריך לכלול את הפרטים הבאים:

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

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: מוסיפים תמיכה בשכבת בסיס של מפות וב-view controller

כדי לשתף את ההתקדמות בנסיעה באפליקציה, צריך להוסיף לאפליקציה את המחלקות הבאות: 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 כדי להשתמש בפריטים גרפיים וקטוריים שניתנים לשרטוט ב-SDK של Consumer.

Java

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

// ...

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

Kotlin

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

// ...

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

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

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

עיצוב מפה