Code Monkey home page Code Monkey logo

ctslidinguppanel's Introduction

iOS-CTSlidingUpPanel

Version License Platform

Transforms any view to sliding panel

Panel supports Anchor points, TabBarController and NavigationController, also it has basic TableView support.

Cocoapods

Swift 4.2

Add following to your Podfile:

pod "CTSlidingUpPanel"

Swift 4.0

pod "CTSlidingUpPanel", '~> 1.0.4'

How to Import

Make sure to build and clean the project:

import CTSlidingUpPanel

Objective C - support

Starting from Version 1.2.0 you can use this library in Objective C projects.

To do this first add: use_frameworks! - in your podfile. Run pod install and build the project.

To import in Objective C class use:

@import CTSlidingUpPanel;

Example of constructor in Objective C:

[[CTBottomSlideController alloc] initWithParent:self.view bottomView:_testView tabController:nil navController:nil visibleHeight:20];

Manual Setup instructions

  1. Download this repository
  2. Copy files from lib folder to your project.
  3. Should be done.

How to use

You can view example project to better understand how stuff works.

But here are basic steps with Storyboard:

  1. Drag any View(Or Container View) to the parent view. DO NOT give this view any constraints.

  2. Create outlet of the view you wish to use as bottom panel

After that in your ViewController:

    @IBOutlet weak var bottomView: UIView!
    var bottomController:CTBottomSlideController?;
    

    override func viewDidLoad() {
        super.viewDidLoad()
        //You can provide nil to tabController and navigationController
        bottomController = CTBottomSlideController(parent: view, bottomView: bottomView, 
                        tabController: self.tabBarController?,
                        navController: self.navigationController, visibleHeight: 64)
        //0 is bottom and 1 is top. 0.5 would be center                
        bottomController?.setAnchorPoint(anchor: 0.7)
    }
    
    ///Added in Version: 1.1.0 - To support Screen orientation changes!
    override func viewWillTransition(to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator) {
        super.viewWillTransition(to: size, with: coordinator)
        bottomController?.viewWillTransition(to: size, with: coordinator)
    }
    

And done, view you provided to bottomView should slide up and down.

You can do same without Storyboards. Add new subview to your parent and then provide that subview to CTBottomSlideController. It is recomended that you don't give that subview any constraints.

In case you want custom width/position of sliding panel

