Question

如何在表格视图上制作通知标志？
如果有新数据，它将在表格视图上显示徽章，如果再次有新数据，徽章将自动添加。

Answer 1

我强烈建议您使用以下框架：swift-badge

use_frameworks!
target 'Your target name'
pod 'BadgeSwift', '~> 4.0'

易于使用：

let badge = BadgeSwift()
view.addSubview(badge)
// Position the badge ...

<强>定制

// Text
badge.text = "2"

// Insets
badge.insets = CGSize(width: 12, height: 12)

// Font
badge.font = UIFont.preferredFont(forTextStyle: UIFontTextStyle.body)

// Text color
badge.textColor = UIColor.yellow

// Badge color
badge.badgeColor = UIColor.black

// Shadow
badge.shadowOpacityBadge = 0.5
badge.shadowOffsetBadge = CGSize(width: 0, height: 0)
badge.shadowRadiusBadge = 1.0
badge.shadowColorBadge = UIColor.black

// No shadow
badge.shadowOpacityBadge = 0

// Border width and color
badge.borderWidth = 5.0
badge.borderColor = UIColor.magenta

// Customize the badge corner radius.
// -1 if unspecified. When unspecified, the corner is fully rounded. Default: -1.
badge.cornerRadius = 10

另外。如果你不想使用pod，这里是完整且可以使用的类它还包括我创建的函数：

import UIKit

/**

 Badge view control for iOS and tvOS.

 Project home: https://github.com/marketplacer/swift-badge

 */
@IBDesignable public class BadgeSwift: UILabel {

    /// Background color of the badge
    @IBInspectable public var badgeColor = Colors.red {
        didSet {
            setNeedsDisplay()
        }
    }

    /// Width of the badge border
    @IBInspectable public var borderWidth: CGFloat = 0 {
        didSet {
            invalidateIntrinsicContentSize()
        }
    }

    /// Color of the bardge border
    @IBInspectable public var borderColor = Colors.white {
        didSet {
            invalidateIntrinsicContentSize()
        }
    }

    /// Badge insets that describe the margin between text and the edge of the badge.
    @IBInspectable public var insets: CGSize = CGSize(width: 5, height: 2) {
        didSet {
            invalidateIntrinsicContentSize()
        }
    }

    // MARK: Badge shadow
    // --------------------------

    /// Opacity of the badge shadow
    @IBInspectable public var shadowOpacityBadge: CGFloat = 0.5 {
        didSet {
            layer.shadowOpacity = Float(shadowOpacityBadge)
            setNeedsDisplay()
        }
    }

    /// Size of the badge shadow
    @IBInspectable public var shadowRadiusBadge: CGFloat = 0.5 {
        didSet {
            layer.shadowRadius = shadowRadiusBadge
            setNeedsDisplay()
        }
    }

    /// Color of the badge shadow
    @IBInspectable public var shadowColorBadge = Colors.black {
        didSet {
            layer.shadowColor = shadowColorBadge.cgColor
            setNeedsDisplay()
        }
    }

    /// Offset of the badge shadow
    @IBInspectable public var shadowOffsetBadge: CGSize = CGSize(width: 0, height: 0) {
        didSet {
            layer.shadowOffset = shadowOffsetBadge
            setNeedsDisplay()
        }
    }

    /// Initialize the badge view
    convenience public init() {
        self.init(frame: CGRect())
    }

    /// Initialize the badge view
    override public init(frame: CGRect) {
        super.init(frame: frame)

        setup()
    }

