首页 > 解决方案 > 如何将徽章添加到 *GMSMarker()* 图像中?

问题描述

我正在GMSMarker()谷歌地图上加载多个图像。

效果很好,您可以查看下图。

在此处输入图像描述

现在我想在那个标记上添加徽章。

如下图在此处输入图像描述

如果用户有朋友,那么我将显示徽章,检查下面的代码以在谷歌地图上加载多个标记

func loadMarkersOnMap(data: MapDataModel) {
        
        let marker = GMSMarker()
        
        let markerView = UIImageView(image: #imageLiteral(resourceName: "boyAvatar"))
        markerView.frame = CGRect(x: 0, y: 0, width: 35, height: 35)
        markerView.loadImage(url: URL(string: data.profileImage), placeholder: #imageLiteral(resourceName: "boyAvatar"), gender: data.gender)
        //markerView.layer.cornerRadius = (markerView.bounds.height)/2
        //markerView.clipsToBounds = true
        markerView.contentMode = .scaleAspectFill
        markerView.borderColor = data.isFriend ? #colorLiteral(red: 0.2784313725, green: 0.7058823529, blue: 0.3490196078, alpha: 1) : .clear
        markerView.borderWidth = data.isFriend ? 1.2 : 0
        
        if data.isFriend {
            let bagButton = BadgeButton()
            bagButton.frame = CGRect(x: 0, y: 0, width: 22, height: 22)
            bagButton.tintColor = UIColor.darkGray
            bagButton.badgeEdgeInsets = UIEdgeInsets(top: 20, left: 0, bottom: 0, right: 15)
            bagButton.badge = "3"
            
            markerView.addSubview(bagButton)
            
            //markerView.insertSubview(bagButton, aboveSubview: markerView) // not working
            //markerView.bringSubviewToFront(bagButton) // not working
        }
        marker.iconView = markerView
        tempCardDataArray.append(data)
        marker.position = self.checkIfMultipleCoordinates(latitude: data.lat, longitude: data.lng, markerDataArray: tempCardDataArray)
        marker.map = self.mapView
        
        // *IMPORTANT* Assign all the spots data to the marker's userData property
        marker.userData = data
    }

现在事情是徽章是可见的,但它不正确,徽章插入正在切割 imageView。检查下图

在此处输入图像描述

我已经尝试了很多类似的东西marker.iconView?.insertSubview(bagButton, aboveSubview: markerView)bringSubviewToFront但结果是一样的。

如果有人想检查BadgeButton()课程,那么这里的代码

class BadgeButton: UIButton {

    var badgeLabel = UILabel()

    var badge: String? {
        didSet {
            addbadgetobutton(badge: badge)
        }
    }

    public var badgeBackgroundColor = UIColor.red {
        didSet {
            badgeLabel.backgroundColor = badgeBackgroundColor
        }
    }

    public var badgeTextColor = UIColor.white {
        didSet {
            badgeLabel.textColor = badgeTextColor
        }
    }

    public var badgeFont = UIFont.systemFont(ofSize: 12.0) {
        didSet {
            badgeLabel.font = badgeFont
        }
    }

    public var badgeEdgeInsets: UIEdgeInsets? {
        didSet {
            addbadgetobutton(badge: badge)
        }
    }

    override init(frame: CGRect) {
        super.init(frame: frame)
        addbadgetobutton(badge: nil)
    }

    func addbadgetobutton(badge: String?) {
        badgeLabel.text = badge
        badgeLabel.textColor = badgeTextColor
        badgeLabel.backgroundColor = badgeBackgroundColor
        badgeLabel.font = badgeFont
        badgeLabel.sizeToFit()
        badgeLabel.textAlignment = .center
        let badgeSize = badgeLabel.frame.size

        let height = max(18, Double(badgeSize.height) + 5.0)
        let width = max(height, Double(badgeSize.width) + 10.0)

        var vertical: Double?, horizontal: Double?
        if let badgeInset = self.badgeEdgeInsets {
            vertical = Double(badgeInset.top) - Double(badgeInset.bottom)
            horizontal = Double(badgeInset.left) - Double(badgeInset.right)

            let x = (Double(bounds.size.width) - 10 + horizontal!)
            let y = -(Double(badgeSize.height) / 2) - 10 + vertical!
            badgeLabel.frame = CGRect(x: x, y: y, width: width, height: height)
        } else {
            let x = self.frame.width - CGFloat((width / 2.0))
            let y = CGFloat(-(height / 2.0))
            badgeLabel.frame = CGRect(x: x, y: y, width: CGFloat(width), height: CGFloat(height))
        }

        badgeLabel.layer.cornerRadius = badgeLabel.frame.height/2
        badgeLabel.layer.masksToBounds = true
        addSubview(badgeLabel)
        badgeLabel.isHidden = badge != nil ? false : true
    }

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        self.addbadgetobutton(badge: nil)
        fatalError("init(coder:) is not implemented")
    }
}

有人对此有想法吗?

标签: iosswiftuiimageviewgoogle-maps-markersbadge

解决方案


推荐阅读