Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Shari

nakajijapan
February 08, 2017

 Shari

Kyobashi.swift x AKIBA.swift 合同勉強会
https://kyobashi-swift.connpass.com/event/48794/

nakajijapan

February 08, 2017
Tweet

More Decks by nakajijapan

Other Decks in Technology

Transcript

  1. ,ZPCBTIJTXJGUY",*#"TXJGU
    !OBLBKJKBQBO
    Shari
    minneʹಋೖͯ̍͠೥

    View full-size slide

  2. AKIBA.swift
    Kyobashi.swift
    Shibuya.swift

    View full-size slide

  3. @nakajijapan
    GMO PEPABO inc.
    Principal Engineer
    iOS / Web / OS X
    About Me
    Daichi Nakajima

    View full-size slide

  4. ϋϯυϝΠυ࡞඼Λ
    ചΕΔɺങ͑Δɻ
    ࠃ಺࠷େڃͷ
    ϋϯυϝΠυϚʔέοτ

    View full-size slide

  5. NKJMultiMovieCaptureView
    NKJMovieComposer
    NKJPagerViewController
    PhotoSlider
    Teiten
    GitHub
    Sengiri
    Shari
    frustration.me
    Kazaguruma

    View full-size slide

  6. ࣷར
    • ਣ൧
    • ωλͷҾཱ͖ͯ໾

    View full-size slide

  7. What is Shari?

    View full-size slide

  8. UI Component
    IUUQTHJUIVCDPNOBLBKJKBQBO4IBSJ

    View full-size slide

  9. Why
    • Χʔτͷࡏݿมߋ
    • UIPickerViewΛར༻͍ͯͨ͠
    • ૢ࡞͕̍εςοϓ஗͍
    • தԝ഑ஔ͕ετϨε

    View full-size slide

  10. Why
    • Χʔτͷࡏݿมߋ
    • UIPickerViewΛར༻͍ͯͨ͠
    • ૢ࡞͕̍εςοϓ஗͍
    • தԝ഑ஔ͕ετϨε
    ࡏݿมߋʹ̍ɺ͕̎΄ͱΜͲ

    View full-size slide

  11. ղܾ͍ͤͨ͞

    View full-size slide

  12. Want
    • UIPickerViewͷ୅ସ
    • ͳΔ΂͘؆୯ʹ
    • େྔͷࡏݿΛબ୒͢ΔϢʔβ΋ߟྀ

    View full-size slide

  13. UIPercentDrivenInte
    ractiveTransition

    View full-size slide

  14. UIPercentDrivenInteractiveTransition
    • Interactively control view controller
    • Percent Driven
    • update(_:), cancel(), finish()
    • Using gesture recognizger
    $MBTT
    IUUQTEFWFMPQFSBQQMFDPNSFGFSFODFVJLJUVJQFSDFOUESJWFOJOUFSBDUJWFUSBOTJUJPO

    View full-size slide

  15. UIViewControllerAni
    matorTransitioning

    View full-size slide

  16. UIViewControllerAnimatorTransitioning
    • Custom ViewController Transition
    • Define how animation you want to make
    1SPUPDPM

    View full-size slide

  17. Problem
    • ࠷ॳ͔Β࠷ޙ·Ͱͷදݱ͔͠Ͱ͖ͳ͍
    • ్தͷUIͷ੍ޚ͕ೖΕΒΕͳ͍

    View full-size slide

  18. Implementation
    • Using Container View Controller

    View full-size slide

  19. Implementation
    modalNavigationController.parentNavigationController = navigationController
    navigationController?.si.presentViewController(
    toViewController: modalNavigationController
    )
    • Call Customized Container View Controller

    View full-size slide

  20. Implementation
    func presentViewController(toViewController:UIViewController) {
    toViewController.beginAppearanceTransition(true, animated: true)
    ModalAnimator.present(toView: toViewController.view, fromView: parentTargetView)
    { [weak self] in
    guard let strongSelf = self else { return }
    toViewController.endAppearanceTransition()
    toViewController.didMove(toParentViewController: strongSelf.base)
    }
    let tapGestureRecognizer = UITapGestureRecognizer(target: base, action:
    #selector(UINavigationController.overlayViewDidTap(gestureRecognizer:)))
    let overlayView = ModalAnimator.overlayView(fromView: parentTargetView)
    overlayView!.addGestureRecognizer(tapGestureRecognizer)
    }

    View full-size slide

  21. Implementation
    func presentViewController(toViewController:UIViewController) {
    toViewController.beginAppearanceTransition(true, animated: true)
    ModalAnimator.present(toView: toViewController.view, fromView: parentTargetView)
    { [weak self] in
    guard let strongSelf = self else { return }
    toViewController.endAppearanceTransition()
    toViewController.didMove(toParentViewController: strongSelf.base)
    }
    let tapGestureRecognizer = UITapGestureRecognizer(target: base, action:
    #selector(UINavigationController.overlayViewDidTap(gestureRecognizer:)))
    let overlayView = ModalAnimator.overlayView(fromView: parentTargetView)
    overlayView!.addGestureRecognizer(tapGestureRecognizer)
    }
    ൒෼͚ͩදࣔ͢ΔΞχϝʔγϣϯ

    View full-size slide

  22. Transition
    Background
    option

    View full-size slide

  23. Implementation
    public class ShariNavigationController: UINavigationController {
    func handlePanGesture(gestureRecognizer: UIPanGestureRecognizer) {
    (..snip..)
    case .changed:
    var frame = view.frame
    frame.origin.y += degreeY
    frame.size.height += -degreeY
    view.frame = frame
    ModalAnimator.transitionBackgroundView(
    overlayView: backgroundView, location: location)
    (..snip..)
    • Get frame using UIPanGestureRecognizer

    View full-size slide

  24. Implementation
    public class func transitionBackgroundView(overlayView: UIView, location:CGPoint) {
    let screenShotView = ModalAnimator.screenShotView(overlayView: overlayView)
    let scale = self.map(
    value: location.y, inMin: 0, inMax: UIScreen.main.bounds.height, outMin: 0.9, outMax: 1.0)
    let transform = CATransform3DMakeScale(scale, scale, 1)
    screenShotView.layer.removeAllAnimations()
    screenShotView.layer.transform = transform
    screenShotView.layoutIfNeeded()
    }
    • Transition in real time
    5SBOTGFSBNPVOUPGNPWFNFOU
    (FU*NBHF

    View full-size slide

  25. Conclusion
    • ؆୯ʂʁ
    • ঢ়گΛ఻͑ͯϑΟʔυόοΫΛఏڙͰ͖Δ
    • ίϯςΩετΛҡ࣋Ͱ͖Δ
    • ϛεΛࣄલʹ๷͛Δ

    View full-size slide

  26. Conclusion
    • minneͷσβΠϯίϯϙʔωϯτͷҰͭ
    • Χʔτ - ࡏݿมߋ
    • ചΕͨ΋ͷ - ߜΓࠐΈ
    • ࡞඼ը໘ - Φϓγϣϯબ୒

    View full-size slide