In this case you should set: Top, Height and other constraints that you want(But don't set the bottom one) to the SlidingView and then use this initializer:

bottomController = CTBottomSlideController(topConstraint: slidingPanelTopConstraint, 
                                            heightConstraint: slidingPanelHeightConstraint, 
                                            parent: view, 
                                            bottomView: bottomView, 
                                            tabController: self.tabBarController!, 
                                            navController: self.navigationController, 
                                            visibleHeight: 64)

It is IMPORTANT that you don't set the bottom constraint of the sliding view or the sliding view will start resizing and that may affect performace.

iPhone X Safe Area support

  1. Take a Sliding View(View you provided to CTBottomSlideController) and wrap it in a generic UIView.
  2. Enable Clip to Bounds on the wrapper View
  3. Set any constraints you want to that wrapper view, place it anywhere resize it as much as you want.
  4. After that in CTBottomSlideController initializer provide that wrapper as a parrent view instead of root view.
//This is a wrapper view
@IBOutlet weak var parentView: UIView!

//In viewDidLoad() or something
parentView.clipsToBounds = true;
bottomController = CTBottomSlideController(parent: parentView/*instead of view*/, bottomView: bottomView, 
                        tabController: self.tabBarController!,
                        navController: self.navigationController, visibleHeight: 64)

Getting events from Sliding Controller

There are 2 ways of doing this. One is with delegation and other is by using closures.

Delegation:

  1. Add this to your ViewController
   class ViewController: UIViewController, CTBottomSlideDelegate
   {...}
  1. Set viewcontroller as a delegate
   bottomController?.delegate = self;
  1. Implement following methods
  func didPanelCollapse();
  func didPanelExpand();
  func didPanelAnchor();
  func didPanelMove(panelOffset: CGFloat);

Closures:

 bottomController?.onPanelExpanded = {
      print("Panel Expanded in closure")
 }
        
 bottomController?.onPanelCollapsed = {
      print("Panel Collapsed in closure")
 }
        
 bottomController?.onPanelAnchored = {
      print("On Panel anchored")
 }
        
 bottomController?.onPanelMoved = { offset in
      print("Panel moved in closure " + offset.description)
 }

Methods and Other stuff

Use this if you want sliding panel to slide up or down depending on ScrollViews offset:

func set(collectionView: UICollectionView)
func set(scrollView: UIScrollView)
func set(table:UITableView)

You can use set(scrollView: UIScrollView) for any type of scrollview. In reality other methods just call this one

Use this if you want to specify how far up sliding panel should go

func setExpandedTopMargin(pixels: CGFloat)

Use these to programatically change panels state

func expandPanel();
func anchorPanel();
func closePanel();
func hidePanel();
func setSlideEnabled(bool) // Enable or disable sliding

Use this to check panels state

bottomController?.currentState 

State can be

.collapsed
.expanded
.anchored
.hidden

ctslidinguppanel's People

Contributors

andriadze avatar josephdalughut avatar ruslanmikailov avatar

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

ctslidinguppanel's Issues

Wrong height in NavigationbarController when edgesForExtendedLayout = UIRectEdgeNone

I'm using Objective C. When my ViewController in NavigationbarController has

self.edgesForExtendedLayout = UIRectEdgeNone;

Your library calculates wrong height of bottom view because It gets view frame height minus navigationbar height and status bar height

I think you can improve your library by checking edgesForExtendedLayout for calculate height of bottom view

Controller not respecting top and height constraints

Thanks for the library. I'm using it in two area of my app. The first is working perfectly, the second is not respecting the top/height constraints. In my view controller I have added a view and set the left, right, top, and height constraints (not bottom). Height constraint is set to 400. Top is set to master view top + 100 (master view top is safe area).

I reference the view and it's constraints with:

@IBOutlet var bottomView: UIView!
@IBOutlet var topConstraint: NSLayoutConstraint!
@IBOutlet var heightConstraint: NSLayoutConstraint!

Then I init the bottomController with:

bottomController = CTBottomSlideController(topConstraint: topConstraint, heightConstraint: heightConstraint, parent: view, bottomView: bottomView, tabController: nil, navController: nil, visibleHeight: 250)

but the view still opens all the way to top of screen. Any help is appreciated!

Can you set multiple anchors?

I was just wondering if there was a way to set the anchor at two points. So it can slide up to like .45 and then to .75. Is this possible?
Thanks

Swift 3

Can this be used with Swift 3?

How do I use collection view as bottom view

You can ask pretty much anything regarding this library. I will try to answer as quick as I can.

Please while creating a new issue try to be as specific as possible. Describe issue as best as you can.
If applicable, please provide code of what is not working properly.

Is it support Objc project?

You can ask pretty much anything regarding this library. I will try to answer as quick as I can.

Please while creating a new issue try to be as specific as possible. Describe issue as best as you can.
If applicable, please provide code of what is not working properly.

Sliding Panel + Embeded Container View + PageViewcontroller

Hi,

I have implemented the sliding panel in the container view. in container view having page view controller. page view controller having three view controllers.

My issue is : When I sliding up on the first view controller it is working fine, but when i scroll to next view controller then sliding up it is not working. (some times its works but struck in the gesture).

please provide your support to fix this issue

thanks

Panel sliding too high

Hi there!

I have a basic UIViewController embedded in a UINavigationController, in turn embedded in a UITabBarController. The siding panel is displaying correctly above the tab bar.

However, when I expand the panel, it slides up under the top navigation bar. I'd like it to stop once it reached the bottom of the bar.

I've confirmed that the panel's parent view does not extend beyond the top nav bar (I have the options "Under Bottom Bars," and "Under Top Bars" disabled in the "Extend Edges" section of interface builder). Looking at the exploded view in the interface debugger shows the parent view, which is the main view in the controller, does not extend above the nav bar, yet it shows that the panel does.

Any help you could provide would be great!

CTSlidingUpPanel over MapView question...

Hello,

I was wondering if you have had any issues with a CTSlidingUpPanel over a MapView?

I have a ViewController with a MKMapView. In ViewDidLoad I am creating a CTSlidingUpPanel, but when the map is done rendering any touches not the CTSlidingUpPanel moves the map and thus does not allow the panel to be pulled up.

I know this is slightly old, but if you have any idea why I may be having this issue I wold appreciate it.

Compatablity With UITableView Editing

it is impossible to edit UITableview items (reorder specifically) as the library keeps continually snatching the touch event away from the UItableview.

Other than that, It's dope!

Thread 1: Fatal error: Unexpectedly found nil while unwrapping an Optional value

I just try this method for my application , but i have one issue in bottomController
my error is

bottomController CTSlidingUpPanel.CTBottomSlideController? nil none
this is my code
import UIKit
import CTSlidingUpPanel
class ViewController: UIViewController, CTBottomSlideDelegate {

@IBOutlet weak var bottomView: UIView!
var bottomController:CTBottomSlideController?


override func viewDidLoad() {
    super.viewDidLoad()
    bottomController = CTBottomSlideController(parent: view, bottomView: bottomView, tabController: self.tabBarController!, navController: self.navigationController, visibleHeight: 64)
    
    
    bottomController?.setAnchorPoint(anchor: 0.7)
    bottomController?.delegate = self;
    
    bottomController?.onPanelExpanded = {
        print("Panel Expanded in closure")
    }
    
    bottomController?.onPanelCollapsed = {
        print("Panel Collapsed in closure")
    }
    
    bottomController?.onPanelMoved = { offset in
        print("Panel moved in closure " + offset.description)
    }
    
    //Uncomment to specify top margin on expanded panel
    //bottomController?.setExpandedTopMargin(pixels: 100)
    
    if bottomController?.currentState == .collapsed
    {
        //do anything, i don't care
    }
}

override func viewWillTransition(to size: CGSize, with coordinator: UIViewControllerTransitionCoordinator) {
    super.viewWillTransition(to: size, with: coordinator)
    bottomController?.viewWillTransition(to: size, with: coordinator)
}

override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
}

func didPanelCollapse()
{
    print("Collapsed");
}
func didPanelExpand(){
    print("Expanded")
}
func didPanelAnchor(){
    print("Anchored")
}

func didPanelMove(panelOffset: CGFloat)
{
    print(panelOffset);
}

}

