Developing high-quality mobile apps for iOS and Android is what we do here at tapptitude, day in and day out. So we decided to share with you guys something we finished up a while back and loved designing: an elegant, animated and customizable segmented control for iOS.
And here’s everything you need to know about it:
Features
- Variable number of items
- Animated transition
- Fully configurable (colour, gradient, shadow, corner radius)
- Designable into Interface Builder
Requirements
- iOS 8.0+
- Xcode 7.3+
Installation
- CocoaPods
- Swift 3.0
pod ‘TTSegmentedControl’
- Swift 2.x
pod ‘TTSegmentedControl’, ‘0.1.1’
- Manually
Add the TTSegmentedControl.swift file to your project.
Usage
- Programmatic:
let segmentedControl = TTSegmentedControl()
segmentedControl.allowChangeThumbWidth = false
segmentedControl.frame = CGRect(x: 50, y: 200, width: 100, height: 50)
segmentedControl.didSelectItemWith = { (index, title) -> () in
print("Selected item \(index)")
}
view.addSubview(segmentedControl)- Interface Builder:
Add a UIView and set it’s class to TTSegmentedControl. You can customize the control directly from the interface builder.
How to customize?
Check out the playground and see how to implement and customize the SegmentedControl.
pod try TTSegmentedControl
In order to customize the segmented control, you’ll have to edit its properties.
segmentedControl.defaultTextColor = UIColor.blackColor() segmentedControl.selectedTextColor = UIColor.whiteColor() segmentedControl.thumbGradientColors = [UIColor.redColor(), UIColor.blueColor()] segmentedControl.useShadow = true
License
TTSegmentedControl is available under the MIT license.
Contribution
Feel free to Fork, submit Pull Requests or send us your feedback and suggestions over at GitHub, right here.
