RockStar
RockStar

Reputation: 1314

Button on the GMSMapView (Google Map) using Swift

As I am new to Swift programming and also iOS development, I am facing problem of placing button on top of Google Map.

I have been using Google Map SDK for iOS using Cocopods, and example from Google Map API guide.

override func viewDidLoad() {
    super.viewDidLoad()

    var camera = GMSCameraPosition.cameraWithLatitude(-33.86, longitude: 151.20, zoom: 6)
    var mapView = GMSMapView.mapWithFrame(CGRectZero, camera: camera)
    mapView.myLocationEnabled = true
    mapView.settings.myLocationButton = true;
    self.view = mapView

    var marker = GMSMarker()
    marker.position = CLLocationCoordinate2DMake(-33.86, 151.20)
    marker.title = "Sydney"
    marker.snippet = "Australia"
    marker.map = mapView

}

I want to place button above the map.

enter image description here

Upvotes: 3

Views: 16408

Answers (6)

Ashish
Ashish

Reputation: 6579

Try doing something like this inside your ViewController class, maybe in the viewDidLoad() method:

Assuming that the self.view is an instance of GmsMapView, like this,
self.view = GMSMapView.map(withFrame: .zero, camera: someCamera).

let btn: UIButton = UIButton(type: UIButtonType.roundedRect)
btn.frame = CGRect(x: 100, y: 100, width: 100, height: 30)
btn.setTitle("MyButton", for: UIControlState.normal)
self.view.addSubview(btn)

For XCode 11

let btn: UIButton = UIButton(type: UIButton.ButtonType.roundedRect)
btn.frame = CGRect(x: 100, y: 100, width: 100, height: 30)
btn.setTitle("MyButton", for: UIControl.State.normal)
self.view.addSubview(btn)

Upvotes: 3

Talha Rasool
Talha Rasool

Reputation: 1152

self.okBtnOutlet.addTarget(self, action: #selector(placeMarkerPointOnDrag), for: .touchUpInside)

@objc  func placeMarkerPointOnDrag(){
    self.placeMarkerOnMapOnButtonTap(coordinate: self.draggingCoordinate)
}

func mapView(_ mapView: GMSMapView, didEndDragging marker: GMSMarker) {
    print("End dragging")
    let coordinate = mapView.myLocation!.coordinate
    print(coordinate)
    self.draggingCoordinate = marker.position
    // self.placeMarkerOnMapOnButtonTap(coordinate: marker.position)
}

func placeMarkerOnMapOnButtonTap(coordinate : CLLocationCoordinate2D){
    let geocoder = GMSGeocoder()
    geocoder.reverseGeocodeCoordinate(coordinate) {
        response, error in
        //
        if error != nil {
            print("reverse geodcode fail: \(error!.localizedDescription)")
        }
        else {
            if let places = response?.results() {
                if let place = places.first {
                    if let lines = place.lines {
                        print("GEOCODE: Formatted Address: \(lines)")
                        let temp = CoordinatesValue(lineString: lines.first ?? "", title: "", lat: coordinate.latitude, long: coordinate.longitude, isSelect: false, isCompleted: false)
                        self.locArray.append(temp)
                    }
                    if let newPlace = place.postalCode{
                        print(newPlace)
                    }
                }
                else {
                    print("GEOCODE: nil first in places")
                }
            }
            else {
                print("GEOCODE: nil in places")
            }
        }
    }

    let position = CLLocationCoordinate2D(latitude: coordinate.latitude, longitude: coordinate.longitude)
    let  marker = GMSMarker(position: position)
    marker.title = ""
    marker.map = self.googleMapView
    self.selectedCoordinate = CLLocation(latitude: coordinate.latitude, longitude: coordinate.longitude)
    //    let distanceInMeters : CLLocationDistance = self.currentCoordinate.distance(from: selectedCoordinate)
    //   print(distanceInMeters)
    print("The CURRENT LAT \(lat) & LONG \(long)")
}

Upvotes: 0

This is a simple way to put the Map and Items on it. Create your button and every thing you want on the UIViewController if you have any UIView covering the default UIView on the ViewController, make them background color as Clear Color then add following code in viewDidLoad()

    let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 17.0)
    let mapView = GMSMapView.map(withFrame: self.view.bounds, camera: camera)
    mapView.isMyLocationEnabled = true
    self.view.insertSubview(mapView, at: 0)

    let marker = GMSMarker()
    marker.position = CLLocationCoordinate2DMake(-33.86, 151.20)
    marker.title = "Main Title"
    marker.snippet = "Deescription"
    marker.map = mapView

Upvotes: 0

M A Russel
M A Russel

Reputation: 1557

I tried several options but got no result. Finally found that after implementing GoogleMap on a view implement a button or anything else after that, like this :

    override func viewDidLoad() {
    super.viewDidLoad()

    //Google Maps

    // Create a GMSCameraPosition that tells the map to display the
    let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 6.0)
    let mapView = GMSMapView.map(withFrame: CGRect.zero, camera: camera)
    view = mapView

    // Creates a marker in the center of the map.
    let marker = GMSMarker()
    marker.position = CLLocationCoordinate2D(latitude: -33.86, longitude: 151.20)
    marker.title = "Sydney"
    marker.snippet = "Australia"
    marker.map = mapView

    // Add a button
    let revealButton = UIButton()
    let btnImage = UIImage(named: "reveal-icon")
    revealButton.setImage(btnImage, for: .normal)
    revealButton.frame = CGRect(x: 16, y: 38, width: 48, height: 41)
    self.view.addSubview(revealButton)

    // RevealViewController for button.
    let revealViewController = self.revealViewController()
    revealButton.addTarget(revealViewController,
                         action: #selector(SWRevealViewController.revealToggle(_:)), for: .touchUpInside)
    self.view.addGestureRecognizer(self.revealViewController().panGestureRecognizer())


}

Upvotes: 1

Tommy
Tommy

Reputation: 989

Lets say you have a google map view called "googleMapView" and a UIButton called "yourButton"

Make sure that you insert your GooglemapView underneath the button by doing this:

self.view.insertSubview(googleMapView, atIndex: 0)
self.view.insertSubview(yourButton, atIndex: 1)

Upvotes: 3

Felipe Cypriano
Felipe Cypriano

Reputation: 2737

Just create a UIButton and add it to your view after adding the map, as the last thing in your viewDidLoad should be fine.

let button = UIButton(frame: whereYouWant)
self.view.addSubview(button)

Upvotes: 9

Related Questions