How to customise GMSAutocompleteViewController for iOS?

Question

I am using Google autocomplete placekicker in ios. It shows me controller with native design. I want to customise it's navigation bar colour.But I am not able to do it. Below is the code

        let autocompleteController = GMSAutocompleteViewController()
        autocompleteController.tintColor = UIColor.red
        autocompleteController.navigationController?.navigationBar.barTintColor = Constant.AppColor.navigationColor
        autocompleteController.delegate = self
        self.present(autocompleteController, animated: true, completion: nil)

Sabrina · Answer 1 · 2019-12-22T23:29:59.087

I have written this code for adapting light/dark mode:

Swift

let controller:GMSAutocompleteViewController! = GMSAutocompleteViewController()
if #available(iOS 13.0, *) {
   if UIScreen.mainScreen.traitCollection.userInterfaceStyle == UIUserInterfaceStyleDark  {
      controller.primaryTextColor = UIColor.whiteColor
      controller.secondaryTextColor = UIColor.lightGrayColor
      controller.tableCellSeparatorColor = UIColor.lightGrayColor
      controller.tableCellBackgroundColor = UIColor.darkGrayColor
   } else {
      controller.primaryTextColor = UIColor.blackColor
      controller.secondaryTextColor = UIColor.lightGrayColor
      controller.tableCellSeparatorColor = UIColor.lightGrayColor
      controller.tableCellBackgroundColor = UIColor.whiteColor
   }
}

Objective-C

GMSAutocompleteViewController *controller = [[GMSAutocompleteViewController alloc] init];
if (@available(iOS 13.0, *)) {
   if(UIScreen.mainScreen.traitCollection.userInterfaceStyle == UIUserInterfaceStyleDark ){
      controller.primaryTextColor = UIColor.whiteColor;
      controller.secondaryTextColor = UIColor.lightGrayColor;
      controller.tableCellSeparatorColor = UIColor.lightGrayColor;
      controller.tableCellBackgroundColor = UIColor.darkGrayColor;
   } else {
      controller.primaryTextColor = UIColor.blackColor;
      controller.secondaryTextColor = UIColor.lightGrayColor;
      controller.tableCellSeparatorColor = UIColor.lightGrayColor;
      controller.tableCellBackgroundColor = UIColor.whiteColor;
   }
}

Result:

score 4 · Answer 2 · answered Jan 03 '18 at 07:47

4

Google Place Autocomplete document can help you.

According to document, use UIAppearanceProtocol to customise visual theme.

Look at section "Customize text and background colors" in this document.

answered Jan 03 '18 at 07:47

Krunal

77,632
48
245
261

score 3 · Answer 3 · answered Mar 01 '18 at 11:38

I was able to customise some elements in Swift like so :

     // Sets the background of results - top line
    autocompleteController.primaryTextColor = UIColor.black

    // Sets the background of results - second line
    autocompleteController.secondaryTextColor = Color.black

   // Sets the text color of the text in search field
    UITextField.appearance(whenContainedInInstancesOf: [UISearchBar.self]).defaultTextAttributes = [NSAttributedStringKey.foregroundColor.rawValue: UIColor.white]

score 1 · Answer 4 · answered Oct 28 '20 at 08:11

Please use the below code to support light and dark mode in iOS.

let autocompleteController = GMSAutocompleteViewController()
autocompleteController.delegate = self

if #available(iOS 13.0, *) {
            if UIScreen.main.traitCollection.userInterfaceStyle == .dark  {
                autocompleteController.primaryTextColor = UIColor.white
                autocompleteController.secondaryTextColor = UIColor.lightGray
                autocompleteController.tableCellSeparatorColor = UIColor.lightGray
                autocompleteController.tableCellBackgroundColor = UIColor.darkGray
            } else {
                autocompleteController.primaryTextColor = UIColor.black
                autocompleteController.secondaryTextColor = UIColor.lightGray
                autocompleteController.tableCellSeparatorColor = UIColor.lightGray
                autocompleteController.tableCellBackgroundColor = UIColor.white
            }
        }

To access the full code, please check out the below link.
https://gist.github.com/imnaveensharma/fb41063c1f858da15199ee7545f51422

score 0 · Answer 5 · answered Jul 15 '20 at 00:12

Better solution for iOS > 13 for Light and Dark Mode not to do:

autocompleteController.primaryTextColor = UIColor.label
autocompleteController.secondaryTextColor = UIColor.secondaryLabel
autocompleteController.tableCellSeparatorColor = UIColor.separator
autocompleteController.tableCellBackgroundColor = UIColor.systemBackground

score 0 · Answer 6 · answered Feb 26 '21 at 10:58

Update code for Swift 5+

full code will look like this.

// Present the Autocomplete view controller 
    @objc func autoCompleteClicked() {
        
        let autocompleteController:GMSAutocompleteViewController! = GMSAutocompleteViewController()
        if #available(iOS 13.0, *) {
            if UIScreen.main.traitCollection.userInterfaceStyle == .dark  {
                autocompleteController.primaryTextColor = UIColor.white
                autocompleteController.secondaryTextColor = UIColor.lightGray
                autocompleteController.tableCellSeparatorColor = UIColor.lightGray
                autocompleteController.tableCellBackgroundColor = UIColor.darkGray
           } else {
            autocompleteController.primaryTextColor = UIColor.black
            autocompleteController.secondaryTextColor = UIColor.lightGray
            autocompleteController.tableCellSeparatorColor = UIColor.lightGray
            autocompleteController.tableCellBackgroundColor = UIColor.white
           }
        }
        
        
        
     // let autocompleteController = GMSAutocompleteViewController()
      autocompleteController.delegate = self

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

      // Specify a filter.
      let filter = GMSAutocompleteFilter()
      filter.type = .address
      autocompleteController.autocompleteFilter = filter

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

I updated the code of @Sabrina

How to customise GMSAutocompleteViewController for iOS?

6 Answers6