Place Autocomplete

บริการเติมข้อความอัตโนมัติใน Places SDK สำหรับ iOS จะแสดงการคาดคะเนจากคำค้นหาของผู้ใช้ เมื่อผู้ใช้พิมพ์ บริการเติมข้อความอัตโนมัติจะแสดงคำแนะนำสำหรับสถานที่ เช่น ธุรกิจ ที่อยู่ เครื่องหมายบวก และจุดสนใจ

คุณเพิ่มการเติมข้อความอัตโนมัติในแอปได้ด้วยวิธีต่อไปนี้

• เพิ่มการควบคุม UI ของการเติมข้อความอัตโนมัติเพื่อประหยัดเวลาในการพัฒนาและให้ผู้ใช้ได้รับประสบการณ์ที่สอดคล้องกัน
• รับการคาดคะเนสถานที่แบบเป็นโปรแกรมเพื่อสร้างประสบการณ์ของผู้ใช้ที่กำหนดเอง

การเพิ่มการควบคุม UI ของการเติมข้อความอัตโนมัติ

การควบคุม UI ของการเติมข้อความอัตโนมัติคือกล่องโต้ตอบการค้นหาที่มีฟังก์ชันการเติมข้อความอัตโนมัติในตัว เมื่อผู้ใช้ป้อนข้อความค้นหา ตัวควบคุมจะแสดงรายชื่อสถานที่ที่คาดคะเนให้เลือก เมื่อผู้ใช้เลือกแล้ว ระบบจะแสดงผลอินสแตนซ์ GMSPlace ซึ่งแอปของคุณจะใช้ดูรายละเอียดเกี่ยวกับสถานที่ที่เลือกได้

คุณเพิ่มการควบคุม UI การเติมข้อความอัตโนมัติในแอปได้ด้วยวิธีต่อไปนี้

• เพิ่มการควบคุมแบบเต็มหน้าจอ
• เพิ่มตัวควบคุมผลลัพธ์
• ใช้แหล่งข้อมูลของตาราง

การเพิ่มการควบคุมแบบเต็มหน้าจอ

ใช้การควบคุมแบบเต็มหน้าจอเมื่อต้องการบริบทแบบโมดัล ซึ่ง UI การเติมข้อความอัตโนมัติจะแทนที่ UI ของแอปชั่วคราวจนกว่าผู้ใช้จะตัดสินใจเลือก คลาส GMSAutocompleteViewController เป็นฟังก์ชันการทำงานนี้ เมื่อผู้ใช้เลือกสถานที่ แอปของคุณจะได้รับการติดต่อกลับ

วิธีเพิ่มการควบคุมแบบเต็มหน้าจอลงในแอป

1. สร้างองค์ประกอบ UI ในแอปหลักเพื่อเปิดตัวควบคุม UI การเติมข้อความอัตโนมัติ เช่น เครื่องจัดการการสัมผัสใน UIButton
2. ใช้โปรโตคอล GMSAutocompleteViewControllerDelegate ในตัวควบคุมมุมมองระดับบนสุด
3. สร้างอินสแตนซ์ของ GMSAutocompleteViewController และกำหนดตัวควบคุมมุมมองระดับบนสุดเป็นพร็อพเพอร์ตี้ผู้รับมอบสิทธิ์
4. สร้าง GMSPlaceField เพื่อกำหนดประเภทข้อมูลสถานที่ที่จะแสดงผล
5. เพิ่ม GMSAutocompleteFilter เพื่อจำกัดการค้นหาเป็นประเภทสถานที่ที่เฉพาะเจาะจง
6. นำเสนอ GMSAutocompleteViewController โดยใช้ [self presentViewController...]
7. จัดการตัวเลือกของผู้ใช้ในวิธีการมอบสิทธิ์ didAutocompleteWithPlace
8. ปิดตัวควบคุมในเมธอดการมอบสิทธิ์ didAutocompleteWithPlace, didFailAutocompleteWithError และ wasCancelled

ตัวอย่างต่อไปนี้แสดงวิธีหนึ่งที่เป็นไปได้ในการเปิดใช้ GMSAutocompleteViewController เพื่อตอบสนองต่อการที่ผู้ใช้แตะปุ่ม

import UIKit
import GooglePlaces

class ViewController: UIViewController {

  override func viewDidLoad() {
    makeButton()
  }

  // Present the Autocomplete view controller when the button is pressed.
  @objc func autocompleteClicked(_ sender: UIButton) {
    let autocompleteController = GMSAutocompleteViewController()
    autocompleteController.delegate = self

    // Specify the place data types to return.
    let fields: GMSPlaceField = GMSPlaceField(rawValue: UInt(GMSPlaceField.name.rawValue) |
      UInt(GMSPlaceField.placeID.rawValue))!
    autocompleteController.placeFields = fields

    // Specify a filter.
    let filter = GMSAutocompleteFilter()
    filter.types = [.address]
    autocompleteController.autocompleteFilter = filter

    // Display the autocomplete view controller.
    present(autocompleteController, animated: true, completion: nil)
  }

  // Add a button to the view.
  func makeButton() {
    let btnLaunchAc = UIButton(frame: CGRect(x: 5, y: 150, width: 300, height: 35))
    btnLaunchAc.backgroundColor = .blue
    btnLaunchAc.setTitle("Launch autocomplete", for: .normal)
    btnLaunchAc.addTarget(self, action: #selector(autocompleteClicked), for: .touchUpInside)
    self.view.addSubview(btnLaunchAc)
  }

}

extension ViewController: GMSAutocompleteViewControllerDelegate {

  // Handle the user's selection.
  func viewController(_ viewController: GMSAutocompleteViewController, didAutocompleteWith place: GMSPlace) {
    print("Place name: \(place.name)")
    print("Place ID: \(place.placeID)")
    print("Place attributions: \(place.attributions)")
    dismiss(animated: true, completion: nil)
  }

  func viewController(_ viewController: GMSAutocompleteViewController, didFailAutocompleteWithError error: Error) {
    // TODO: handle the error.
    print("Error: ", error.localizedDescription)
  }

  // User canceled the operation.
  func wasCancelled(_ viewController: GMSAutocompleteViewController) {
    dismiss(animated: true, completion: nil)
  }

  // Turn the network activity indicator on and off again.
  func didRequestAutocompletePredictions(_ viewController: GMSAutocompleteViewController) {
    UIApplication.shared.isNetworkActivityIndicatorVisible = true
  }

  func didUpdateAutocompletePredictions(_ viewController: GMSAutocompleteViewController) {
    UIApplication.shared.isNetworkActivityIndicatorVisible = false
  }

}

#import "ViewController.h"
@import GooglePlaces;

@interface ViewController () <GMSAutocompleteViewControllerDelegate>

@end

@implementation ViewController {
  GMSAutocompleteFilter *_filter;
}

- (void)viewDidLoad {
  [super viewDidLoad];
  [self makeButton];
}

  // Present the autocomplete view controller when the button is pressed.
- (void)autocompleteClicked {
  GMSAutocompleteViewController *acController = [[GMSAutocompleteViewController alloc] init];
  acController.delegate = self;

  // Specify the place data types to return.
  GMSPlaceField fields = (GMSPlaceFieldName | GMSPlaceFieldPlaceID);
  acController.placeFields = fields;

  // Specify a filter.
  _filter = [[GMSAutocompleteFilter alloc] init];
  _filter.types = @[ kGMSPlaceTypeBank ];
  acController.autocompleteFilter = _filter;

  // Display the autocomplete view controller.
  [self presentViewController:acController animated:YES completion:nil];
}

  // Add a button to the view.
- (void)makeButton{
  UIButton *btnLaunchAc = [UIButton buttonWithType:UIButtonTypeCustom];
  [btnLaunchAc addTarget:self
             action:NSSelectorFromString(@"autocompleteClicked") forControlEvents:UIControlEventTouchUpInside];
  [btnLaunchAc setTitle:@"Launch autocomplete" forState:UIControlStateNormal];
  btnLaunchAc.frame = CGRectMake(5.0, 150.0, 300.0, 35.0);
  btnLaunchAc.backgroundColor = [UIColor blueColor];
  [self.view addSubview:btnLaunchAc];
}

  // Handle the user's selection.
- (void)viewController:(GMSAutocompleteViewController *)viewController
didAutocompleteWithPlace:(GMSPlace *)place {
  [self dismissViewControllerAnimated:YES completion:nil];
  // Do something with the selected place.
  NSLog(@"Place name %@", place.name);
  NSLog(@"Place ID %@", place.placeID);
  NSLog(@"Place attributions %@", place.attributions.string);
}

- (void)viewController:(GMSAutocompleteViewController *)viewController
didFailAutocompleteWithError:(NSError *)error {
  [self dismissViewControllerAnimated:YES completion:nil];
  // TODO: handle the error.
  NSLog(@"Error: %@", [error description]);
}

  // User canceled the operation.
- (void)wasCancelled:(GMSAutocompleteViewController *)viewController {
  [self dismissViewControllerAnimated:YES completion:nil];
}

  // Turn the network activity indicator on and off again.
- (void)didRequestAutocompletePredictions:(GMSAutocompleteViewController *)viewController {
  [UIApplication sharedApplication].networkActivityIndicatorVisible = YES;
}

- (void)didUpdateAutocompletePredictions:(GMSAutocompleteViewController *)viewController {
  [UIApplication sharedApplication].networkActivityIndicatorVisible = NO;
}

@end

การเพิ่มตัวควบคุมผลลัพธ์

ใช้ตัวควบคุมผลลัพธ์เมื่อต้องการควบคุม UI การป้อนข้อความได้มากขึ้น ตัวควบคุมผลลัพธ์จะสลับการมองเห็นรายการผลลัพธ์แบบไดนามิกโดยขึ้นอยู่กับโฟกัสของ UI อินพุต

วิธีเพิ่มตัวควบคุมผลลัพธ์ลงในแอป

1. สร้าง GMSAutocompleteResultsViewController
2. ใช้โปรโตคอล GMSAutocompleteResultsViewControllerDelegate ในตัวควบคุมข้อมูลพร็อพเพอร์ตี้ระดับบนสุด และกำหนดตัวควบคุมมุมมองระดับบนสุดเป็นพร็อพเพอร์ตี้การมอบสิทธิ์
3. สร้างออบเจ็กต์ UISearchController ส่งผ่านใน GMSAutocompleteResultsViewController เป็นอาร์กิวเมนต์ตัวควบคุมผลลัพธ์
4. ตั้งค่า GMSAutocompleteResultsViewController เป็นพร็อพเพอร์ตี้ searchResultsUpdater ของ UISearchController
5. เพิ่ม searchBar สำหรับ UISearchController ลงใน UI ของแอป
6. จัดการตัวเลือกของผู้ใช้ในวิธีการมอบสิทธิ์ didAutocompleteWithPlace

วิธีวางแถบค้นหาของ UISearchController ลงใน UI ของแอปมีหลายวิธี ดังนี้

• เพิ่มแถบค้นหาลงในแถบนำทาง
• เพิ่มแถบค้นหาที่ด้านบนของมุมมอง
• เพิ่มแถบค้นหาโดยใช้ผลลัพธ์แบบป๊อปอัป

การเพิ่มแถบค้นหาลงในแถบนำทาง

ตัวอย่างโค้ดต่อไปนี้จะแสดงการเพิ่มตัวควบคุมผลลัพธ์ การเพิ่ม searchBar ลงในแถบนำทาง และการจัดการตัวเลือกของผู้ใช้

class ViewController: UIViewController {

  var resultsViewController: GMSAutocompleteResultsViewController?
  var searchController: UISearchController?
  var resultView: UITextView?

  override func viewDidLoad() {
    super.viewDidLoad()

    resultsViewController = GMSAutocompleteResultsViewController()
    resultsViewController?.delegate = self

    searchController = UISearchController(searchResultsController: resultsViewController)
    searchController?.searchResultsUpdater = resultsViewController

    // Put the search bar in the navigation bar.
    searchController?.searchBar.sizeToFit()
    navigationItem.titleView = searchController?.searchBar

    // When UISearchController presents the results view, present it in
    // this view controller, not one further up the chain.
    definesPresentationContext = true

    // Prevent the navigation bar from being hidden when searching.
    searchController?.hidesNavigationBarDuringPresentation = false
  }
}

// Handle the user's selection.
extension ViewController: GMSAutocompleteResultsViewControllerDelegate {
  func resultsController(_ resultsController: GMSAutocompleteResultsViewController,
                         didAutocompleteWith place: GMSPlace) {
    searchController?.isActive = false
    // Do something with the selected place.
    print("Place name: \(place.name)")
    print("Place address: \(place.formattedAddress)")
    print("Place attributions: \(place.attributions)")
  }

  func resultsController(_ resultsController: GMSAutocompleteResultsViewController,
                         didFailAutocompleteWithError error: Error){
    // TODO: handle the error.
    print("Error: ", error.localizedDescription)
  }

  // Turn the network activity indicator on and off again.
  func didRequestAutocompletePredictions(_ viewController: GMSAutocompleteViewController) {
    UIApplication.shared.isNetworkActivityIndicatorVisible = true
  }

  func didUpdateAutocompletePredictions(_ viewController: GMSAutocompleteViewController) {
    UIApplication.shared.isNetworkActivityIndicatorVisible = false
  }
}

- (void)viewDidLoad {
  _resultsViewController = [[GMSAutocompleteResultsViewController alloc] init];
  _resultsViewController.delegate = self;

  _searchController = [[UISearchController alloc]
                       initWithSearchResultsController:_resultsViewController];
  _searchController.searchResultsUpdater = _resultsViewController;

  // Put the search bar in the navigation bar.
  [_searchController.searchBar sizeToFit];
  self.navigationItem.titleView = _searchController.searchBar;

  // When UISearchController presents the results view, present it in
  // this view controller, not one further up the chain.
  self.definesPresentationContext = YES;

  // Prevent the navigation bar from being hidden when searching.
  _searchController.hidesNavigationBarDuringPresentation = NO;
}

// Handle the user's selection.
- (void)resultsController:(GMSAutocompleteResultsViewController *)resultsController
  didAutocompleteWithPlace:(GMSPlace *)place {
    _searchController.active = NO;
    // Do something with the selected place.
    NSLog(@"Place name %@", place.name);
    NSLog(@"Place address %@", place.formattedAddress);
    NSLog(@"Place attributions %@", place.attributions.string);
}

- (void)resultsController:(GMSAutocompleteResultsViewController *)resultsController
didFailAutocompleteWithError:(NSError *)error {
  [self dismissViewControllerAnimated:YES completion:nil];
  // TODO: handle the error.
  NSLog(@"Error: %@", [error description]);
}

// Turn the network activity indicator on and off again.
- (void)didRequestAutocompletePredictionsForResultsController:
    (GMSAutocompleteResultsViewController *)resultsController {
  [UIApplication sharedApplication].networkActivityIndicatorVisible = YES;
}

- (void)didUpdateAutocompletePredictionsForResultsController:
    (GMSAutocompleteResultsViewController *)resultsController {
  [UIApplication sharedApplication].networkActivityIndicatorVisible = NO;
}

การเพิ่มแถบค้นหาที่ด้านบนของมุมมอง

ตัวอย่างโค้ดต่อไปนี้แสดงการเพิ่ม searchBar ไว้ที่ด้านบนสุดของมุมมอง

import UIKit
import GooglePlaces

class ViewController: UIViewController {

  var resultsViewController: GMSAutocompleteResultsViewController?
  var searchController: UISearchController?
  var resultView: UITextView?

  override func viewDidLoad() {
    super.viewDidLoad()

    resultsViewController = GMSAutocompleteResultsViewController()
    resultsViewController?.delegate = self

    searchController = UISearchController(searchResultsController: resultsViewController)
    searchController?.searchResultsUpdater = resultsViewController

    let subView = UIView(frame: CGRect(x: 0, y: 65.0, width: 350.0, height: 45.0))

    subView.addSubview((searchController?.searchBar)!)
    view.addSubview(subView)
    searchController?.searchBar.sizeToFit()
    searchController?.hidesNavigationBarDuringPresentation = false

    // When UISearchController presents the results view, present it in
    // this view controller, not one further up the chain.
    definesPresentationContext = true
  }
}

// Handle the user's selection.
extension ViewController: GMSAutocompleteResultsViewControllerDelegate {
  func resultsController(_ resultsController: GMSAutocompleteResultsViewController,
                         didAutocompleteWith place: GMSPlace) {
    searchController?.isActive = false
    // Do something with the selected place.
    print("Place name: \(place.name)")
    print("Place address: \(place.formattedAddress)")
    print("Place attributions: \(place.attributions)")
  }

  func resultsController(_ resultsController: GMSAutocompleteResultsViewController,
                         didFailAutocompleteWithError error: Error){
    // TODO: handle the error.
    print("Error: ", error.localizedDescription)
  }

  // Turn the network activity indicator on and off again.
  func didRequestAutocompletePredictions(forResultsController resultsController: GMSAutocompleteResultsViewController) {
    UIApplication.shared.isNetworkActivityIndicatorVisible = true
  }

  func didUpdateAutocompletePredictions(forResultsController resultsController: GMSAutocompleteResultsViewController) {
    UIApplication.shared.isNetworkActivityIndicatorVisible = false
  }
}

- (void)viewDidLoad {
    [super viewDidLoad];

    _resultsViewController = [[GMSAutocompleteResultsViewController alloc] init];
    _resultsViewController.delegate = self;

    _searchController = [[UISearchController alloc]
                             initWithSearchResultsController:_resultsViewController];
    _searchController.searchResultsUpdater = _resultsViewController;

    UIView *subView = [[UIView alloc] initWithFrame:CGRectMake(0, 65.0, 250, 50)];

    [subView addSubview:_searchController.searchBar];
    [_searchController.searchBar sizeToFit];
    [self.view addSubview:subView];

    // When UISearchController presents the results view, present it in
    // this view controller, not one further up the chain.
    self.definesPresentationContext = YES;
}

// Handle the user's selection.
- (void)resultsController:(GMSAutocompleteResultsViewController *)resultsController
didAutocompleteWithPlace:(GMSPlace *)place {
  [self dismissViewControllerAnimated:YES completion:nil];
  // Do something with the selected place.
  NSLog(@"Place name %@", place.name);
  NSLog(@"Place address %@", place.formattedAddress);
  NSLog(@"Place attributions %@", place.attributions.string);
}

- (void)resultsController:(GMSAutocompleteResultsViewController *)resultsController
didFailAutocompleteWithError:(NSError *)error {
  [self dismissViewControllerAnimated:YES completion:nil];
  // TODO: handle the error.
  NSLog(@"Error: %@", [error description]);
}

// Turn the network activity indicator on and off again.
- (void)didRequestAutocompletePredictionsForResultsController:
    (GMSAutocompleteResultsViewController *)resultsController {
  [UIApplication sharedApplication].networkActivityIndicatorVisible = YES;
}

- (void)didUpdateAutocompletePredictionsForResultsController:
    (GMSAutocompleteResultsViewController *)resultsController {
  [UIApplication sharedApplication].networkActivityIndicatorVisible = NO;
}

โดยค่าเริ่มต้น UISearchController จะซ่อนแถบนำทางขณะนำเสนอ (ปิดใช้ได้) ในกรณีที่เห็นแถบนำทางไม่ชัดเจน UISearchController จะไม่ได้ตั้งค่าตำแหน่งอย่างถูกต้อง

โปรดใช้โค้ดต่อไปนี้ในการแก้ปัญหา

navigationController?.navigationBar.translucent = false
searchController?.hidesNavigationBarDuringPresentation = false

// This makes the view area include the nav bar even though it is opaque.
// Adjust the view placement down.
self.extendedLayoutIncludesOpaqueBars = true
self.edgesForExtendedLayout = .top

self.navigationController.navigationBar.translucent = NO;
_searchController.hidesNavigationBarDuringPresentation = NO;

// This makes the view area include the nav bar even though it is opaque.
// Adjust the view placement down.
self.extendedLayoutIncludesOpaqueBars = YES;
self.edgesForExtendedLayout = UIRectEdgeTop;

การเพิ่มแถบค้นหาโดยใช้ผลลัพธ์แบบป๊อปอัป

ตัวอย่างโค้ดต่อไปนี้จะแสดงการวางแถบค้นหาไว้ที่ด้านขวาของแถบนำทาง และแสดงผลการค้นหาในหน้าต่างป๊อบโอเวอร์

import UIKit
import GooglePlaces

class ViewController: UIViewController {

  var resultsViewController: GMSAutocompleteResultsViewController?
  var searchController: UISearchController?
  var resultView: UITextView?

  override func viewDidLoad() {
    super.viewDidLoad()

    resultsViewController = GMSAutocompleteResultsViewController()
    resultsViewController?.delegate = self

    searchController = UISearchController(searchResultsController: resultsViewController)
    searchController?.searchResultsUpdater = resultsViewController

    // Add the search bar to the right of the nav bar,
    // use a popover to display the results.
    // Set an explicit size as we don't want to use the entire nav bar.
    searchController?.searchBar.frame = (CGRect(x: 0, y: 0, width: 250.0, height: 44.0))
    navigationItem.rightBarButtonItem = UIBarButtonItem(customView: (searchController?.searchBar)!)

    // When UISearchController presents the results view, present it in
    // this view controller, not one further up the chain.
    definesPresentationContext = true

    // Keep the navigation bar visible.
    searchController?.hidesNavigationBarDuringPresentation = false
    searchController?.modalPresentationStyle = .popover
  }
}
// Handle the user's selection.
extension ViewController: GMSAutocompleteResultsViewControllerDelegate {
  func resultsController(_ resultsController: GMSAutocompleteResultsViewController,
                         didAutocompleteWith place: GMSPlace) {
    searchController?.isActive = false
    // Do something with the selected place.
    print("Place name: \(place.name)")
    print("Place address: \(place.formattedAddress)")
    print("Place attributions: \(place.attributions)")
  }

  func resultsController(_ resultsController: GMSAutocompleteResultsViewController,
                         didFailAutocompleteWithError error: Error){
    // TODO: handle the error.
    print("Error: ", error.localizedDescription)
  }

  // Turn the network activity indicator on and off again.
  func didRequestAutocompletePredictions(forResultsController resultsController: GMSAutocompleteResultsViewController) {
    UIApplication.shared.isNetworkActivityIndicatorVisible = true
  }

  func didUpdateAutocompletePredictions(forResultsController resultsController: GMSAutocompleteResultsViewController) {
    UIApplication.shared.isNetworkActivityIndicatorVisible = false
  }
}

- (void)viewDidLoad {
  [super viewDidLoad];

  _resultsViewController = [[GMSAutocompleteResultsViewController alloc] init];
  _resultsViewController.delegate = self;

  _searchController = [[UISearchController alloc]
                           initWithSearchResultsController:_resultsViewController];
  _searchController.searchResultsUpdater = _resultsViewController;

  // Add the search bar to the right of the nav bar,
  // use a popover to display the results.
  // Set an explicit size as we don't want to use the entire nav bar.
  _searchController.searchBar.frame = CGRectMake(0, 0, 250.0f, 44.0f);
  self.navigationItem.rightBarButtonItem =
  [[UIBarButtonItem alloc] initWithCustomView:_searchController.searchBar];

  // When UISearchController presents the results view, present it in
  // this view controller, not one further up the chain.
  self.definesPresentationContext = YES;

  // Keep the navigation bar visible.
  _searchController.hidesNavigationBarDuringPresentation = NO;

  _searchController.modalPresentationStyle = UIModalPresentationPopover;
}

// Handle the user's selection.
- (void)resultsController:(GMSAutocompleteResultsViewController *)resultsController
didAutocompleteWithPlace:(GMSPlace *)place {
  [self dismissViewControllerAnimated:YES completion:nil];
  NSLog(@"Place name %@", place.name);
  NSLog(@"Place address %@", place.formattedAddress);
  NSLog(@"Place attributions %@", place.attributions.string);
}

- (void)resultsController:(GMSAutocompleteResultsViewController *)resultsController
didFailAutocompleteWithError:(NSError *)error {
  [self dismissViewControllerAnimated:YES completion:nil];
  // TODO: handle the error.
  NSLog(@"Error: %@", [error description]);
}

// Turn the network activity indicator on and off again.
- (void)didRequestAutocompletePredictionsForResultsController:
    (GMSAutocompleteResultsViewController *)resultsController {
  [UIApplication sharedApplication].networkActivityIndicatorVisible = YES;
}

- (void)didUpdateAutocompletePredictionsForResultsController:
    (GMSAutocompleteResultsViewController *)resultsController {
  [UIApplication sharedApplication].networkActivityIndicatorVisible = NO;
}

การใช้แหล่งข้อมูลของตาราง

หากแอปมี UI ข้อความค้นหาที่กำหนดเอง คุณจะใช้คลาส GMSAutocompleteTableDataSource เพื่อขับเคลื่อนมุมมองตารางที่แสดงผลลัพธ์ในตัวควบคุมมุมมองได้

วิธีใช้ GMSAutocompleteTableDataSource เป็นแหล่งข้อมูลและมอบสิทธิ์ UITableView ในตัวควบคุมข้อมูลพร็อพเพอร์ตี้

1. ใช้งานโปรโตคอล GMSAutocompleteTableDataSourceDelegate และ UISearchBarDelegate ในตัวควบคุมมุมมอง
2. สร้างอินสแตนซ์ GMSAutocompleteTableDataSource และกำหนดตัวควบคุมมุมมองเป็นพร็อพเพอร์ตี้ผู้รับมอบสิทธิ์
3. ตั้งค่า GMSAutocompleteTableDataSource เป็นพร็อพเพอร์ตี้แหล่งข้อมูลและมอบสิทธิ์ของอินสแตนซ์ UITableView ในตัวควบคุมมุมมอง
4. ในตัวแฮนเดิลสำหรับการป้อนข้อความ ให้เรียกใช้ sourceTextHasChanged บน GMSAutocompleteTableDataSource
5. จัดการตัวเลือกของผู้ใช้ในเมธอดการมอบสิทธิ์ didAutocompleteWithPlace
6. ปิดตัวควบคุมในเมธอดการมอบสิทธิ์ didAutocompleteWithPlace, didFailAutocompleteWithError, wasCancelled

ตัวอย่างโค้ดต่อไปนี้สาธิตการใช้คลาส GMSAutocompleteTableDataSource เพื่อขับเคลื่อนมุมมองตารางของ UIViewController เมื่อเพิ่ม UISearchBar แยกต่างหาก

// Copyright 2020 Google LLC
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
//      http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.

import GooglePlaces
import UIKit

class PlaceAutocompleteViewController: UIViewController {

