BadgeSegmentControl 2.0

You want to add pod 'BadgeSegmentControl', '~> 2.0' similar to the following to your Podfile:

target 'MyApp' do
  pod 'BadgeSegmentControl', '~> 2.0'
end

Then run a pod install inside your terminal, or from CocoaPods.app.

Alternatively to give it a test run, run the command:

pod try BadgeSegmentControl

BadgeSegmentControl 2.0

By
Florian Gabach

Features • Installation • Usage • Customisation • License

Sweet segment control with image, text and badge ! Hightly customisable.

Features

[x] Segment control with only text
[x] Segment control with image and text
[x] Segment control with only image
[x] Display badge

Todo (feel free to make PR)

[ ] Unit & UI Test

Requirements

Xcode 8
iOS 9.0+ target deployment
Swift 3 project
Dependency with SwiftBadge

Installation

To integrate BadgeSegmentControl into your Xcode project using CocoaPods, specify it in your Podfile :

pod "BadgeSegmentControl"

To integrate BadgeSegmentControl into your Xcode project using Carthage, specify it in your Cartfile :

github "terflogag/BadgeSegmentControl"

Usage

Import the library :

import BadgeSegmentControl

Display the segment control programmatically :

let padding: CGFloat = 50
let mySegmentControl = BadgeSegmentControl(frame: CGRect(x: padding / 2,
                                                         y: self.view.frame.height - (padding * 2),
                                                         width: self.view.frame.width - padding,
                                                         height: padding))
self.mySegmentControl?.segmentAppearance = SegmentControlAppearance.appearance()

// Add segments
self.mySegmentControl?.addSegmentWithTitle("First")
self.mySegmentControl?.addSegmentWithTitle("Second")
self.mySegmentControl?.addTarget(self,
                                 action: #selector(selectSegmentInSegmentView(segmentView:)),
                                 for: .valueChanged)

// Set segment with index 0 as selected by default
self.mySegmentControl?.selectedSegmentIndex = 0

// Add to subview
if let segmentControl = self.mySegmentControl {
    self.view.addSubview(segmentControl)
}

Listen for change :

// Segment selector for .ValueChanged
func selectSegmentInSegmentView(segmentView: BadgeSegmentControl) {
    print("Select segment at index: \(segmentView.selectedSegmentIndex)")
}

From the storyboard :

Just set an UIView with BadgeSegmentControl class and export to an IBOutlet.

Customisation

import BadgeSegmentControl

func appearance() -> BadgeSegmentControlAppearence {
    let appearance = BadgeSegmentControlAppearence()

    // Segment color 
    appearance.segmentOnSelectionColour = UIColor.white
    appearance.segmentOffSelectionColour = UIColor(red:1.00, green:0.62, blue:0.22, alpha:1.00)

    // Title font 
    appearance.titleOnSelectionFont = UIFont.systemFont(ofSize: 14)
    appearance.titleOffSelectionFont = UIFont.systemFont(ofSize: 14)

    // Title color 
    appearance.titleOnSelectionColour = UIColor(red:1.00, green:0.62, blue:0.22, alpha:1.00)
    appearance.titleOffSelectionColour = UIColor.white

    // Vertical margin 
    appearance.contentVerticalMargin = 10.0

    // Border style
    appearance.borderColor = UIColor.white
    appearance.cornerRadius = 5.0
    appearance.borderWidth = 2.0

    // Divider style
    appearance.dividerWidth = 1.0
    appearance.dividerColour = UIColor(white: 0.95, alpha: 0.3)

    return appearance
}

self.mySegmentControl?.segmentAppearance = self.appearance()

Applications

Some application already use this segment control like :

Giraf

What about yours ? If your application also use this library, feel free to contact me or make pull request on the README 😁

Author

Florian Gabach, [email protected]

License

OpenSourceController is available under the MIT license.

If your application use this segment control consider to add the licence in your Credits/About section. You can use this library to do it.