Coder Social home page Coder Social logo

swift-badge's Introduction

Swift Badge

A badge control for iOS and tvOS written in Swift

Carthage compatible CocoaPods Version License Platform

  • The badge is a subclass of UILabel view.
  • It can be created and customized from the Storyboard or from the code.

Setup

There are three ways you can add BadgeSwift to your Xcode project.

Add source (iOS 7+)

Simply add BadgeSwift.swift file to your project.

Setup with Carthage (iOS 8+)

Alternatively, add github "evgenyneu/swift-badge" ~> 5.0 to your Cartfile and run carthage update.

Setup with CocoaPods (iOS 8+)

If you are using CocoaPods add this text to your Podfile and run pod install.

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

Legacy Swift versions

Setup a previous version of the library if you use an older version of Swift.

Usage

Creating a badge in the Storyboard

  • Drag a Label to your view.
  • Set its class to BadgeSwift in identity inspector.
  • Set the module property to BadgeSwift if you used Carthage or CocoaPods setup methods.

Add badge to storyboard

  • Customize the badge properties in the attributes inspector (text, color and other).
  • If storyboard does not show the badge correctly click Refresh All Views from the Editor menu.

Change badge properties in attribute inspector

Note: Carthage setup method does not allow to customize Cosmos view from the storyboard, please do it from code instead.

Creating a badge from the code

Add import BadgeSwift to your source code unless you used the file setup method.

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

See example of how to create and position the badge from code in the demo app.

Customization

// 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

Demo app

This project includes a demo app.

BadgeSwift for iOS demo app

Show BadgeSwift in a table view in iOS

Create badge from code BadgeSwift for iOS

Alternative solutions

Here are some alternative badges for iOS.

Thanks to ๐Ÿ‘

  • amg1976 for adding a border and redesigning the drawing.
  • gperdomor for adding ability to customize corner radius.

License

BadgeSwift is released under the MIT License.

Feedback is welcome

If you found a bug or want to improve the badge feel free to create an issue.

swift-badge's People

Contributors

evgenyneu avatar amg1976 avatar gperdomor avatar

Watchers

James Cloos avatar Alexandre Henrique avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.