iOS Google Places 검색 적용하기

Purpose

SwiftUI 를 사용중이고, 구글링한 소스들은 UIKit 으로 적용한 것이 많았다.

내가 하고 싶은 것은 지도 위에 검색바가 있고, 검색해서 이동하는 기능이었다.

SwiftUI 에서 사용하기 위해서 UIViewControllerRepresentable 를 상속받아서 구현하였다.

검색까지는 되는데 다시 앞 뷰에 전달하고, 이동하는 것은 각자마다 다르기 때문에 사실은 아직 거기까지 못해서

Google Places 검색을 적용하는 부분만 참고할 수 있도록 포스팅하려 한다.

Result 에서 결과를 볼 수 있는데 구글맵이 뒤에 깔려있는 것과 위에 검색부분은 아래 소스만 있다고 해서 되는 것이 아니다. 따로 구현해 놨던 것이고, 이 포스팅에서는 Google Places 검색 부분만 설명한 것이므로 양해바랍니다.

Source

GooglePlaces를 구현하는.swift

struct GooglePlacesView: UIViewControllerRepresentable {
    
    @Binding var address: String?
    
    let placeController = GMSAutocompleteViewController()
    
    func makeCoordinator() -> Coordinator {
        Coordinator()
    }
    
    typealias UIViewControllerType = GMSAutocompleteViewController
    
    func makeUIViewController(context: Context) -> GMSAutocompleteViewController {
        
        self.placeController.delegate = context.coordinator
        
        // self.placeController.present(placeController, animated: true, completion: nil)
        
        return placeController
    }
    
    func updateUIViewController(_ uiViewController: GMSAutocompleteViewController, context: Context) {
        
    }
    
    class Coordinator : NSObject, GMSAutocompleteViewControllerDelegate {
        func viewController(_ viewController: GMSAutocompleteViewController, didAutocompleteWith place: GMSPlace) {
            print("[viewController] place: \(place)")
            
            // fill the text field
            
            // dismiss
            viewController.dismiss(animated: true, completion: nil)
            
        }
        
        func viewController(_ viewController: GMSAutocompleteViewController, didFailAutocompleteWithError error: Error) {
            
            print("[viewController] error: \(error)")
        }
        
        func wasCancelled(_ viewController: GMSAutocompleteViewController) {
            
            viewController.dismiss(animated: true, completion: nil)
        }
        
        
    }
}

 

호출하는 View.swift

import SwiftUI

struct Location: View {
    
    // @State var view_height: CGFloat
    @State var address = "enter the place."
    @State var showSearchbar = false
    
    var body: some View {
        GeometryReader { geometry in
            
            ZStack {
                // GoogleMapView(view_height: $view_height)
                
                VStack {
                    SearchBar(searchKey: $address, width: geometry.size.width, height: geometry.size.height/12).onTapGesture {
                        self.showSearchbar = true
                    }
                    Spacer()
                }.sheet(isPresented: $showSearchbar) { GooglePlacesView() }
            }.edgesIgnoringSafeArea(.bottom)
        }
    }
}

SearchBar 는 내가 따로 구현한 UIView 이므로 그냥 버튼으로 바꿔서 클릭 시 showSearchbar = true 만 바꿔주는 것으로 바꾸면 된다.

Result

 

References

mildwhale.tistory.com/37

[iOS] SwiftUI와 UIKit 함께 사용하기

kentakodashima.medium.com/ios-google-places-autocomplete-api-e064c683b5a3

(iOS) Google Places Autocomplete API

medium.com/@arora72/googles-place-autocomplete-and-maps-integration-in-ios-swift-4-f890eeb5d428

Google’s Place AutoComplete and Maps integration in iOS, Swift 4.