  private var tableView: UITableView!
  private var tableDataSource: GMSAutocompleteTableDataSource!

  override func viewDidLoad() {
    super.viewDidLoad()

    let searchBar = UISearchBar(frame: CGRect(x: 0, y: 20, width: self.view.frame.size.width, height: 44.0))
    searchBar.delegate = self
    view.addSubview(searchBar)

    tableDataSource = GMSAutocompleteTableDataSource()
    tableDataSource.delegate = self

    tableView = UITableView(frame: CGRect(x: 0, y: 64, width: self.view.frame.size.width, height: self.view.frame.size.height - 44))
    tableView.delegate = tableDataSource
    tableView.dataSource = tableDataSource

    view.addSubview(tableView)
  }
}

extension PlaceAutocompleteViewController: UISearchBarDelegate {
  func searchBar(_ searchBar: UISearchBar, textDidChange searchText: String) {
    // Update the GMSAutocompleteTableDataSource with the search text.
    tableDataSource.sourceTextHasChanged(searchText)
  }
}

extension PlaceAutocompleteViewController: GMSAutocompleteTableDataSourceDelegate {
  func didUpdateAutocompletePredictions(for tableDataSource: GMSAutocompleteTableDataSource) {
    // Turn the network activity indicator off.
    UIApplication.shared.isNetworkActivityIndicatorVisible = false
    // Reload table data.
    tableView.reloadData()
  }

  func didRequestAutocompletePredictions(for tableDataSource: GMSAutocompleteTableDataSource) {
    // Turn the network activity indicator on.
    UIApplication.shared.isNetworkActivityIndicatorVisible = true
    // Reload table data.
    tableView.reloadData()
  }

  func tableDataSource(_ tableDataSource: GMSAutocompleteTableDataSource, didAutocompleteWith place: GMSPlace) {
    // Do something with the selected place.
    print("Place name: \(place.name)")
    print("Place address: \(place.formattedAddress)")
    print("Place attributions: \(place.attributions)")
  }

  func tableDataSource(_ tableDataSource: GMSAutocompleteTableDataSource, didFailAutocompleteWithError error: Error) {
    // Handle the error.
    print("Error: \(error.localizedDescription)")
  }

  func tableDataSource(_ tableDataSource: GMSAutocompleteTableDataSource, didSelect prediction: GMSAutocompletePrediction) -> Bool {
    return true
  }
}

      

// Copyright 2020 Google LLC
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
//      http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.

#import "PlaceAutocompleteViewController.h"
@import GooglePlaces;
@import UIKit;

@interface PlaceAutocompleteViewController () <GMSAutocompleteTableDataSourceDelegate, UISearchBarDelegate>

@end

@implementation PlaceAutocompleteViewController {
  UITableView *tableView;
  GMSAutocompleteTableDataSource *tableDataSource;
}

- (void)viewDidLoad {
  [super viewDidLoad];

  UISearchBar *searchBar = [[UISearchBar alloc] initWithFrame:CGRectMake(0, 20, self.view.frame.size.width, 44)];
  searchBar.delegate = self;

  [self.view addSubview:searchBar];

  tableDataSource = [[GMSAutocompleteTableDataSource alloc] init];
  tableDataSource.delegate = self;

  tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 64, self.view.frame.size.width, self.view.frame.size.height - 44)];
  tableView.delegate = tableDataSource;
  tableView.dataSource = tableDataSource;

  [self.view addSubview:tableView];
}

#pragma mark - GMSAutocompleteTableDataSourceDelegate

- (void)didUpdateAutocompletePredictionsForTableDataSource:(GMSAutocompleteTableDataSource *)tableDataSource {
  // Turn the network activity indicator off.
  UIApplication.sharedApplication.networkActivityIndicatorVisible = NO;

  // Reload table data.
  [tableView reloadData];
}

- (void)didRequestAutocompletePredictionsForTableDataSource:(GMSAutocompleteTableDataSource *)tableDataSource {
  // Turn the network activity indicator on.
  UIApplication.sharedApplication.networkActivityIndicatorVisible = YES;

  // Reload table data.
  [tableView reloadData];
}

- (void)tableDataSource:(GMSAutocompleteTableDataSource *)tableDataSource didAutocompleteWithPlace:(GMSPlace *)place {
  // Do something with the selected place.
  NSLog(@"Place name: %@", place.name);
  NSLog(@"Place address: %@", place.formattedAddress);
  NSLog(@"Place attributions: %@", place.attributions);
}

- (void)tableDataSource:(GMSAutocompleteTableDataSource *)tableDataSource didFailAutocompleteWithError:(NSError *)error {
  // Handle the error
  NSLog(@"Error %@", error.description);
}

- (BOOL)tableDataSource:(GMSAutocompleteTableDataSource *)tableDataSource didSelectPrediction:(GMSAutocompletePrediction *)prediction {
  return YES;
}

#pragma mark - UISearchBarDelegate

- (void)searchBar:(UISearchBar *)searchBar textDidChange:(NSString *)searchText {
  // Update the GMSAutocompleteTableDataSource with the search text.
  [tableDataSource sourceTextHasChanged:searchText];
}

@end

      

การปรับแต่งข้อความและสีพื้นหลัง

คุณสามารถตั้งค่าสีของข้อความและพื้นหลังทั้งหมดในการควบคุม UI ของการเติมข้อความอัตโนมัติ เพื่อให้วิดเจ็ตเข้ากับลักษณะภาพของแอปมากขึ้น การตั้งค่าสีตัวควบคุม UI มี 2 วิธีดังนี้

• ใช้โปรโตคอล UIAppearance ของ iOS ที่มาพร้อมเครื่องในการควบคุม UI แบบส่วนกลางหากทำได้ การตั้งค่าเหล่านี้มีผลกับองค์ประกอบควบคุม UI จำนวนมากแต่ไม่ใช่ทั้งหมด
• ใช้วิธีการ SDK ในคลาสวิดเจ็ตเพื่อตั้งค่าพร็อพเพอร์ตี้ที่โปรโตคอล UIAppearance ไม่รองรับ

โดยปกติแล้ว แอปจะใช้โปรโตคอล UIAppearance และเมธอด SDK ร่วมกัน แผนภาพต่อไปนี้แสดงองค์ประกอบที่จัดรูปแบบได้

ตารางต่อไปนี้แสดงองค์ประกอบ UI ทั้งหมด และระบุว่าควรจัดสไตล์ของแต่ละรายการอย่างไร (โปรโตคอล UIAppearance หรือเมธอด SDK)

การใช้โปรโตคอล UIAppearance

คุณใช้โปรโตคอล UIAppearance เพื่อรับพร็อกซีลักษณะที่ปรากฏสำหรับองค์ประกอบ UI ที่กำหนดได้ ซึ่งต่อจากนั้นจะใช้ตั้งค่าสีสำหรับองค์ประกอบ UI ได้ เมื่อมีการแก้ไข อินสแตนซ์ทั้งหมดขององค์ประกอบ UI ที่กำหนดจะได้รับผลกระทบ เช่น ตัวอย่างต่อไปนี้จะเปลี่ยนสีข้อความของคลาส UITextField ให้เป็นสีเขียวเมื่อปรากฏอยู่ใน UISearchBar ทั่วโลก

[[UITextField appearanceWhenContainedIn:[UISearchBar class], nil]
    setDefaultTextAttributes:@{NSForegroundColorAttributeName:[UIColor greenColor]}];

ดูข้อมูลเพิ่มเติมเกี่ยวกับการกำหนดค่าสีได้ที่การอ้างอิง UIColor Class

ข้อมูลโค้ดต่อไปนี้แสดงคำสั่งพร็อกซีทั้งหมดที่จำเป็นต่อการจัดรูปแบบทุกอย่างในการควบคุม UI การเติมข้อความอัตโนมัติแบบเต็มหน้าจอ เพิ่มโค้ดนี้ลงในเมธอด didFinishLaunchingWithOptions ใน Appdelegate.m:

// Define some colors.
UIColor *darkGray = [UIColor darkGrayColor];
UIColor *lightGray = [UIColor lightGrayColor];

// Navigation bar background.
[[UINavigationBar appearance] setBarTintColor:darkGray];
[[UINavigationBar appearance] setTintColor:lightGray];

// Color of typed text in the search bar.
NSDictionary *searchBarTextAttributes = @{
                                          NSForegroundColorAttributeName: lightGray,
                                          NSFontAttributeName : [UIFont systemFontOfSize:[UIFont systemFontSize]]
                                          };
[UITextField appearanceWhenContainedInInstancesOfClasses:@[[UISearchBar class]]]
    .defaultTextAttributes = searchBarTextAttributes;

// Color of the placeholder text in the search bar prior to text entry.
NSDictionary *placeholderAttributes = @{
                                        NSForegroundColorAttributeName: lightGray,
                                        NSFontAttributeName : [UIFont systemFontOfSize:[UIFont systemFontSize]]
                                        };

