Features • Installation • Usage • Customisation • License
Sweet segment control with image, text and badge ! Hightly customisable.
- Segment control with only text
- Segment control with image and text
- Segment control with only image
- Display badge
- Unit & UI Test
- Xcode 8
- iOS 9.0+ target deployment
- Swift 3 project
- Dependency with SwiftBadge
- 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" - 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.
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()Some application already use this segment control like :
What about yours ? If your application also use this library, feel free to contact me or make pull request on the README 😁
Florian Gabach, [email protected]
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.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent