Latest 1.5.0
License MIT
Platforms ios 10.0, requires ARC
Frameworks UIKit

CI Status

SJSegmentedScrollView is a light weight generic controller written in Swift. Its a simple customizable controller were you can integrate any number of ViewControllers into a segmented controller with a header view controller.



  • [x] Horizontal scrolling for switching from segment to segment.
  • [x] Vertical scrolling for contents.
  • [x] Single header view for all segments.
  • [x] Title, segment selection color, header size, segment height etc can be customized accordingly.
  • [x] Supports Swift and Objective-C.
  • [x] Supports multitasking.
  • [x] Supports Refreshcontrol and custom pull to refresh libs.



CocoaPods is a dependency manager for Cocoa projects. You can install it with the following command:

$ gem install cocoapods

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

source ''
platform :ios, '9.0'

target '<Your Target Name>' do
pod ’SJSegmentedScrollView’, ‘1.3.8'

Then, run the following command:

$ pod install


  • Download SJSegmentedViewController.
  • Drag and drop SJSegmentedViewController directory to your project


  • Xcode 7.3+
  • iOS 9.0+
  • Swift 2.3+


  • If you found a bug, open an issue.
  • If you have a feature request, open an issue.
  • If you want to contribute, submit a pull request.


If this project help you reduce time to develop, you can give me a beer 🍺 :)



Here is how you can use SJSegmentedViewController.

Import SJSegmentedScrollView to your viewcontroller,

import SJSegmentedScrollView

Then add any number of ViewControllers into SJSegmentedViewController. All you have to do is as follows.

if let storyboard = self.storyboard {

let headerViewController = storyboard

let firstViewController = storyboard
firstViewController.title = "First"

let secondViewController = storyboard
secondViewController.title = "Second"

let thirdViewController = storyboard
thirdViewController.title = "Third"

let segmentedViewController = SJSegmentedViewController(headerViewController: headerViewController,
segmentControllers: [firstViewController,
  • Present ViewController

    self.presentViewController(segmentedViewController, animated: false, completion: nil)
  • Push ViewController

                                                          animated: true)
  • Add Child ViewController
    segmentedViewController.view.frame = self.view.bounds

We upgraded to Swift 4. For those who want to use older version,

Swift 3: pod ’SJSegmentedScrollView’, ‘1.3.6'

Swift 2.3: pod ’SJSegmentedScrollView’, ‘1.3.6' OR

pod 'SJSegmentedScrollView', :git => '', :tag => 'v1.1.1'

Customize Segement Tab

Defaultly, SJSegmentedScrollView shows the controller.title as segments tab.

firstViewController.title = "First"

You can customize the segment tab view by providing controller.navigationItem.titleView.

// Custom ImageView
let view = UIImageView()
view.frame.size.width = 100
view.image = UIImage(named: imageName)
view.contentMode = .scaleAspectFit
view.backgroundColor = .white

firstViewController.navigationItem.titleView = view

Customize your view

By default, SJSegmentedScrollView will observe the default view of viewcontroller for content
changes and makes the scroll effect. If you want to change the default view, implement
SJSegmentedViewControllerViewSource and pass your custom view.

func viewForSegmentControllerToObserveContentOffsetChange() -> UIView {
    return view

SJSegmentedViewControllerDelegate delegate method which helps to customize segment view by accessing the current segment, index,

Note: if there is only one content controller then the segment will be empty.

segmentedViewController.delegate = self

extension ViewController: SJSegmentedViewControllerDelegate {

    func didMoveToPage(controller: UIViewController, segment: SJSegmentTab?, index: Int) {
        if segmentedViewController.segments.count > 0 {

            let segmentTab = segmentedViewController.segments[index]
            segmentTab.titleColor = .yellow

You can also customize your controllers by using following properties in SJSegmentedViewController.

let segmentedViewController = SJSegmentedViewController()

//Set height for headerview.
segmentedViewController.headerViewHeight = 250.0

//Set height for segmentview.
segmentedViewController.segmentViewHeight = 60.0

//Set color for selected segment.
segmentedViewController.selectedSegmentViewColor = UIColor.redColor()

//Set color for segment title.
segmentedViewController.segmentTitleColor = UIColor.blackColor()

//Set background color for segmentview.
segmentedViewController.segmentBackgroundColor = UIColor.whiteColor()

//Set shadow for segmentview.
segmentedViewController.segmentShadow = SJShadow.light()

//Set bounce for segmentview.
segmentedViewController.segmentBounces = true

//Set font for segmentview titles.
segmentedViewController.segmentTitleFont = UIFont.systemFontOfSize(14.0)

//Set height for selected segmentview.
segmentedViewController.selectedSegmentViewHeight = 5.0

//Set height for headerview to visible after scrolling
segmentedViewController. headerViewOffsetHeight = 10.0

Change Segment Programmatically

To change segment programmatically, use SJSegmentedViewController func setSelectedSegmentAt(_ index: Int, animated: Bool).

segmentControl.setSelectedSegmentAt(index, animated: true)


Subins Jose, [email protected]


SJSegmentedScrollView is available under the MIT license. See the LICENSE file for more info.

Latest podspec

    "name": "SJSegmentedScrollView",
    "platforms": {
        "ios": "10.0"
    "summary": "Custom segmented header scrollview controller.",
    "requires_arc": true,
    "version": "1.5.0",
    "license": {
        "type": "MIT",
        "file": "LICENSE"
    "homepage": "",
    "authors": {
        "Subins Jose": "[email protected]"
    "source": {
        "git": "",
        "tag": "v1.5.0"
    "source_files": "SJSegmentedScrollView/Classes/*.{swift}",
    "social_media_url": "",
    "frameworks": "UIKit"

Pin It on Pinterest

Share This