// Color of the default search text.
// NOTE: In a production scenario, "Search" would be a localized string.
NSAttributedString *attributedPlaceholder =
[[NSAttributedString alloc] initWithString:@"Search"
                                attributes:placeholderAttributes];
[UITextField appearanceWhenContainedInInstancesOfClasses:@[[UISearchBar class]]]
    .attributedPlaceholder = attributedPlaceholder;

// Color of the in-progress spinner.
[[UIActivityIndicatorView appearance] setColor:lightGray];

// To style the two image icons in the search bar (the magnifying glass
// icon and the 'clear text' icon), replace them with different images.
[[UISearchBar appearance] setImage:[UIImage imageNamed:@"custom_clear_x_high"]
                  forSearchBarIcon:UISearchBarIconClear
                            state:UIControlStateHighlighted];
[[UISearchBar appearance] setImage:[UIImage imageNamed:@"custom_clear_x"]
                  forSearchBarIcon:UISearchBarIconClear
                            state:UIControlStateNormal];
[[UISearchBar appearance] setImage:[UIImage imageNamed:@"custom_search"]
                    forSearchBarIcon:UISearchBarIconSearch
                            state:UIControlStateNormal];

// Color of selected table cells.
UIView *selectedBackgroundView = [[UIView alloc] init];
selectedBackgroundView.backgroundColor = [UIColor lightGrayColor];
[UITableViewCell appearanceWhenContainedIn:[GMSAutocompleteViewController class], nil]
    .selectedBackgroundView = selectedBackgroundView;

การตั้งค่าคุณสมบัติของรูปแบบการควบคุม UI

องค์ประกอบการควบคุม UI บางส่วนมีพร็อพเพอร์ตี้ที่ไม่ได้รับผลกระทบจากโปรโตคอล UIAppearance คุณจึงต้องตั้งค่าโดยตรง ตัวอย่างโค้ดต่อไปนี้จะแสดงการกำหนดสีพื้นหน้าและสีพื้นหลัง และนำไปใช้กับอินสแตนซ์ควบคุมของ UI ที่มีชื่อว่า acController เพิ่มโค้ดนี้ลงในเมธอด onLaunchClicked ใน ViewController.m:

UIColor *darkGray = [UIColor darkGrayColor];
UIColor *lightGray = [UIColor lightGrayColor];

acController.secondaryTextColor = [UIColor colorWithWhite:1.0f alpha:0.5f];
acController.primaryTextColor = lightGray;
acController.primaryTextHighlightColor = [UIColor grayColor];
acController.tableCellBackgroundColor = darkGray;
acController.tableCellSeparatorColor = lightGray;
acController.tintColor = lightGray;

การรับการคาดคะเนสถานที่โดยใช้โปรแกรม

คุณสามารถสร้าง UI การค้นหาที่กำหนดเองเพื่อเป็นทางเลือกสำหรับ UI ที่วิดเจ็ตเติมข้อความอัตโนมัติมีให้ ในการดำเนินการดังกล่าว แอปของคุณต้องได้รับการคาดคะเนสถานที่โดยใช้โปรแกรม แอปของคุณสามารถรับรายการชื่อและ/หรือที่อยู่ของสถานที่และ/หรือที่อยู่ที่คาดการณ์ไว้ด้วยวิธีใดวิธีหนึ่งต่อไปนี้

• โทร GMSPlacesClient findAutocompletePredictionsFromQuery:
• ใช้การดึงข้อมูล

กำลังโทรหา GMSPlacesClient findAutocompletePredictionsFromQuery:

หากต้องการดูรายชื่อสถานที่และ/หรือที่อยู่ที่คาดการณ์ไว้ ให้GMSPlacesClient ก่อน แล้วเรียกใช้เมธอด GMSPlacesClient findAutocompletePredictionsFromQuery: ด้วยพารามิเตอร์ต่อไปนี้

• สตริง autocompleteQuery ที่มีข้อความที่ผู้ใช้พิมพ์
• GMSAutocompleteSessionToken ซึ่งใช้ระบุแต่ละเซสชัน แอปควรส่งโทเค็นเดียวกันสำหรับการเรียกคำขอเพื่อเติมข้อความอัตโนมัติแต่ละครั้ง จากนั้นส่งโทเค็นนั้น พร้อมรหัสสถานที่ในการเรียก fetchPlacefromPlaceID: ในครั้งต่อๆ ไปเพื่อดึงรายละเอียดสถานที่ของสถานที่ที่ผู้ใช้เลือก
• A GMSAutocompleteFilter ถึง:
  • การให้น้ำหนักพิเศษหรือจำกัดผลลัพธ์ไปยังพื้นที่ที่เฉพาะเจาะจง
  • จำกัดผลการค้นหาตามประเภทสถานที่ที่เฉพาะเจาะจง
  • ออบเจ็กต์ GMSPlaceLocationBias/Restriction ที่ให้น้ำหนักผลลัพธ์เป็นพื้นที่ที่เจาะจงตามขอบเขตละติจูดและลองจิจูด
• วิธีการเรียกกลับสำหรับจัดการการคาดการณ์ที่แสดงผล

ตัวอย่างโค้ดด้านล่างแสดงการเรียกไปยัง findAutocompletePredictionsFromQuery:

/**
 * Create a new session token. Be sure to use the same token for calling
 * findAutocompletePredictions, as well as the subsequent place details request.
 * This ensures that the user's query and selection are billed as a single session.
 */
let token = GMSAutocompleteSessionToken.init()

// Create a type filter.
let filter = GMSAutocompleteFilter()
filter.types = [.bank] 
filter.locationBias = GMSPlaceRectangularLocationOption( northEastBounds,
                                   southWestBounds);

placesClient?.findAutocompletePredictions(fromQuery: "cheesebu",

                                          filter: filter,
                                          sessionToken: token,
                                          callback: { (results, error) in
    if let error = error {
      print("Autocomplete error: \(error)")
      return
    }
    if let results = results {
      for result in results {
        print("Result \(result.attributedFullText) with placeID \(result.placeID)")
      }
    }
})

/**
 * Create a new session token. Be sure to use the same token for calling
 * findAutocompletePredictionsFromQuery:, as well as the subsequent place details request.
 * This ensures that the user's query and selection are billed as a single session.
 */
GMSAutocompleteSessionToken *token = [[GMSAutocompleteSessionToken alloc] init];

// Create a type filter.
GMSAutocompleteFilter *_filter = [[GMSAutocompleteFilter alloc] init];
_filter.types = @[ kGMSPlaceTypeBank ];

[_placesClient findAutocompletePredictionsFromQuery:@"cheesebu"
filter:_filter sessionToken:token callback:^(NSArray<GMSAutocompletePrediction *> * _Nullable results, NSError * _Nullable error) {
  if (error != nil) {
    NSLog(@"An error occurred %@", [error localizedDescription]);
    return;
  }
  if (results != nil) {
    for (GMSAutocompletePrediction *result in results) {
      NSLog(@"Result %@ with PlaceID %@", result.attributedFullText, result.placeID);
    }
  }
}];

API จะเรียกใช้เมธอดโค้ดเรียกกลับที่ระบุ โดยส่งผ่านในอาร์เรย์ของออบเจ็กต์ GMSAutocompletePrediction

ออบเจ็กต์ GMSAutocompletePrediction แต่ละรายการจะมีข้อมูลต่อไปนี้

• attributedFullText – ข้อความทั้งหมดของการคาดการณ์ในรูปแบบของ NSAttributedString เช่น "Sydney Opera House, Sydney, New South Wales, Australia" ทุกช่วงข้อความที่ตรงกับอินพุตของผู้ใช้จะมีแอตทริบิวต์ kGMSAutocompleteMatchAttribute คุณสามารถใช้แอตทริบิวต์นี้เพื่อไฮไลต์ข้อความที่ตรงกันในข้อความค้นหาของผู้ใช้ ตามที่แสดงไว้ด้านล่าง
• placeID – รหัสสถานที่ของสถานที่ที่คาดคะเน รหัสสถานที่คือตัวระบุข้อความที่ใช้ระบุสถานที่อย่างไม่ซ้ำกัน ดูข้อมูลเพิ่มเติมเกี่ยวกับรหัสสถานที่ได้ที่ภาพรวมรหัสสถานที่
• distanceMeters – ระยะทางแบบเส้นตรงจาก origin ที่ระบุไปยังปลายทาง หากไม่ได้ตั้งค่าพร็อพเพอร์ตี้ origin ไว้ จะไม่มีการคืนค่าระยะทาง

ตัวอย่างโค้ดต่อไปนี้จะแสดงวิธีไฮไลต์เป็นตัวหนาตรงส่วนของผลการค้นหาที่ตรงกับข้อความในข้อความค้นหาของผู้ใช้ โดยใช้ enumerateAttribute

let regularFont = UIFont.systemFont(ofSize: UIFont.labelFontSize)
let boldFont = UIFont.boldSystemFont(ofSize: UIFont.labelFontSize)

let bolded = prediction.attributedFullText.mutableCopy() as! NSMutableAttributedString
bolded.enumerateAttribute(kGMSAutocompleteMatchAttribute, in: NSMakeRange(0, bolded.length), options: []) {
  (value, range: NSRange, stop: UnsafeMutablePointer<ObjCBool>) -> Void in
    let font = (value == nil) ? regularFont : boldFont
    bolded.addAttribute(NSFontAttributeName, value: font, range: range)
}

label.attributedText = bolded
    

UIFont *regularFont = [UIFont systemFontOfSize:[UIFont labelFontSize]];
UIFont *boldFont = [UIFont boldSystemFontOfSize:[UIFont labelFontSize]];

NSMutableAttributedString *bolded = [prediction.attributedFullText mutableCopy];
[bolded enumerateAttribute:kGMSAutocompleteMatchAttribute
                   inRange:NSMakeRange(0, bolded.length)
                   options:0
                usingBlock:^(id value, NSRange range, BOOL *stop) {
                  UIFont *font = (value == nil) ? regularFont : boldFont;
                  [bolded addAttribute:NSFontAttributeName value:font range:range];
                }];

label.attributedText = bolded;
    

การใช้การดึงข้อมูล

หากต้องการสร้างตัวควบคุมการเติมข้อความอัตโนมัติเองตั้งแต่ต้น คุณสามารถใช้ GMSAutocompleteFetcher ซึ่งจะรวมเมธอด autocompleteQuery ใน GMSPlacesClient เข้าด้วยกัน ตัวดึงข้อมูลจะควบคุมคำขอ โดยแสดงเฉพาะผลการค้นหาสำหรับข้อความค้นหาที่ป้อนล่าสุดเท่านั้น โดยไม่มีองค์ประกอบ UI

หากต้องการใช้ GMSAutocompleteFetcher ให้ทำตามขั้นตอนต่อไปนี้

1. ใช้โปรโตคอล GMSAutocompleteFetcherDelegate
2. สร้างออบเจ็กต์ GMSAutocompleteFetcher
3. เรียก sourceTextHasChanged ในการดึงข้อมูลเมื่อผู้ใช้พิมพ์
4. จัดการการคาดการณ์และข้อผิดพลาดโดยใช้เมธอดโปรโตคอล didAutcompleteWithPredictions และ didFailAutocompleteWithError

ตัวอย่างโค้ดต่อไปนี้จะสาธิตการใช้ตัวดึงข้อมูลเพื่อดึงข้อมูลจากผู้ใช้ และแสดงตำแหน่งที่ตรงกันในมุมมองข้อความ ไม่มีฟังก์ชันสำหรับการเลือกสถานที่ FetcherSampleViewController มาจาก UIViewController ใน FetcherSampleViewController.h

import UIKit
import GooglePlaces

class ViewController: UIViewController {

  var textField: UITextField?
  var resultText: UITextView?
  var fetcher: GMSAutocompleteFetcher?

  override func viewDidLoad() {
    super.viewDidLoad()

    view.backgroundColor = .white
    edgesForExtendedLayout = []

    // Set bounds to inner-west Sydney Australia.
    let neBoundsCorner = CLLocationCoordinate2D(latitude: -33.843366,
                                                longitude: 151.134002)
    let swBoundsCorner = CLLocationCoordinate2D(latitude: -33.875725,
                                                longitude: 151.200349)

    // Set up the autocomplete filter.
    let filter = GMSAutocompleteFilter()
    filter.locationRestriction = GMSPlaceRectangularLocationOption(neBoundsCorner, swBoundsCorner)

    // Create a new session token.
    let token: GMSAutocompleteSessionToken = GMSAutocompleteSessionToken.init()

    // Create the fetcher.
    fetcher = GMSAutocompleteFetcher(bounds: nil, filter: filter)
    fetcher?.delegate = self
    fetcher?.provide(token)

    textField = UITextField(frame: CGRect(x: 5.0, y: 10.0,
                                          width: view.bounds.size.width - 5.0,
                                          height: 64.0))
    textField?.autoresizingMask = .flexibleWidth
    textField?.addTarget(self, action: #selector(textFieldDidChange(textField:)),
                         for: .editingChanged)
    let placeholder = NSAttributedString(string: "Type a query...")

    textField?.attributedPlaceholder = placeholder

    resultText = UITextView(frame: CGRect(x: 0, y: 65.0,
                                          width: view.bounds.size.width,
                                          height: view.bounds.size.height - 65.0))
    resultText?.backgroundColor = UIColor(white: 0.95, alpha: 1.0)
    resultText?.text = "No Results"
    resultText?.isEditable = false

    self.view.addSubview(textField!)
    self.view.addSubview(resultText!)
  }

  @objc func textFieldDidChange(textField: UITextField) {
    fetcher?.sourceTextHasChanged(textField.text!)
  }

}

extension ViewController: GMSAutocompleteFetcherDelegate {
  func didAutocomplete(with predictions: [GMSAutocompletePrediction]) {
    let resultsStr = NSMutableString()
    for prediction in predictions {
      resultsStr.appendFormat("\n Primary text: %@\n", prediction.attributedPrimaryText)
      resultsStr.appendFormat("Place ID: %@\n", prediction.placeID)
    }

    resultText?.text = resultsStr as String
  }

  func didFailAutocompleteWithError(_ error: Error) {
    resultText?.text = error.localizedDescription
  }
}

#import "FetcherSampleViewController.h"
#import <GooglePlaces/GooglePlaces.h>
#import <GoogleMapsBase/GoogleMapsBase.h>

@interface FetcherSampleViewController () <GMSAutocompleteFetcherDelegate>

@end

@implementation FetcherSampleViewController {
  UITextField *_textField;
  UITextView *_resultText;
  GMSAutocompleteFetcher* _fetcher;
}

- (void)viewDidLoad {
  [super viewDidLoad];

  self.view.backgroundColor = [UIColor whiteColor];
  self.edgesForExtendedLayout = UIRectEdgeNone;

  // Set bounds to inner-west Sydney Australia.
  CLLocationCoordinate2D neBoundsCorner = CLLocationCoordinate2DMake(-33.843366, 151.134002);
  CLLocationCoordinate2D swBoundsCorner = CLLocationCoordinate2DMake(-33.875725, 151.200349);

  GMSAutocompleteFilter *autocompleteFilter = [[GMSAutocompleteFilter alloc] init];
  autocompleteFilter.locationRestriction =
        GMSPlaceRectangularLocationOption(neBoundsCorner, swBoundsCorner);

  // Create the fetcher.
  _fetcher = [[GMSAutocompleteFetcher alloc] initWithBounds:nil
                                                     filter:filter];
  _fetcher.delegate = self;

  // Set up the UITextField and UITextView.
  _textField = [[UITextField alloc] initWithFrame:CGRectMake(5.0f,
                                                             0,
                                                             self.view.bounds.size.width - 5.0f,
                                                             44.0f)];
  _textField.autoresizingMask = UIViewAutoresizingFlexibleWidth;
  [_textField addTarget:self
                 action:@selector(textFieldDidChange:)
       forControlEvents:UIControlEventEditingChanged];
  _resultText =[[UITextView alloc] initWithFrame:CGRectMake(0,
                                                            45.0f,
                                                            self.view.bounds.size.width,
                                                            self.view.bounds.size.height - 45.0f)];
  _resultText.backgroundColor = [UIColor colorWithWhite:0.95f alpha:1.0f];
  _resultText.text = @"No Results";
  _resultText.editable = NO;
  [self.view addSubview:_textField];
  [self.view addSubview:_resultText];
}

- (void)textFieldDidChange:(UITextField *)textField {
  NSLog(@"%@", textField.text);
  [_fetcher sourceTextHasChanged:textField.text];
}

#pragma mark - GMSAutocompleteFetcherDelegate
- (void)didAutocompleteWithPredictions:(NSArray *)predictions {
  NSMutableString *resultsStr = [NSMutableString string];
  for (GMSAutocompletePrediction *prediction in predictions) {
      [resultsStr appendFormat:@"%@\n", [prediction.attributedPrimaryText string]];
  }
  _resultText.text = resultsStr;
}

- (void)didFailAutocompleteWithError:(NSError *)error {
  _resultText.text = [NSString stringWithFormat:@"%@", error.localizedDescription];
}

@end

โทเค็นของเซสชัน

โทเค็นเซสชันจะจัดกลุ่มช่วงการค้นหาและช่วงที่เลือกของการค้นหาแบบเติมข้อความอัตโนมัติของผู้ใช้เป็นเซสชันที่แยกจากกันเพื่อใช้ในการเรียกเก็บเงิน เซสชันจะเริ่มต้นเมื่อผู้ใช้เริ่มพิมพ์ข้อความค้นหา และสรุปเมื่อผู้ใช้เลือกสถานที่ แต่ละเซสชันสามารถมีข้อความค้นหาได้หลายรายการ ตามด้วยการเลือกสถานที่ 1 แห่ง เมื่อเซสชันสิ้นสุดลง โทเค็นจะใช้งานไม่ได้อีกต่อไป แอปของคุณต้องสร้างโทเค็นใหม่สำหรับแต่ละเซสชัน เราขอแนะนำให้ใช้โทเค็นเซสชันสำหรับเซสชันการเติมข้อความอัตโนมัติแบบเป็นโปรแกรมทั้งหมด (เมื่อคุณใช้ตัวควบคุมแบบเต็มหน้าจอหรือตัวควบคุมผลลัพธ์ API จะดูแลการทำงานนี้โดยอัตโนมัติ)

Places SDK สำหรับ iOS ใช้ GMSAutocompleteSessionToken เพื่อระบุแต่ละเซสชัน แอปควรส่งโทเค็นเซสชันใหม่เมื่อเริ่มต้นเซสชันใหม่แต่ละเซสชัน จากนั้นส่งโทเค็นเดียวกันนี้พร้อมกับรหัสสถานที่ในการเรียกมาให้ fetchPlacefromPlaceID: ในครั้งต่อๆ ไปเพื่อดึงรายละเอียดสถานที่ของสถานที่ที่ผู้ใช้เลือก

ดูข้อมูลเพิ่มเติมเกี่ยวกับโทเค็นของเซสชัน

ใช้โค้ดต่อไปนี้เพื่อสร้างโทเค็นเซสชันใหม่

let token: GMSAutocompleteSessionToken = GMSAutocompleteSessionToken.init()

ขีดจำกัดการใช้งาน

• การใช้เมธอด GMSPlacesClient findAutocompletePredictionsFromQuery ขึ้นอยู่กับขีดจำกัดการค้นหาที่แบ่งเป็นระดับ โปรดดูเอกสารเกี่ยวกับขีดจำกัดการใช้งาน

การแสดงการระบุแหล่งที่มาในแอปของคุณ

• หากแอปใช้บริการเติมข้อความอัตโนมัติแบบเป็นโปรแกรม UI ต้องแสดงการระบุที่มา "ขับเคลื่อนโดย Google" หรือปรากฏในแผนที่แบรนด์ Google
• หากแอปใช้การควบคุม UI การเติมข้อความอัตโนมัติก็ไม่ต้องดำเนินการใดๆ เพิ่มเติม (การระบุแหล่งที่มาที่จำเป็นจะแสดงโดยค่าเริ่มต้น)
• หากคุณดึงและแสดงข้อมูลสถานที่เพิ่มเติมหลังจากได้รับสถานที่โดยใช้รหัส คุณต้องแสดงแหล่งที่มาของบุคคลที่สามด้วย

ดูรายละเอียดเพิ่มเติมในเอกสารเกี่ยวกับการระบุแหล่งที่มา

การควบคุมสัญญาณบอกสถานะกิจกรรมเครือข่าย

หากต้องการควบคุมสัญญาณบอกสถานะกิจกรรมเครือข่ายในแถบสถานะของแอปพลิเคชัน คุณต้องใช้วิธีการมอบอำนาจแบบไม่บังคับที่เหมาะสมสำหรับคลาสการเติมข้อความอัตโนมัติที่คุณใช้ และเปิดและปิดสัญญาณบอกสถานะเครือข่ายด้วยตนเอง

• สำหรับ GMSAutocompleteViewController คุณต้องใช้วิธีการมอบสิทธิ์ didRequestAutocompletePredictions: และ didUpdateAutocompletePredictions:
• สำหรับ GMSAutocompleteResultsViewController คุณต้องใช้วิธีการมอบสิทธิ์ didRequestAutocompletePredictionsForResultsController: และ didUpdateAutocompletePredictionsForResultsController:
• สำหรับ GMSAutocompleteTableDataSource คุณต้องใช้วิธีการมอบสิทธิ์ didRequestAutocompletePredictionsForTableDataSource: และ didUpdateAutocompletePredictionsForTableDataSource:

เมื่อใช้เมธอดเหล่านี้และตั้งค่า [UIApplication sharedApplication].networkActivityIndicatorVisible เป็น YES และ NO แถบสถานะจะตรงกับ UI เติมข้อความอัตโนมัติอย่างถูกต้อง

จำกัดผลลัพธ์ของการเติมข้อความอัตโนมัติ

คุณสามารถตั้งค่าการควบคุม UI แบบเติมข้อความอัตโนมัติเพื่อจำกัดผลการค้นหาเป็นภูมิภาคทางภูมิศาสตร์ที่เจาะจง และ/หรือกรองผลลัพธ์เป็นประเภทสถานที่อย่างน้อย 1 ประเภท หรือกำหนดประเทศใดประเทศหนึ่ง โดยวิธีจำกัดผลการค้นหามีดังนี้

• หากต้องการอ้างอิงผลลัพธ์ (แบบอคติ) ภายในภูมิภาคที่กำหนด ให้ตั้งค่า locationBias ใน GMSAutocompleteFilter (ระบบอาจยังแสดงผลลัพธ์บางอย่างจากภายนอกภูมิภาคที่กำหนด) หากตั้งค่า locationRestriction ไว้ด้วย ระบบจะไม่สนใจ locationBias

• หากต้องการแสดงเฉพาะ (จำกัด) ผลการค้นหาภายในภูมิภาคที่กำหนด ให้ตั้งค่า locationRestriction ใน GMSAutocompleteFilter (ระบบจะแสดงผลเฉพาะผลลัพธ์ภายในเขตที่ระบุ)

  • หมายเหตุ: ข้อจำกัดนี้มีผลกับทั้งเส้นทางเท่านั้น และอาจส่งคืนผลลัพธ์สังเคราะห์ที่อยู่นอกขอบเขตสี่เหลี่ยมตามเส้นทางที่ซ้อนทับกับข้อจำกัดด้านสถานที่

• หากต้องการแสดงเฉพาะผลลัพธ์ที่สอดคล้องกับประเภทสถานที่หนึ่งๆ ให้ตั้งค่า types ใน GMSAutocompleteFilter (ตัวอย่างเช่น การระบุ TypeFilter.ADDRESS จะทำให้วิดเจ็ตแสดงเฉพาะผลลัพธ์ที่มีที่อยู่ที่แน่นอน)

• หากต้องการแสดงเฉพาะผลการค้นหาภายใน 5 ประเทศที่ระบุ ให้ตั้งค่า countries ใน GMSAutocompleteFilter

การให้น้ำหนักพิเศษกับพื้นที่ที่เฉพาะเจาะจง

หากต้องการแนะนำผลลัพธ์ (แบบอคติ) ภายในภูมิภาคที่กำหนด ให้ตั้งค่า locationBias ใน GMSAutocompleteFilter ดังที่แสดงด้านล่างนี้

  northEast = CLLocationCoordinate2DMake(39.0, -95.0);
  southWest = CLLocationCoordinate2DMake(37.5, -100.0);
  GMSAutocompleteFilter *filter = [[GMSAutocompleteFilter alloc] init];
  filter.locationBias = GMSPlaceRectangularLocationOption(northEast, southWest);

จำกัดผลการค้นหาในบางภูมิภาค

หากต้องการแสดงเฉพาะ (จำกัด) ผลการค้นหาภายในภูมิภาคที่กำหนด ให้ตั้งค่า locationRestriction ใน GMSAutocompleteFilter ตามที่แสดงไว้ที่นี่

  northEast = CLLocationCoordinate2DMake(39.0, -95.0);
  southWest = CLLocationCoordinate2DMake(37.5, -100.0);
  GMSAutocompleteFilter *filter = [[GMSAutocompleteFilter alloc] init];
  filter.locationRestriction = GMSPlaceRectangularLocationOption(northEast, southWest);

กรองผลการค้นหาตามประเทศ

หากต้องการกรองผลลัพธ์ภายในประเทศที่ระบุไม่เกิน 5 ประเทศ ให้ตั้งค่า countries ใน GMSAutocompleteFilter ตามที่แสดงไว้ที่นี่

  GMSAutocompleteFilter *filter = [[GMSAutocompleteFilter alloc] init];
  filter.countries = @[ @"au", @"nz" ];

กรองผลการค้นหาตามประเภทสถานที่หรือการรวบรวมประเภท

จำกัดผลลัพธ์ให้เป็นคอลเล็กชันประเภทหรือประเภทที่เจาะจงโดยตั้งค่าพร็อพเพอร์ตี้ types ของ GMSAutoCompleteFilter ใช้พร็อพเพอร์ตี้นี้เพื่อระบุตัวกรองที่แสดงอยู่ในตาราง 1, 2 และ 3 ในประเภทสถานที่ หากไม่ระบุ ระบบจะแสดงผลทุกประเภท

วิธีระบุประเภทหรือประเภทตัวกรองคอลเล็กชัน

• ใช้พร็อพเพอร์ตี้ types เพื่อระบุค่าประเภทได้สูงสุด 5 ค่าจากตาราง 1 และตาราง 2 ที่แสดงในประเภทสถานที่ ค่าประเภทจะกำหนดโดยค่าคงที่ใน GMSPlaceType

• ใช้พร็อพเพอร์ตี้ types เพื่อระบุคอลเล็กชันประเภทจากตาราง 3 ที่แสดงในประเภทสถานที่ ค่าคอลเล็กชันประเภทจะกำหนดโดยค่าคงที่ใน GMSPlaceType

  คำขอนี้มีประเภทจากตาราง 3 ได้เพียงประเภทเดียว หากคุณระบุค่าจากตาราง 3 คุณจะไม่สามารถระบุค่าจากตาราง 1 หรือตาราง 2 ได้ หากคุณทำแล้วเกิดข้อผิดพลาด

ตัวอย่างเช่น หากต้องการแสดงเฉพาะผลลัพธ์ที่สอดคล้องกับประเภทสถานที่หนึ่งๆ ให้ตั้งค่า types ใน GMSAutocompleteFilter ตัวอย่างต่อไปนี้แสดงการตั้งค่าตัวกรองให้แสดงเฉพาะผลลัพธ์ที่มีที่อยู่ที่ถูกต้อง

  GMSAutocompleteFilter *filter = [[GMSAutocompleteFilter alloc] init];
  filter.types = @[ kGMSPlaceTypeAirport, kGMSPlaceTypeAmusementPark ];

การเพิ่มประสิทธิภาพการเติมข้อความอัตโนมัติ

ส่วนนี้จะอธิบายแนวทางปฏิบัติที่ดีที่สุดเพื่อช่วยให้คุณได้รับประโยชน์สูงสุดจากบริการเติมข้อความอัตโนมัติเกี่ยวกับสถานที่

หลักเกณฑ์ทั่วไปมีดังนี้

• วิธีที่รวดเร็วที่สุดในการพัฒนาอินเทอร์เฟซผู้ใช้ที่ใช้งานได้คือการใช้ Maps JavaScript API วิดเจ็ตเติมข้อความอัตโนมัติ Places SDK สำหรับวิดเจ็ตเติมข้อความอัตโนมัติของ Android หรือ Places SDK สำหรับ iOS การควบคุม UI อัตโนมัติ
• พัฒนาความเข้าใจเกี่ยวกับช่องข้อมูลที่สำคัญในการเติมข้อความอัตโนมัติตั้งแต่เริ่มต้น
• ช่องการให้น้ำหนักตำแหน่งและการจำกัดตำแหน่งเป็นตัวเลือกที่ไม่บังคับ แต่อาจมีผลกระทบอย่างมากต่อประสิทธิภาพของการเติมข้อความอัตโนมัติ
• ใช้การจัดการข้อผิดพลาดเพื่อให้แน่ใจว่าแอปลดระดับอย่างมีชั้นเชิงหาก API แสดงข้อผิดพลาด
• ตรวจสอบว่าแอปรองรับเมื่อไม่ได้เลือกและเสนอวิธีต่อ ให้ผู้ใช้ต่อไป

แนวทางปฏิบัติแนะนำในการเพิ่มประสิทธิภาพต้นทุน

การเพิ่มประสิทธิภาพต้นทุนพื้นฐาน

หากต้องการเพิ่มประสิทธิภาพค่าใช้จ่ายในการใช้บริการเติมข้อความอัตโนมัติ ให้ใช้มาสก์ฟิลด์ในรายละเอียดสถานที่และวิดเจ็ตเติมข้อความอัตโนมัติเพื่อแสดงเพียงช่องข้อมูลสถานที่ที่คุณต้องการ

การเพิ่มประสิทธิภาพต้นทุนขั้นสูง

ลองติดตั้งใช้งาน Place Autocomplete แบบเป็นโปรแกรมเพื่อเข้าถึงราคาตามคําขอ และขอผลลัพธ์ Geocoding API เกี่ยวกับสถานที่ที่เลือกแทนรายละเอียดสถานที่ การกำหนดราคาตามคำขอที่จับคู่กับ Geocoding API จะคุ้มค่ามากกว่าการกำหนดราคาต่อเซสชัน (ตามเซสชัน) หากตรงกับเงื่อนไขทั้งสองข้อต่อไปนี้

• หากคุณต้องการเพียงละติจูด/ลองจิจูดหรือที่อยู่ของสถานที่ที่ผู้ใช้เลือกเท่านั้น Geocoding API จะส่งข้อมูลนี้น้อยกว่าการเรียกรายละเอียดสถานที่
• หากผู้ใช้เลือกการคาดการณ์การเติมข้อความอัตโนมัติภายในคำขอการคาดการณ์การเติมข้อความอัตโนมัติโดยเฉลี่ยไม่เกิน 4 รายการ การกำหนดราคาต่อคำขออาจคุ้มค่ากว่าการกำหนดราคาแบบต่อเซสชัน

แอปพลิเคชันของคุณต้องใช้ข้อมูลใดๆ นอกเหนือจากที่อยู่และละติจูด/ลองจิจูดของการคาดคะเนที่เลือกไหม

แนวทางปฏิบัติแนะนำด้านประสิทธิภาพ

หลักเกณฑ์ต่อไปนี้อธิบายวิธีเพิ่มประสิทธิภาพในการเติมข้อความอัตโนมัติเกี่ยวกับสถานที่

• เพิ่มข้อจำกัดประเทศ การให้น้ำหนักสถานที่ตั้ง และค่ากำหนดภาษา (สำหรับการใช้งานแบบเป็นโปรแกรม) ลงในการติดตั้งใช้งานการเติมข้อความอัตโนมัติใน Place คุณไม่จำเป็นต้องใช้ค่ากำหนดภาษาเมื่อใช้วิดเจ็ต เนื่องจากวิดเจ็ตจะเลือกค่ากำหนดภาษาจากเบราว์เซอร์หรืออุปกรณ์เคลื่อนที่ของผู้ใช้
• หากการเติมข้อความอัตโนมัติมาพร้อมกับแผนที่ คุณสามารถให้น้ำหนักกับตำแหน่งตามวิวพอร์ตแผนที่ได้
• ในสถานการณ์ที่ผู้ใช้ไม่ได้เลือกการคาดคะเนจากการเติมข้อความอัตโนมัติโดยทั่วไป เนื่องจากไม่มีการคาดคะเนใดเป็นที่อยู่สำหรับผลลัพธ์ที่ต้องการเลย คุณสามารถใช้ข้อมูลเดิมของผู้ใช้ซ้ำเพื่อให้ได้ผลการค้นหาที่เกี่ยวข้องมากขึ้นได้ ดังนี้
  • หากคุณคาดหวังให้ผู้ใช้ป้อนเฉพาะข้อมูลที่อยู่ ให้ใช้ข้อมูลเดิมของผู้ใช้ซ้ำในการเรียกใช้ Geocoding API
  • หากคุณคาดหวังให้ผู้ใช้ป้อนคำค้นหาสถานที่เฉพาะเจาะจงตามชื่อหรือที่อยู่ ให้ใช้คำขอค้นหาสถานที่ หากต้องการผลลัพธ์ในบางภูมิภาคเท่านั้น ให้ใช้การให้น้ำหนักตำแหน่ง
  สถานการณ์อื่นๆ ที่ควรกลับไปใช้ Geocoding API มีดังนี้
  • ผู้ใช้ที่ป้อนที่อยู่ของสถานที่ย่อยในประเทศที่การรองรับการเติมข้อมูลสถานที่อัตโนมัติของที่อยู่ภายในสถานที่ตั้งไม่สมบูรณ์ เช่น เช็กเกีย เอสโตเนีย และลิทัวเนีย เช่น ที่อยู่ภาษาเช็ก "Stroupežnického 3191/17, Praha" ให้การคาดคะเนบางส่วนในการเติมข้อความอัตโนมัติ
  • ผู้ใช้ป้อนที่อยู่ที่มีคำนำหน้าส่วนต่างๆ ของถนน เช่น "23-30 29th St, Queens" ในนิวยอร์กซิตี หรือ "47-380 Kamehameha Hwy, Kaneohe" บนเกาะคาไวในฮาวาย

การแก้ปัญหา

แม้ว่าจะเกิดข้อผิดพลาดที่หลากหลายขึ้น แต่ข้อผิดพลาดส่วนใหญ่ที่แอปมีโอกาสพบมักเกิดจากข้อผิดพลาดในการกำหนดค่า (เช่น มีการใช้คีย์ API ไม่ถูกต้อง หรือกำหนดค่าคีย์ API ไม่ถูกต้อง) หรือข้อผิดพลาดเกี่ยวกับโควต้า (แอปเกินโควต้า) โปรดดู ขีดจำกัดการใช้งาน สำหรับข้อมูลเพิ่มเติมเกี่ยวกับโควต้า

ข้อผิดพลาดที่เกิดขึ้นในการใช้การควบคุมการเติมข้อความอัตโนมัติจะแสดงในเมธอด didFailAutocompleteWithError() ของโปรโตคอลการมอบสิทธิ์ต่างๆ พร็อพเพอร์ตี้ code ของออบเจ็กต์ NSError ที่ระบุได้รับการตั้งค่าเป็นค่าใดค่าหนึ่งของการแจกแจง GMSPlacesErrorCode