Swift füge Badge zur Navigation hinzu barButtonItem und UIButton

Question

Ich versuche, das Badge auf meiner Benachrichtigungsschaltfläche in App anzuzeigen, wie auf AppIcon angezeigt.

Was ich bisher recherchiert habe, ist mit Obj verwandt. C, aber nichts, das speziell diskutiert Weg zur Implementierung dieser Lösung in Swift,

Bitte helfen, eine Lösung zu finden, um eine benutzerdefinierte Klasse/Code, um Badge auf UiBarbutton und UiButton zu erreichen.

bisher Recherchiert:

https://github.com/Marxon13/M13BadgeView

zusammen mit MKBadge Klasse usw.

Answer 1

Für UIBarButtonItem Sie dieses Projekt versuchen:

ENMBadgeBarButtonItem

Answer 2

Die MIBadgeButton-Swift arbeitet auch auf UIBarButtonItems. Hier ist mein Code, nachdem die Navigationsleiste erstellt:

let rightBarButtons = self.navigationItem.rightBarButtonItems 

let alarmsBarButton = rightBarButtons?.last 

let alarmsButton = alarmsBarButton.customView as! MIBadgeButton? 

alarmsButton.badgeString = "10" 

Answer 3

M13BadgeView mit .. verwenden diesen Code

(im mit fontawesome.swift für Knöpfe :: https://github.com/thii/FontAwesome.swift)

let rightButton = UIButton(frame: CGRect(x:0,y:0,width:30,height:30)) 
    rightButton.titleLabel?.font = UIFont.fontAwesome(ofSize: 22) 
    rightButton.setTitle(String.fontAwesomeIcon(name: .shoppingBasket), for: .normal) 

    let rightButtonItem : UIBarButtonItem = UIBarButtonItem(customView: rightButton) 

    let badgeView = M13BadgeView() 
     badgeView.text = "1" 
     badgeView.textColor = UIColor.white 
     badgeView.badgeBackgroundColor = UIColor.red 
     badgeView.borderWidth = 1.0 
     badgeView.borderColor = UIColor.white 
     badgeView.horizontalAlignment = M13BadgeViewHorizontalAlignmentLeft 
     badgeView.verticalAlignment = M13BadgeViewVerticalAlignmentTop 
     badgeView.hidesWhenZero = true 

    rightButton.addSubview(badgeView) 

    self.navigationItem.rightBarButtonItem = rightButtonItem 

Answer 4

Sie kann es programmgesteuert mit

self.tabBarItem.badgeColor = .red 

oder verwenden Sie die st oryboard. Siehe das Bild: storyboard

Answer 5

Es gibt eine elegantere Lösung mit einer Erweiterung für UIButtonItem

extension CAShapeLayer { 
    func drawCircleAtLocation(location: CGPoint, withRadius radius: CGFloat, andColor color: UIColor, filled: Bool) { 
     fillColor = filled ? color.cgColor : UIColor.white.cgColor 
     strokeColor = color.cgColor 
     let origin = CGPoint(x: location.x - radius, y: location.y - radius) 
     path = UIBezierPath(ovalIn: CGRect(origin: origin, size: CGSize(width: radius * 2, height: radius * 2))).cgPath 
    } 
} 

private var handle: UInt8 = 0 

extension UIBarButtonItem { 
    private var badgeLayer: CAShapeLayer? { 
     if let b: AnyObject = objc_getAssociatedObject(self, &handle) as AnyObject? { 
      return b as? CAShapeLayer 
     } else { 
      return nil 
     } 
    } 

    func addBadge(number: Int, withOffset offset: CGPoint = CGPoint.zero, andColor color: UIColor = UIColor.red, andFilled filled: Bool = true) { 
     guard let view = self.value(forKey: "view") as? UIView else { return } 

     badgeLayer?.removeFromSuperlayer() 

     // Initialize Badge 
     let badge = CAShapeLayer() 
     let radius = CGFloat(7) 
     let location = CGPoint(x: view.frame.width - (radius + offset.x), y: (radius + offset.y)) 
     badge.drawCircleAtLocation(location: location, withRadius: radius, andColor: color, filled: filled) 
     view.layer.addSublayer(badge) 

     // Initialiaze Badge's label 
     let label = CATextLayer() 
     label.string = "\(number)" 
     label.alignmentMode = kCAAlignmentCenter 
     label.fontSize = 11 
     label.frame = CGRect(origin: CGPoint(x: location.x - 4, y: offset.y), size: CGSize(width: 8, height: 16)) 
     label.foregroundColor = filled ? UIColor.white.cgColor : color.cgColor 
     label.backgroundColor = UIColor.clear.cgColor 
     label.contentsScale = UIScreen.main.scale 
     badge.addSublayer(label) 

     // Save Badge as UIBarButtonItem property 
     objc_setAssociatedObject(self, &handle, badge, .OBJC_ASSOCIATION_RETAIN_NONATOMIC) 
    } 

    func updateBadge(number: Int) { 
     if let text = badgeLayer?.sublayers?.filter({ $0 is CATextLayer }).first as? CATextLayer { 
      text.string = "\(number)" 
     } 
    } 

    func removeBadge() { 
     badgeLayer?.removeFromSuperlayer() 
    } 
} 

Dieser große Code von Stefano Vettor erstellt wurde und Sie können alle Details finden Sie unter: https://gist.github.com/freedom27/c709923b163e26405f62b799437243f4

Answer 6

Gute Antwort @Julio Bailon (https://stackoverflow.com/a/45948819/1898973)!

Hier ist die Website des Autors mit vollständiger Erklärung: http://www.stefanovettor.com/2016/04/30/adding-badge-uibarbuttonitem/.

Es scheint nicht auf iOS 11 zu arbeiten, möglicherweise weil das Skript versucht, auf die Eigenschaft "view" des UIBarButtonItem zuzugreifen.Ich habe es Arbeit:

1) durch eine UIButton erstellen und dann die UIBarButtonItem Erstellen der UIButton als Custom Verwendung:

navigationItem.rightBarButtonItem = UIBarButtonItem.init(customView: shoppingCartButton)

2) Durch die Zeile in der UIBarButtonItem Erweiterung ersetzt:

guard let view = self.value(forKey: "view") as? UIView else { return }

mit den folgenden:

guard let view = self.customView else { return }

Scheint elegant für mich und, das Beste von allem, es hat funktioniert!