Git Product home page Git Product logo

bottomsheet's Introduction

CircleCI Carthage compatible CocoaPods compatible Swift Package Manager compatible

BottomSheet is an implementation of custom modal presentation style for thumb-friendly interactive views anchored to the bottom of the screen.

  • Custom UIViewControllerTransitioningDelegate for dismissable modal bottom sheets
  • BottomSheetView for displaying complementary content as a standard bottom sheet view
  • Expanding bottom sheets with multiple states to transition between
  • Support for automatic view height based on Auto Layout constraints
  • Beatiful spring animation

Demo

Installation

BottomSheet is available through Carthage. Append this line to your Cartfile:

github "finn-no/BottomSheet"

BottomSheet is also available through CocoaPods. To install it, simply add the following line to your Podfile:

pod "FINNBottomSheet", git: "https://github.com/finn-no/BottomSheet.git"

To integrate using Apple's Swift package manager, add the following as a dependency to your Package.swift:

.package(name: "FINNBottomSheet", url: "https://github.com/finn-no/BottomSheet.git", .upToNextMajor(from: "1.0.0"))

Usage

View controller -based presentation:

import FINNBottomSheet

let transitioningDelegate = BottomSheetTransitioningDelegate(
    contentHeights: [.bottomSheetAutomatic, UIScreen.main.bounds.size.height - 200],
    startTargetIndex: 0
)
let viewController = UIViewController()
viewController.transitioningDelegate = transitioningDelegate
viewController.modalPresentationStyle = .custom

present(viewController, animated: true)

View -based presentation:

import FINNBottomSheet

let contentView = UIView()
contentView.backgroundColor = .red

let bottomSheetView = BottomSheetView(
    contentView: contentView,
    contentHeights: [100, 500]
)

// Can be presented in any UIView subclass
bottomSheetView.present(in: viewController.view, targetIndex: 0)

Known limitations

Using .bottomSheetAutomatic:

When using .bottomSheetAutomatic to calculate the content height and your view is constrained using the layoutMarginsGuide, you must be aware that the returned content height may actually be higher than the compressed layout size of your view. Also, it may result in the transition animation freezing. This problem is avoided simply by not using the layoutMarginsGuide.

BottomSheetTransitioningDelegate

To avoid "glitches" you might need to keep a strong reference to the transitioning delegate (BottomSheetTransitioningDelegate) until the bottom sheet animation is complete.

Create new releases

Setup

  • Install dependencies with bundle install (dependencies will be installed in ./bundler)
  • Fastlane will use the GitHub API, so make sure to create a personal access token here and place it within an environment variable called FINN_GITHUB_COM_ACCESS_TOKEN.
    • When creating a token, you only need to give access to the scope repo.
    • There are multiple ways to make an environment variable, for example by using a .env file or adding it to .bashrc/.bash_profile). Don't forget to run source .env (for whichever file you set the environment variables in) if you don't want to restart your shell.
    • Run bundle exec fastlane verify_environment_variable to see if it is configured correctly.
  • Run bundle exec fastlane verify_ssh_to_github to see if ssh to GitHub is working.

Make release

  • Run bundle exec fastlane and choose appropriate lane. Follow instructions, you will be asked for confirmation before all remote changes.
  • After the release has been created you can edit the description on GitHub by using the printed link.

Interesting things

Changelogs

This project has a Gemfile that specify some development dependencies, one of those is pr_changelog which is a tool that helps you to generate changelogs from the Git history of the repo. You install this by running bundle install.

To get the changes that have not been released yet just run:

$ pr_changelog

If you want to see what changes were released in the last version, run:

$ pr_changelog --last-release

You can always run the command with the --help flag when needed.

bottomsheet's People

Contributors

bstien avatar fespinoza avatar hakloev avatar ninarg avatar osanoj avatar robinsalehjan avatar shredlocker avatar torsph avatar vadymmarkov avatar xiao99xiao 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  avatar  avatar  avatar  avatar  avatar  avatar

bottomsheet's Issues

Bottom sheet jumps to top when dismiss.

I basically, only copied the code from the readme

private func showSheet() {
        guard let parentVC = self.parentViewController else {
            return
        }
        let transitioningDelegate = BottomSheetTransitioningDelegate(
            contentHeights: [290, 300],
            startTargetIndex: 0,
            presentationDelegate: self
        )
        let viewController = UIViewController()
        viewController.transitioningDelegate = transitioningDelegate
        viewController.modalPresentationStyle = .custom

        parentVC.present(viewController, animated: true)
    }

and used the delegate like

extension MyView: BottomSheetPresentationControllerDelegate {
    func bottomSheetPresentationController(
        _ controller: UIPresentationController,
        shouldDismissBy action: BottomSheetView.DismissAction
    ) -> Bool {
        return true
    }

    func bottomSheetPresentationController(
        _ controller: UIPresentationController,
        didCancelDismissBy action: BottomSheetView.DismissAction
    ) {

    }

    func bottomSheetPresentationController(
        _ controller: UIPresentationController,
        willDismissBy action: BottomSheetView.DismissAction?
    ) {
    }

    func bottomSheetPresentationController(
        _ controller: UIPresentationController,
        didDismissBy action: BottomSheetView.DismissAction?
    ) {}
}

I'm not sure why it jumps to the top of the parent view controller before dissmiss.

bottomSheet

SPM Cannot read manifest file

Hi

Tried using Swift Package manager to try the sheet.

Seems like the manifest file cannot be parsed.

Swift version: 5.2.4

'init(name:defaultLocalization:platforms:pkgConfig:providers:products:dependencies:targets:swiftLanguageVersions:cLanguageStandard:cxxLanguageStandard:)' is unavailable

Skjermbilde 2021-01-30 kl  14 58 46

[!] Unable to find a specification for `FINNBottomSheet`

[!] Unable to find a specification for FINNBottomSheet

You have either:

  • out-of-date source repos which you can update with pod repo update or with pod install --repo-update.
  • mistyped the name or version.
  • not added the source repo that hosts the Podspec to your Podfile.

How change HandleView?

Could you add the ability to change handleView? color, visible, remove from super view?

Bottomsheet view width issue when calling another view controller

Hi,
There is a situation like this that I can not find the reason.
Call the bottom sheet screen like this and screenshot first:

    private lazy var bottomSheetTransitioningDelegate = BottomSheetTransitioningDelegate(
        contentHeights: [.bottomSheetAutomatic, 200 ],
        startTargetIndex: 0
    )
 let mViewcontroller = destination(.selectAccount) as! AccountListViewController
        mViewcontroller.contentHeight = 200
        mViewcontroller.transitioningDelegate = bottomSheetTransitioningDelegate
        mViewcontroller.modalPresentationStyle = .custom
        present(mViewcontroller, animated: true, completion: nil)

Screen Shot 2021-03-17 at 10 38 03

I call another viewController with the plus button.

      let mViewcontroller = destination(.createAccount) as! NewAccountViewController
        //mViewcontroller.modalPresentationStyle = .fullScreen
        self.present(mViewcontroller, animated: true, completion: nil)

When returning from the newaccount screen with dismiss, the bottom sheet screen looks like this:
Screen Shot 2021-03-17 at 10 29 41

It's okay if I don't call it with fullscreen. But when calling as fullscreen, bottomsheet view width changes and viewDidDisappear method is called.
I could not find the reason, I hope you can help.
Thanks a lot.

dismiss() not work sometimes

Repeat operation present and dismiss (View Controller button),but dismiss sometimes not work,touch other element can't any action,

with example project
in DemoViewController.swift / class ViewController / viewDidLoad() add code

let button = UIButton(frame: CGRect(x: 0, y: 0, width: 50, height: 50) )
button.setTitle("tttt", for: .normal)
button.addTarget(self, action: #selector(self.tttt), for: .touchUpInside)
self.view.addSubview(button)

and function

@objc func tttt() {
    self.dismiss(animated: true, completion: nil)
}

console only show

Will dismiss dismiss by nil
Did dismiss dismiss by nil
Will dismiss dismiss by nil

use ios 14.8.1,iphone SE

I missing something?
Any answer help me.
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.