![]() Enable Maps SDK for Android, Maps SDK for iOS, Maps JavaScript API (required for testing maps in Run-mode of FlutterFlow), and Directions API (for drawing the routes on the map).Īdd the required credentials to FlutterFlow for using the GoogleMap widget:.Select the Maps category from the left menu.Select the correct Firebase project from the dropdown present on the top.Go to the Google Developers Console page.You need to configure Google Maps inside FlutterFlow before using the widget to display maps in your app.Įnable the required Maps APIs by following these steps: You are ready to store ride information on the database! □ Configuring Google Maps This page is used for logging in the existing users to the rider app.įor the ride collection delete rule, use Tagged Users with user_uid as the field. Let's have a quick walkthrough of the different screens you will need for this app. This blog focuses on integrating a live tracking experience with the rider side of the app. ![]() The driver version of the app will be covered in a separate article. In this article, we'll only focus on the Rider App. After accepting the booking, the cab driver would be able to see the user's location and navigate to the pickup spot. Driver App: Using this app, drivers can see the list of currently available bookings and will be able to accept a booking.Once a driver accepts the booking, real-time updates of the driver's location will be previewed. Rider App: Using this app, users can choose their destination and book a cab.Preview the real-time location updates on the mapsįor building this service, you would need two apps:.We would use an example of building a ride-hailing service to demonstrate how you can: Getting startedīefore getting started with the actual implementation, let's have an overview of the apps. Today, you will learn to build RouteViewStatic and RouteViewLive custom widgets along with helper custom action to update the current location to Firestore. Background knowledgeįlutterFlow already has a widget called GoogleMap that allows you to interact with the map by zooming and panning, point out nearby locations (restaurants, gas stations, etc.) using markers, show traffic on the map, and also allows you to preview the map in various types (terrain, hybrid, satellite) and styles (standard, night, retro).īut as of now, the GoogleMap widget does not allow you to draw a route on the map and update it in real-time according to the changes in location data.įear not, here comes one of the major advantages of using a low code platform - you can write your custom code and just add it to the FlutterFlow project. You must be at least on the Standard Plan of FlutterFlow, which is required for downloading the app's source code.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |