3
votes

Swift | Afficher l'image dans GMSMarker personnalisé

 Marqueur personnalisé avec photos de profil utilisateur

Je souhaite afficher la photo de profil de l'utilisateur dans mon marqueur personnalisé pour Google Maps. Comme tous les autres, j'ai essayé ce code dans init: de customMarker

self.location = location
position = location
icon = UIImage(named: "live location")
groundAnchor = CGPoint(x: 0.5, y: 1)

Existe-t-il un moyen possible d'afficher une autre image dans le cercle du icône de marqueur. ex. en utilisant xib.


1 commentaires

Vous pouvez le faire en créant une classe personnalisée de UIView .


3 Réponses :


2
votes

Vous pouvez utiliser deux méthodes données:

let marker = GMSMarker(position: coordinate)
marker.icon = drawImageWithProfilePic(pp: imgPP, image: img)
marker.appearAnimation = GMSMarkerAnimation.pop
marker.map = viewGoogleMap

Ici, pp est la photo de votre profil et image est l'icône de la photo. Vous pouvez définir le cadre de la photo de profil en fonction de vous. J'ai essayé ceci:

Modifier

func drawImageWithProfilePic(pp: UIImage, image: UIImage) -> UIImage {

    let imgView = UIImageView(image: image)
    let picImgView = UIImageView(image: pp)
    picImgView.frame = CGRect(x: 0, y: 0, width: 30, height: 30)

    imgView.addSubview(picImgView)
    picImgView.center.x = imgView.center.x
    picImgView.center.y = imgView.center.y - 7
    picImgView.layer.cornerRadius = picImgView.frame.width/2
    picImgView.clipsToBounds = true
    imgView.setNeedsLayout()
    picImgView.setNeedsLayout()

    let newImage = imageWithView(view: imgView)
    return newImage
}

func imageWithView(view: UIView) -> UIImage {
    var image: UIImage?
    UIGraphicsBeginImageContextWithOptions(view.bounds.size, false, 0.0)
    if let context = UIGraphicsGetCurrentContext() {
        view.layer.render(in: context)
        image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
    }
    return image ?? UIImage()
}

et voici le résultat:

 entrez la description de l'image ici


2 commentaires

Où voulez-vous que j'utilise view.addSubview (imageView) car GMSMarker ne permet pas d'utiliser addSubview


drawImageWithProfilePic (pp: #imageLiteral (resourceName: "no_pic"), image: #imageLiteral (resourceName: "pin_short")) renverra une image. Il vous suffit de le définir sur l'icône de votre marqueur.



0
votes

Vous pouvez créer / concevoir une vue personnalisée en nib ou par programmation , puis l’attribuer à votre marqueur comme ceci.

let someView = YourCustomView()
someView.markerImageView.image = UIImage(named: "markerImage")
someView.userImageView.image = UIImage(named: "userImage")

let marker = GMSMarker()
marker.map = yourMapView
marker.position = somePositionCoordinate;
marker.iconView = someView

p>


1 commentaires

Il n'y a pas de propriété customView pour GMSMarker, nous n'avons que iconView . L'utilisation de iconView n'aide pas.



2
votes
    //put this code where you get image

     let url = URL(string: "your_imageUrlString")
     let data = try? Data(contentsOf: url!)

      let marker = GMSMarker()
       marker.position = CLLocationCoordinate2D(latitude: Double(lat)!, longitude:  Double(long)!)
   marker.icon = self.drawImageWithProfilePic(pp: UIImage.init(data:data!)!, image: UIImage.init(named: "red")!)
       marker.title = location
          marker.snippet = name + " " + mobile
    marker.appearAnimation = GMSMarkerAnimation.pop
                                marker.map = self.mapView


//put this code in your viewController class 
 func drawImageWithProfilePic(pp: UIImage, image: UIImage) -> UIImage {

        let imgView = UIImageView(image: image)
         imgView.frame = CGRect(x: 0, y: 0, width: 100, height: 100)

        let picImgView = UIImageView(image: pp)
        picImgView.frame = CGRect(x: 0, y: 0, width: 40, height: 40)

        imgView.addSubview(picImgView)
        picImgView.center.x = imgView.center.x
        picImgView.center.y = imgView.center.y - 7
        picImgView.layer.cornerRadius = picImgView.frame.width/2
        picImgView.clipsToBounds = true
        imgView.setNeedsLayout()
        picImgView.setNeedsLayout()

        let newImage = imageWithView(view: imgView)
        return newImage
    }

    func imageWithView(view: UIView) -> UIImage {
        var image: UIImage?
        UIGraphicsBeginImageContextWithOptions(view.bounds.size, false, 0.0)
        if let context = UIGraphicsGetCurrentContext() {
            view.layer.render(in: context)
            image = UIGraphicsGetImageFromCurrentImageContext()
            UIGraphicsEndImageContext()
        }
        return image ?? UIImage()
    }



//here "red" is dummy background image 

0 commentaires