Giter Club home page Giter Club logo

sjsegmentedviewcontroller's Introduction

SJSegmentedScrollView

CI Status Version License Platform

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.

demo

Highlights

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

Installation

CocoaPods:

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 'https://github.com/CocoaPods/Specs.git'
platform :ios, '9.0'
use_frameworks!

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

Then, run the following command:

$ pod install

Manually:

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

Requirements

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

Communication

  • 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.

Donation

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

paypal

Usage

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
    .instantiateViewControllerWithIdentifier("HeaderViewController")

let firstViewController = storyboard
    .instantiateViewControllerWithIdentifier("FirstTableViewController")
firstViewController.title = "First"

let secondViewController = storyboard
    .instantiateViewControllerWithIdentifier("SecondTableViewController")
secondViewController.title = "Second"

let thirdViewController = storyboard
    .instantiateViewControllerWithIdentifier("ThirdTableViewController")
thirdViewController.title = "Third"

let segmentedViewController = SJSegmentedViewController(headerViewController: headerViewController,
segmentControllers: [firstViewController,
	secondViewController,
	thirdViewController])
  • Present ViewController
self.presentViewController(segmentedViewController, animated: false, completion: nil)
  • Push ViewController
self.navigationController?.pushViewController(segmentedViewController,
                                                          animated: true)
  • Add Child ViewController
addChildViewController(segmentedViewController)
self.view.addSubview(segmentedViewController.view)
segmentedViewController.view.frame = self.view.bounds
segmentedViewController.didMoveToParentViewController(self)

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 => 'https://github.com/subinspathilettu/SJSegmentedViewController.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, etc.

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)

Author

Subins Jose, [email protected]

License

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

sjsegmentedviewcontroller's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

sjsegmentedviewcontroller's Issues

Unable to use a subclass of SJSegmentedViewController outside of IB

Because:

  • public init?(coder aDecoder: NSCoder) is required, so unable to use a custom init() to instantiate a subclass of SJSegmentedViewController() programmatically ; so the workaround is to load the subclassed SJSegmentedViewController from a NIB
  • addSegmentedScrollView() is called in loadView(), and loadView() is not called for views loaded from NIB ; so an ugly workaround for now is to call loadView() in the overrided viewDidLoad()

Thanks for this great lib.

Search Bar on headerViewController

Hi,
Everything is ok with all given UI.But i add searchBar to headerView and i want to search all item in each my two bar LIKE WhatsApp.Chat and Contact.Can you give me any idea about this...
Waiting for your reply.
Thank You

segmentBounces is not having any effect

I am trying to disable the segment bounces by setting it to false, but there is no change to it.

I am actually using SJ in a viewcontroller with back button. Is there a way to have swipe left gesture action syncrhonised with your library scroll view?

Container View getting pushed down if UINavigationBar + Translucent?

I have a UIViewController with a Container View. This Container View contains a UITableViewController.

The UIViewController is embedded in a UINavigationController. I configure the NavigationBar by changing the tint color, the bar tint color and the title text attributes, but when I try to change the translucency I have a problem

UINavigationBar.appearance().isTranslucent = false

When translucent = YES

+---------------------------------+
|                                 |
|     UINavigationBar             |
|                                 |
+---------------------------------+
|                                 |
|                                 |
|                                 |
|                                 |
|                                 |
|    UITableViewController        |
|    in a Contained View          |
|                                 |
|                                 |
|                                 |
|                                 |
|                                 |
|                                 |
+---------------------------------+

when translucent = NO

+---------------------------------+
|                                 |
|     UINavigationBar             |
|                                 |
+---------------------------------+
|                                 |
|blank space created on top of view
|                                 |
+---------------------------------+
|                                 |
|                                 |
|                                 |
|                                 |
|                                 |
|                                 |
|     UITableViewController       |
|     in a Contained View         |
|                                 |
+---------------------------------+

Strange scrolling behaviour when dragging from tableviews

Hi everybody,
I see a strange behaviour when you scroll up.
To replicate this problem you have, in the example app, to:

  • Scroll down a bit, but not enough to pin the segmented view to the top
  • Scroll up again, tapping on the tableview, NOT on the header NOR on the segmented view

If you scroll with the "inertia" you can observe that the scrollingview doesn't acquire the normal "velocity", but it stops instantaneously.
This effect makes the navigation in the section a little weird, you can sense that something is wrong, but it's difficult to figure it out what!!

Missing argument for parameter 'coder' in call

Hello,

I have a menu item that should do select second segment in another ViewController where ProfileGlobalVC is. I tried to do it like:
ProfileGlobalVC().setSelectedSegmentAt(2, animated: true)
Xcode gives an error:

Missing argument for parameter 'coder' in call

Then I tried to do it that way:
in my ProfileGlobalVC I've created a simple func:
func listen() { self.setSelectedSegmentAt(2, animated: true) }
And then tried ProfileGlobalVC().listen()
Still getting the same error:

Missing argument for parameter 'coder' in call

My SJSegmentedViewController code is:

import UIKit
import SJSegmentedScrollView

class ProfileGlobalVC: SJSegmentedViewController, SJSegmentedViewControllerDelegate {

    var selectedSegment: SJSegmentTab?
    
    
    override func viewDidLoad() {
        self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
        self.navigationController?.navigationBar.shadowImage = UIImage()
        self.navigationController?.navigationBar.isTranslucent = false
        
        if let storyboard = self.storyboard {
            
            let headerController = storyboard
                .instantiateViewController(withIdentifier: "profile")
            
            let firstViewController = storyboard
                .instantiateViewController(withIdentifier: "offersTable")
            firstViewController.title = "Offers"
            
            let secondViewController = storyboard
                .instantiateViewController(withIdentifier: "fave")
            secondViewController.title = "Favourites"
            
            let thirdViewController = storyboard
                .instantiateViewController(withIdentifier: "settings")
            thirdViewController.title = "Settings"
            
            headerViewController = headerController
            segmentControllers = [firstViewController,
                                    secondViewController,
                                    thirdViewController]
            headerViewHeight = 180
            selectedSegmentViewHeight = 1.0
            segmentTitleColor = .gray
            selectedSegmentViewColor = .black
            segmentShadow = SJShadow.light()
            delegate = self
            
        }
        segmentViewHeight = 50
        title = "Segment"
        super.viewDidLoad()
}

In IB Controller, Segments disappear under a Translucent Navigationbar

If using Interface Builder for the SJSegmentedViewController, embedded in a translucent NavigationBar, then the segments will scroll under the navigationBar to the top of the screen, when they should stop at the bottom of that translucent navigation bar. If you use an opaque NavigationBar, the segments will show correctly as the main view is not extended under the navbar.

So it seems the control doesn't handle the case of a translucent NavigationBar that extends the view to always make segments visible when scrolling

Unable to access navigationbar

Hi,

Thanks for the module, it helped me a lot. I'm running into issue where if i try to transit to other view controller with navigationController?.pushViewController(nextViewController(), animated: true), it's returning navigationController as nil. Could please let me know how can I access navigationController??

Thanks

Color isn

Following code isn't making changes to my segmentedController...

segmentController.segmentBackgroundColor = UIColor.clear
segmentController.segmentShadow = SJShadow.light()
segmentController.selectedSegmentViewColor = UIColor.red

Very Simple Compiling error when adding manually

When adding your control manually, your component won't compile
In SJSegmentTab.swift, you use :
import Foundation

Where it should be, like other files, as you use uikit controls :
import UIKit

Just changing that resolves the issue

How to set selected title

hy sir i am using your library its great ,
but i want ask how do change segmented title when selected

can i create this segment view as dynamic ??/

i need to create the swipeable segment view like you but that viewcontroller and its title should be come as fully dynamically ??? can i do that?
Please tell is it possible in this or if you can!!!!

Observer register Issue

Hello,
I have just integrated your library.
When I alloc first time, it works proper. Then I change root view controller of window for logout.
Then I again login and change root view controller to the SJSegmentedViewController.
It says
"An instance 0x7fa0e38b5600 of class UICollectionView was deallocated while key value observers were still registered with it."

I have collection view in my class So I have implemeted as per your doc to observer the scrolling
extension HomeVC: SJSegmentedViewControllerViewSource {

func viewForSegmentControllerToObserveContentOffsetChange(controller: UIViewController,
                                                          index: Int) -> UIView {
    return self.clcView
}

Let me know the solution because I am in hurry.
Thanks.

it crashes index segments tab error in swift 2.3

I use this framework at tabor controller
It works well, but one thing is disable and crash app
when i use tabbar controller which has controllers three and five view controller each other(second view, third view)
first, tab third view and click segment third button and return my second view
and I touched five or four segment button suddenly crashed index error
I found it at SJSegmentedViewController initial problem at nsnotification
but, i can't fix it from now on...
thank you for this framework in use, I will hope this error fixed well soon ....
how can i fix it?

view controllers not appearing

ive tried several ways for the view controllers to appear and no luck. i manually added the files and have no issues with the pods. no need to import. please help.

ive used...

ViewController.swift

func getSJSegmentedViewController() -> SJSegmentedViewController? {

    if let storyboard = self.storyboard {
        
        let firstViewController = storyboard
            .instantiateViewControllerWithIdentifier("fVC")
        firstViewController.title = "first"
        
        let secondViewController = storyboard
            .instantiateViewControllerWithIdentifier("sVC")
        secondViewController.title = "second"
        
        let thirdViewController = storyboard
            .instantiateViewControllerWithIdentifier("tVC")
        thirdViewController.title = "third"
        
        segmentedViewController.segmentControllers = [firstViewController,
                                                       secondViewController,
                                                       thirdViewController]
        
        segmentedViewController.headerViewHeight = 450.0
        segmentedViewController.segmentViewHeight = 160.0
        
        segmentedViewController.selectedSegmentViewColor = UIColor.darkGrayColor()
        segmentedViewController.segmentTitleColor = UIColor.blueColor()
        
        segmentedViewController.segmentBackgroundColor = UIColor.lightGrayColor()
        segmentedViewController.segmentShadow = SJShadow.dark()
        segmentedViewController.segmentTitleFont = UIFont.boldSystemFontOfSize(14.0)
        
        segmentedViewController.delegate = self
        
        return segmentedViewController
    }
    
    return nil
}



 func addSJSegmentedChildViewController() {
    
    let viewController = getSJSegmentedViewController()
    
    if viewController != nil {
        addChildViewController(viewController!)
        self.view.addSubview(viewController!.view)
        viewController!.view.frame = self.view.bounds
        viewController!.didMoveToParentViewController(self)
        
        
    }
}

extension ViewController: SJSegmentedViewControllerDelegate {

func didMoveToPage(controller: UIViewController, segment: SJSegmentTab?, index: Int) {
    
    if segmentedViewController.segments.count > 0 {
        
        if controller is ViewController{
            print(" ViewController")
        }
        print("Selected tab")
    }
        
        let tab = segmentedViewController.segments[index] as? SJSegmentTab
        tab?.titleColor(UIColor.darkGrayColor())
        
    }
    
}

other viewcontrollers: (3)

extension fViewController: SJSegmentedViewControllerViewSource {

func viewForSegmentControllerToObserveContentOffsetChange(controller: UIViewController,
                                                          index: Int) -> UIView {

return view

}

}

Adding Manually problem

Hi

I added SJSegmentedScrollView folder to my project

ekran resmi 2017-07-29 08 57 54

I had error for this line of code ;
import SJSegmentedScrollView

No such module 'SJSegmentedScrollView'

What can I do? I do not do anything.

Cannot build with version 1.2.1 without changing to lower version

HI,

Thank you for your useful library.

I've used your library from old version, and upgraded my product to support swift 3.0.
But I can't build with version 1.2.1, because deployment target become iOS10.0.
My product support iOS9.3 and over, so I have changed iOS Deployment Target in project setting of Pods from iOS10.0 to iOS9.3.

Can you change deployment target to iOS9.3? Is there a problem?

Thanks.

Does it support iOS8?

It says in the requirements: iOS 8.0+, Swift 2.3+.
However, the minimum platform has to be '9.0' to install via CocoaPods.
Does it not support iOS 8?

Height Issues

setting the frame of segmentViewController like below fits the screen
segmentedViewController.view.frame=CGRect(x:0,y:1,width:segmentedViewController.view.frame.size.width,height:segmentedViewController.view.bounds.size.height)

setting the frame to self.view.bounds pushes the view down.Please help

pod is not supported

Please find below the issues
Analyzing dependencies
Fetching podspec for SJSegmentedScrollView from 1.3.5
[!] No podspec found for SJSegmentedScrollView in 1.3.5

View controller not reloading !

My requirement is like I have to add categories dynamically from API . Using single view controller as an instance am creating the segment controllers . Stuck with loading API based on category Id as the view will appear or view did load method is not getting called on view controller.
Kindly guide me to solve this issue please. Urgent.

How i set the image on the segmented tab bar instead of title?

I try to set image on tab bar, but it won't come

Its come like this
simulator screen shot 16 nov 2016 13 28 25

I tried this code in the below function
firstViewController.tabBarItem.image = UIImage(named: "1-1.png")

func getSJSegmentedViewController() -> SJSegmentedViewController? {

    if let storyboard = self.storyboard {
        
        let headerViewController = storyboard
            .instantiateViewController(withIdentifier: "HeaderViewController1")
        
        let firstViewController = storyboard
            .instantiateViewController(withIdentifier: "FirstTableViewController")
        //firstViewController.title = "Table View"
        **firstViewController.tabBarItem.image = UIImage(named: "1-1.png")**

Layout on rotation

The method willTransition doesn't work, collection view inside is a mess on rotation.

override func willTransition(to newCollection: UITraitCollection, with coordinator: UIViewControllerTransitionCoordinator) {
        collectionViewLayout.invalidateLayout()
    }

Funny height Issues

Hey

I have set up the view controller as per the instructions, but I am getting some funny issues with the height.

This is my view from the debugging state. As you can see the SJSegmentedView doesn't extend to the navigation bar or to the tab bar.

how to hide SJSegmentedViewController

I am trying to hide SJSegmentVC when the first view loads,
segmentedViewController.view.hidden = false
when i press the button, I used segmentedViewController.view.hidden = false

can you please assist or direct? usually pagecontrollers have this ability... not sure if this does too?

How to change start segment when viewDidLoad not using setSelectSegmentAt(_:,animated:)

When I need to change start_index of segmentController(container),

I use this code

var start_index : Int?
if start_index == 0{
         setSelectedSegmentAt(start_index, animated: true)
    }
    else if start_index == 1 {
        setSelectedSegmentAt(start_index, animated: true)
    }
    else if start_index == 2{
        setSelectedSegmentAt(start_index, animated: true)
    }

Above code is showing segment move animation when viewDidLoad(segmentController(container)).
But, I want to not showing movement animation when viewDidLoad(segmentController(container))

How can I do this?

Turning off bounce effect breaks scrolling

Hello! It seems, that if I turn off bounce in my scrollview (in separate VC for segment), then scrolling vertically the whole view (with the header and segmentedScrollview) doesn't work properly even if I add a custom view to observe content offset change

Custom view for all tabs view

Hi

I want to make the background color of the tabs view to be gradient, how can i set one custom view for all the tabs

Thanks

Change Unselected TitleColor

When i select title it change color.But When i select next title previous color remains same.How to change that one title color?Please Reply ASAP

Tabs not showing up when upgrading from 1.3.3 to 1.3.5

I am using Pod in my project and I was previous using version 1.3.3... Earlier today I upgraded to 1.3.5 and after a "Clean" build and rebuilding the app everything compile fine and no error and no new warning... so far so good... until I run my application where the 3 tabs that should be showing up are gone!

My code is initialized:

        self.segmentedScrollViewController = SJSegmentedViewController(headerViewController: nil, segmentControllers: controllersForSegment)

and obviously my controllersForSegment object is a simple array of 3 custom subclass of UIViewController. Again no code change in my case except the upgrade to 1.3.5

After seeing that, since I was under deadline I simply reverted to 1.3.3 and everything went back to normal.

3 doubts not issues

how can i set different height for different view controllers in segments and how to diable scroll bar visibility and also is there amy way i can stick a view from header view controller at top instead of the segment bar

xcode 8.3 swift 3 warning

@subinspathilettu
there is a warning in the latest xcode.

SJSegmentedScrollView.swift:297:29: Forced cast from '[NSKeyValueChangeKey : Any]?' to '[NSKeyValueChangeKey : AnyObject]' only unwraps and bridges; did you mean to use '!' with 'as'?

let changeValues = change as! [NSKeyValueChangeKey: AnyObject]

Limitation

If i have to load this ViewController using
self.presentViewController(segmentedViewController, animated: false, completion: nil)
this is a big limitation, because for example, if i want to use it in a UITabBarViewController i wont be able to do it, because this will be presented over the TabBar.

API to select the segment to display

Great project! So thanks for open sourcing it.
Quick question: I looked at the API but I can't seem to find a way for selecting the segment I would like to display.
Imagine the case where depending on the action the user did in a previous ViewController, when the SJSegmentViewController is shown, I need to show the 2nd or 3rd segment when it appears on screen. Right now the default behavior is always to show the first segment, but I would like to be able to specify something like:
self.segmentedViewController.selectedSegmentIndex = 2

and when it goes on screen, it is automatically showing the proper segment.
thanks

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.