How can i solve this

Fatal error: initialTouchLocation = nil

When I pull up in CTBottomSlideController on 301 lines an error: "Thread 1: Fatal error: Unexpectedly found nil while unwrapping an Optional value".

What could be the problem?

iPhone X support

I have a few problems with iPhone X:

  1. The visibleHeight is not equal to the actual height you expect to see on iPhone X
  2. When we pull the maximum, the container goes higher than it should
  3. I have read your recommendations on how to optimize iPhone X, but they do not help me. What can I do wrong?
  4. If I even limit parentView from below to safeArea, then when I hide the tabBar parentView, it still becomes at the very bottom of the screen.

The problem can be reproduced and seen here.
CTSlidingUpPanel-master.zip

Issue when orientation changes

Hi,
First of all thank you very much for the effort you have put in to this project.

I came across this issue. When we change the orientation bottom slider is not resetting its initial screen values. Because of that, when I go from portrait to landscape, the bottom panel disappears.

How can I overcome this?

Is there a way to re init the view when orientation changes?

Thank you

Unnecessary top margin after setting table view.

Hi, your repository found very useful for me. There is only one problem after setting table view as Panel's view and I'm trying to figure what did I do wrong and i thought you can help me :).

Please check the following gif:
https://im4.ezgif.com/tmp/ezgif-4-823a43ee9124.gif
My CTSlidingUpPanel contains tableview inside. there is unnecessary margin between the first cell and Panel's top. After I collapsed and and expended to the first state, the unnecessary margin has been gone. There is something I did wrong?

Here is my implementation for your slider using Protocol Extension for UIViewController.

untitled 2

Thanks, Tal.

How can I gain access to SlidingView

I need to change tableView.isScrollEnabled from one of the functions like didPanelCollapse(). So How can I do this? When I try to use delegate tableView in SlideController is nil.

iPhone X Support

Hi there, is there a way we can make the bottom view slide up from the safe area of the view and not from the bottom of it? I've tried to setting up the bottom constraint of the bottom view but this is not recommended on the readme.

Sliding Panel + TableView

Hi,

I subclassed the "Pull this up or down" view controller and added a table view below the "Pull this up or down" label. How can I set the table view using the public func set(table:UITableView) of the slide controller?

Thank you very much

Maximum height?

Hi there! Thank you very much for the library! It's a near-perfect fit for my project. I'd like to ask if there's a way to limit the height that the view can expand to.

Enable build with Carthage

Hi,

while trying to add this repository and build it with Carthage, I got the following error:

Dependency "CTSlidingUpPanel" has no shared framework schemes for any of the platforms: iOS

Webview inside sliding view

I need to use webview inside sliding view, but the scrollable content out of the parentviews bounds is not drawn.
To fix that I guess the solution is to access the slider scrollview delegate and force webview to redraw itself.
How can I access scrollview to delegate it's methods to my viewcontroller or do you know any other fix for the issue?

Add bottom margin/padding to sliding view

Hi,

I want to have the slider starting from 128px above the bottom line of the screen.
Another option is to position the sliding view above another view but as constraint's are not allowed, I can't do that.

My slider's visible height is always 0 and I'm using WKWebView as the slider content.
I will control slider closing/hiding always from code.
Bottom of the slider view should be another view's top (slider is behind that view) or 128 pixels from bottom of the screen (it's the height of that "another view")

CTSlidingUpPanel` does not specify a Swift version

Hi
i want to add the pod in my objective C project but below error is coming

  • CTSlidingUpPanel does not specify a Swift version and none of the targets (UCSApp) integrating it have the SWIFT_VERSION attribute set. Please contact the author or set the SWIFT_VERSION attribute in at least one of the targets that integrate this pod.

Kindly help

Set Sliding Menu to Collapsed Position

Hello,

its great pod and fulfil my all needs,
now I want to put back sliding menu to collapse positions with button, is it possible? I cant not find anything?

Sliding Panel + Embeded Container View + Scroll View

Please provide some samples how to use scroll view in slide panel, how to use top constraints.

the issue is when I move the slide panel up, it is went into the full screen then it cannot be moved down.

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.