Bản đồ i-p xử lý mtld
Did you know your iPhone makes it super easy to take a globe-trotting stroll down memory lane? Show
In 2016's iOS 10, Apple introduced the Memories tab in the Photos app to make the app easier to navigate than just one long stream of your pictures. That let it group pictures by months and years, people, and location. If you have Location Services enabled for the camera, Apple collects location metadata for pictures, which is how it's able to organize photos by "Place." A visual representation of that metadata is one of the most fun ways to look back at the memories you've captured on your iPhone. You can view a map of the world, with thumbnails of photos you've taken in different locations. Scroll out to see a bird's eye view of the cities and country's you've documented; Zoom in to see the location of photos get more and more specific, down even to street level. Viewing a map of your photos is a fun way to find what you're looking for. Credit: RACHEL KRAUS / MASHABLE This is super convenient for finding something you're looking for. You can always look at something by date, but that can be a frustrating search if you don't remember exactly when something happened. However, chances are you remember *where* whatever you're looking for happened. So zooming in on a map should take you where you need to go. These days, the Photos app has a lot going on. There are four tabs, and each of those tabs has sub-tabs. Here's how to get to the map.
Happy trails! 1. Before You BeginThis codelab teaches you how to use the Maps SDK for iOS with SwiftUI. Prerequisites
What you'll do
What you'll need
2. Get set upFor the following enablement step, enable Maps SDK for iOS. Set up Google Maps PlatformIf you do not already have a Google Cloud Platform account and a project with billing enabled, please see the Getting Started with Google Maps Platform guide to create a billing account and a project.
3. Download starter codeTo get you started as quickly as possible, here's some starter code to help you follow along with this codelab. You're welcomed to jump to the solution, but if you want to follow along with all the steps to build it yourself, keep reading.
git clone https://github.com/googlecodelabs/maps-ios-swiftui.git Alternatively, you can click the following button to download the source code.
4. Code OverviewIn the starter project you downloaded, the following classes have been provided and implemented for you:
Additionally, the following classes have partial implementations and will be completed by you by the end of this Codelab:
5. Using SwiftUI vs. UIKitSwiftUI was introduced in iOS 13 as an alternative UI framework over UIKit for developing iOS applications. Compared to its predecessor UIKit, SwiftUI offers a number of advantages. To name a few:
There are some drawbacks, too:
SwiftUI State and data flowSwiftUI offers a novel way to create UI using a declarative approach—you tell SwiftUI how you want your view to look along with all the different states for it, and the system will do the rest. SwiftUI handles updating the view whenever underlying state changes due to an event or user action. This design is commonly referred to unidirectional data flow. While the specifics of this design is out of scope in this codelab, we recommend reading up on how this works in Apple's documentation of State and Data Flow. Bridging UIKit and SwiftUI using UIViewRepresentable or UIViewControllerRepresentableSince the Maps SDK for iOS is built on top of UIKit, and does not yet provide a SwiftUI-compatible view, using it in SwiftUI
requires conforming to either 6. Add a mapIn this section, you will add Google Maps to a SwiftUI view. Add your API keyThe API key that you created in an earlier step needs to be provided to the Maps SDK for iOS to associate your account with the map that would be displayed on the app. To provide your API key, open the Add a Google Map using MapViewControllerBridgeNow that your API key is being provided to the SDK, the next step is to display the map on the app. The view controller that is provided in the starter code,
This class conforms to
UIViewControllerRepresentable which is the protocol that is needed to wrap a UIKit
Inside the function MapViewControllerBridge
Use MapViewControllerBridge in ContentViewNow that the
Within the ContentView
7. Add markers to the mapIn the previous step, you added a map alongside an interactable list displaying a list of cities. In this section, you will add markers for each city in that list. Markers as State
ContentView
Notice that CitiesList
Pass State to MapViewControllerBridge via BindingIn addition to the list of cities displaying data from the
MapViewControllerBridge
As mentioned in the previous step,
Since you added a new property in
Notice the prefix
8. Animate to a selected cityIn the previous step, you added markers to a map by passing State from one SwiftUI view to another. In this step, you will animate to a city/marker after it has been tapped in the interactable list. To perform the animation, you will react to changes to a State by modifying the map's camera position when the change occurs. To learn more about the concept of the map's camera, see Camera and View. Animate map to selected cityTo animate the map to a selected city:
ContentView
Whenever MapViewControllerBridge
Once a new Binding has been declared, you need to update
The
Once ContentView
Completing this step will now animate the map whenever a new city is selected in the list. Animate SwiftUI view to emphasize citySwiftUI makes animating views very easy as it will handle performing animations for State transitions. To demonstrate this, you will be adding more animations by focusing the view to the selected city after the map animation completes. To accomplish this, complete the following steps:
Because the SwiftUI animation will be performed after the map animation sequence you added previously, declare a new closure called MapViewControllerBridge
Implement the ContentView
9. Send an event to SwiftUIIn this step, you will listen to events emitted from the Using SwiftUI Coordinators
Create a nested class inside the MapViewControllerBridge
Next, implement the MapViewControllerBridge
With the custom coordinator created, the next step is to set the coordinator as the delegate for the view controller's map view. To do this, update the view controller initialization in MapViewControllerBridge
Since the goal is to update the view with the camera moves, declare a new closure property that accepts a boolean within MapViewControllerBridge
With the new closure declared on ContentView
10. CongratulationsCongratulations on getting this far! You covered a lot of ground and hopefully the lessons you learned allow you to now build your own SwiftUI app using the Maps SDK for iOS. What you learned
What's next?
What other codelabs would you like to see?Data visualization on mapsMore about customizing the style of my mapsBuilding for 3D interactions in mapsIs the codelab you want not listed above? Request it with a new issue here. Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates. [{ "type": "thumb-down", "id": "missingTheInformationINeed", "label":"Missing the information I need" },{ "type": "thumb-down", "id": "tooComplicatedTooManySteps", "label":"Too complicated / too many steps" },{ "type": "thumb-down", "id": "outOfDate", "label":"Out of date" },{ "type": "thumb-down", "id": "samplesCodeIssue", "label":"Samples / code issue" },{ "type": "thumb-down", "id": "otherDown", "label":"Other" }] [{ "type": "thumb-up", "id": "easyToUnderstand", "label":"Easy to understand" },{ "type": "thumb-up", "id": "solvedMyProblem", "label":"Solved my problem" },{ "type": "thumb-up", "id": "otherUp", "label":"Other" }] |