    /// Initialize the badge view
    required public init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)

        setup()
    }

    /// Add custom insets around the text
    override public func textRect(forBounds bounds: CGRect, limitedToNumberOfLines numberOfLines: Int) -> CGRect {
        let rect = super.textRect(forBounds: bounds, limitedToNumberOfLines: numberOfLines)

        var insetsWithBorder = actualInsetsWithBorder()
        let rectWithDefaultInsets = rect.insetBy(dx: -insetsWithBorder.width, dy: -insetsWithBorder.height)

        // If width is less than height
        // Adjust the width insets to make it look round
        if rectWithDefaultInsets.width < rectWithDefaultInsets.height {
            insetsWithBorder.width = (rectWithDefaultInsets.height - rect.width) / 2
        }
        let result = rect.insetBy(dx: -insetsWithBorder.width, dy: -insetsWithBorder.height)

        return result
    }

    /// Draws the label with insets
    override public func drawText(in rect: CGRect) {
        layer.cornerRadius = rect.height / 2

        let insetsWithBorder = actualInsetsWithBorder()
        let insets = UIEdgeInsets(
            top: insetsWithBorder.height,
            left: insetsWithBorder.width,
            bottom: insetsWithBorder.height,
            right: insetsWithBorder.width)

        let rectWithoutInsets = UIEdgeInsetsInsetRect(rect, insets)

        super.drawText(in: rectWithoutInsets)
    }

    /// Draw the background of the badge
    override public func draw(_ rect: CGRect) {
        let rectInset = rect.insetBy(dx: borderWidth/2, dy: borderWidth/2)
        let path = UIBezierPath(roundedRect: rectInset, cornerRadius: rect.height/2)

        badgeColor.setFill()
        path.fill()

        if borderWidth > 0 {
            borderColor.setStroke()
            path.lineWidth = borderWidth
            path.stroke()
        }

        super.draw(rect)
    }

    private func setup() {
        textAlignment = NSTextAlignment.center
        clipsToBounds = false // Allows shadow to spread beyond the bounds of the badge
    }

    /// Size of the insets plus the border
    private func actualInsetsWithBorder() -> CGSize {
        return CGSize(
            width: insets.width + borderWidth,
            height: insets.height + borderWidth
        )
    }

    /// Draw the stars in interface builder
    @available(iOS 8.0, *)
    override public func prepareForInterfaceBuilder() {
        super.prepareForInterfaceBuilder()

        setup()
        setNeedsDisplay()
    }
}

func createBadge(_ who: BadgeSwift, _ view: UIView, _ value: String) {
    if !view.subviews.contains(who) {
        view.addSubview(who)
    }
    configureBadge(who, view, value)
    positionBadge(who, view)
}

func removeBadge(_ who: BadgeSwift, _ view: UIView) {
    if view.subviews.contains(who) {
       who.removeFromSuperview()
    }
}

func configureBadge(_ badge: BadgeSwift, _ view: UIView, _ value: String) {
    badge.text = value
    badge.insets = CGSize(width: 2, height: 2)
    badge.font = UIFont.boldSystemFont(ofSize: 12)
    badge.textColor = Colors.white
    badge.badgeColor = Colors.badgeRed
}

func positionBadge(_ badge: UIView, _ view: UIView) {
    badge.translatesAutoresizingMaskIntoConstraints = false
    var constraints = [NSLayoutConstraint]()

    constraints.append(NSLayoutConstraint(
        item: badge,
        attribute: NSLayoutAttribute.centerY,
        relatedBy: NSLayoutRelation.equal,
        toItem: view,
        attribute: NSLayoutAttribute.top,
        multiplier: 1, constant: 5)
    )

    constraints.append(NSLayoutConstraint(
        item: badge,
        attribute: NSLayoutAttribute.centerX,
        relatedBy: NSLayoutRelation.equal,
        toItem: view,
        attribute: NSLayoutAttribute.right,
        multiplier: 1, constant: -5)
    )
    view.addConstraints(constraints)
}

func calculateCount(_ items: [UITabBarItem]) -> String {
    var countInt = 0
    for i in items {
        if let countString = i.badgeValue {
            countInt = countInt + Int(countString)!
        }
    }
    return String(countInt)
}

为了您在UITableViewCell内创建徽章，您可以使用：

let badge = BadgeSwift()
createBadge(badge, MyCell, "10")

那会给你一个10的徽章。

如何在tableview中创建通知标记

1 个答案: