Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Functional programming for UI
Search
Teddy Ku
November 14, 2018
Programming
1
2.6k
Functional programming for UI
Turn the pyramid of doom into a line of happiness
Teddy Ku
November 14, 2018
Tweet
Share
More Decks by Teddy Ku
See All by Teddy Ku
Concurrency in Swift
tkuichooseyou
2
2.3k
ReactiveSwift
tkuichooseyou
0
78
Other Decks in Programming
See All in Programming
CSC509 Lecture 05
javiergs
PRO
0
190
Vitest Browser Mode への期待 / Vitest Browser Mode
odanado
PRO
1
1.4k
CSC305 Lecture 13
javiergs
PRO
0
110
Програмиране с Rust, ФМИ, 2024
nikolads
0
130
Why I Choose NetBeans for Jakarta EE
ivargrimstad
0
930
推し活としてのrails new/oshikatsu_ha_iizo
sakahukamaki
1
330
A Journey of Contribution and Collaboration in Open Source
ivargrimstad
0
1.3k
レイトレ合宿10 レンダラー紹介 / Renderer Introduction, Ray Tracing Camp 10
shocker_0x15
0
640
LangChain & LangServeでAPIを爆速作成
kijitorabuti
2
370
ML-прайсинг_на_Lamoda__вошли_и_вышли__приключение_на_20_минут__Слава_Цыганков.pdf
lamodatech
0
410
フロントエンドの現在地とこれから
koba04
10
4.7k
組織に自動テストを書く文化を根付かせる戦略(2024秋版) / Building Automated Test Culture 2024 Autumn Edition
twada
PRO
9
3.9k
Featured
See All Featured
Typedesign – Prime Four
hannesfritz
39
2.4k
How to Think Like a Performance Engineer
csswizardry
18
1k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Music & Morning Musume
bryan
46
6.1k
Into the Great Unknown - MozCon
thekraken
31
1.4k
Reflections from 52 weeks, 52 projects
jeffersonlam
346
20k
How to train your dragon (web standard)
notwaldorf
88
5.6k
We Have a Design System, Now What?
morganepeng
50
7.2k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
31
2.6k
Code Review Best Practice
trishagee
64
17k
Designing the Hi-DPI Web
ddemaree
280
34k
Git: the NoSQL Database
bkeepers
PRO
425
64k
Transcript
Teddy Ku 'VODUJPOBMQSPHSBNNJOHGPS6*
2 Copyright © Merpay, Inc. All Rights Reserved. 5FEEZ,V !ULVJDIPPTFZPV
!ULVJDIPPTFZPV 4UBUVT
3 Copyright © Merpay, Inc. All Rights Reserved. 'FBUVSF 0OCPBSEJOHUVUPSJBMT
4 Copyright © Merpay, Inc. All Rights Reserved. 'FBUVSF 0OCPBSEJOHUVUPSJBMT
5 0OCPBSEJOHUVUPSJBMT Copyright © Merpay, Inc. All Rights Reserved.
6 Copyright © Merpay, Inc. All Rights Reserved. class BalloonView:
UIView { var onTapped: (() -> Void)? var contentView: UIView func show() { /* ... */ } func dismiss() { /* ... */ } /* ... */ }
7 Copyright © Merpay, Inc. All Rights Reserved. class ViewController:
UIViewController { func showTutorialFlow() { let tutorialOne = tutorialOneBalloonView() let tutorialTwo = tutorialTwoBalloonView() let tutorialThree = tutorialThreeBalloonView() tutorialOne.onTapped = { [weak tutorialOne] in tutorialOne?.dismiss() tutorialTwo.show() } tutorialTwo.onTapped = { [weak tutorialTwo] in tutorialTwo?.dismiss() tutorialThree.show() } tutorialThree.onTapped = { [weak self, weak tutorialThree] in tutorialThree?.dismiss() self?.hideGrayOverlay { } } showGrayOverlay { tutorialOne.show() } }
8 Copyright © Merpay, Inc. All Rights Reserved. class ViewController:
UIViewController { func showTutorialFlow() { let tutorialOne = tutorialOneBalloonView() let tutorialTwo = tutorialTwoBalloonView() let tutorialThree = tutorialThreeBalloonView() %PO`UXBOUUPJOTUBOUJBUFFWFSZUIJOHVQGSPOU 0OMZOFFEPOFWJFXBUBUJNF
9 Copyright © Merpay, Inc. All Rights Reserved. 3FXSJUFPOFWJFXBUBUJNF
class ViewController: UIViewController { func showTutorialFlow() { let tutorialOne =
tutorialOneBalloonView() tutorialOne.onTapped = { [weak tutorialOne] in tutorialOne?.dismiss() let tutorialTwo = tutorialTwoBalloonView() tutorialTwo.onTapped = { [weak tutorialTwo] in tutorialTwo?.dismiss() let tutorialThree = tutorialThreeBalloonView() tutorialThree.onTapped = { [weak self, weak tutorialThree] in tutorialThree?.dismiss() self?.hideGrayOverlay { } } tutorialThree.show() } tutorialTwo.show() } showGrayOverlay { tutorialOne.show() } } 10 Copyright © Merpay, Inc. All Rights Reserved. Pyramid of doom
11 Copyright © Merpay, Inc. All Rights Reserved. /FTUFEDMPTVSFT )PXUPEFBMXJUIUIFN
12 Copyright © Merpay, Inc. All Rights Reserved. 'VODUJPOTJOGVODUJPOT -FU`TVTFGVODUJPOT
'VODUJPOBM1SPHSBNNJOH
13 Copyright © Merpay, Inc. All Rights Reserved. 5IJOLUPQEPXO 8IBUXPVMEUIFJEFBMTPMVUJPOMPPLMJLF
14 Copyright © Merpay, Inc. All Rights Reserved. func showTutorialFlow()
{ let tutorialBalloon = tutorialOneBalloonView() let transitions = tutorialBalloon.onTapped({ inputBalloonView in inputBalloonView?.dismiss() return tutorialTwoBalloonView() }) >>> { inputBalloonView in inputBalloonView?.dismiss() return tutorialThreeBalloonView() } >>> { inputBalloonView in inputBalloonView?.dismiss() return tutorialFourBalloonView() } >>> { inputBalloonView in inputBalloonView?.dismiss() return tutorialFiveBalloonView() } >>> { [weak self] inputBalloonView in inputBalloonView?.dismiss() self?.hideGrayOverlay { } return nil } tutorialBalloon.show(onTapped: transitions) } $PNQPTBCMFUSBOTJUJPOGVODUJPOT
15 Copyright © Merpay, Inc. All Rights Reserved. )PXXPVMEXFJNQMFNFOUUIJT
16 Copyright © Merpay, Inc. All Rights Reserved. typealias BalloonTransition
= (BalloonView?) -> BalloonView? // associativity: right infix operator >>>: FunctionArrowPrecedence func >>> ( transitionOne: @escaping BalloonTransition, transitionTwo: @escaping BalloonTransition) -> BalloonTransition { return { balloonView in balloonView?._nextTransition = transitionTwo return transitionOne(balloonView) } } 1 >>> (2 >>> (3 >>> (4 >>> 5)))
17 Copyright © Merpay, Inc. All Rights Reserved. func >>>
( transitionOne: @escaping BalloonTransition, transitionTwo: @escaping BalloonTransition) -> BalloonTransition { return { balloonView in balloonView?._nextTransition = transitionTwo return transitionOne(balloonView) } } 1 >>> (2 >>> (3 >>> (4 >>> 5))) func showTutorialFlow() { let tutorialBalloon = tutorialOneBalloonView() let transitions = tutorialBalloon.onTapped({ inputBalloonView in inputBalloonView?.dismiss() return tutorialTwoBalloonView() }) >>> { inputBalloonView in inputBalloonView?.dismiss() return tutorialThreeBalloonView() } >>> { inputBalloonView in inputBalloonView?.dismiss() return tutorialFourBalloonView() } >>> { inputBalloonView in inputBalloonView?.dismiss() return tutorialFiveBalloonView() } >>> { [weak self] inputBalloonView in inputBalloonView?.dismiss() self?.hideGrayOverlay { } return nil } tutorialBalloon.show(onTapped: transitions) }
18 Copyright © Merpay, Inc. All Rights Reserved. func showTutorialFlow()
{ let tutorialBalloon = tutorialOneBalloonView() let transitions = tutorialBalloon.onTapped({ inputBalloonView in inputBalloonView?.dismiss() return tutorialTwoBalloonView() }) >>> { inputBalloonView in inputBalloonView?.dismiss() return tutorialThreeBalloonView() } >>> { inputBalloonView in inputBalloonView?.dismiss() return tutorialFourBalloonView() } >>> { inputBalloonView in inputBalloonView?.dismiss() return tutorialFiveBalloonView() } >>> { [weak self] inputBalloonView in inputBalloonView?.dismiss() self?.hideGrayOverlay { } return nil } tutorialBalloon.show(onTapped: transitions) } func >>> ( transitionOne: @escaping BalloonTransition, transitionTwo: @escaping BalloonTransition) -> BalloonTransition { return { balloonView in balloonView?._nextTransition = transitionTwo return transitionOne(balloonView) } } } >>> { inputBalloonView in inputBalloonView?.dismiss() return tutorialFiveBalloonView() } >>> { [weak self] inputBalloonView in inputBalloonView?.dismiss() self?.hideGrayOverlay { } return nil } -BTUUXPDMPTVSFT
Copyright © Merpay, Inc. All Rights Reserved. { balloon4 in
balloon4.nextTransition = { [weak self] balloon5 in balloon5?.dismiss() self?.hideGrayOverlay { } return nil } balloon4?.dismiss() return tutorialFiveBalloonView() } } >>> { inputBalloonView in inputBalloonView?.dismiss() return tutorialFiveBalloonView() } >>> { [weak self] inputBalloonView in inputBalloonView?.dismiss() self?.hideGrayOverlay { } return nil } FYFDVUFXIFOCBMMPPOJTUBQQFE FYFDVUFXIFO CBMMPPOJTUBQQFE 8IBUEPFTSFUVSOTBDMPTVSF OPUBDUVBMDPEF
Copyright © Merpay, Inc. All Rights Reserved. balloon3.nextTransition = {
balloon4 in balloon4.nextTransition = { [weak self] balloon5 in balloon5?.dismiss() self?.hideGrayOverlay { } return nil } balloon4?.dismiss() return tutorialFiveBalloonView() } balloon3?.dismiss() return tutorialFourBalloonView() GVODUJPOXJMMTFUUIFDMPTVSFUP UIFQSFWJPVT#BMMPPO7JFX 8IBUEPFT OPUBDUVBMDPEF
Copyright © Merpay, Inc. All Rights Reserved. balloon2.nextTransition = {
balloon3 in balloon3.nextTransition = { balloon4 in balloon4.nextTransition = { [weak self] balloon5 in balloon5?.dismiss() self?.hideGrayOverlay { } return nil } balloon4?.dismiss() return tutorialFiveBalloonView() } balloon3?.dismiss() return tutorialFourBalloonView() } balloon2?.dismiss() return tutorialThreeBalloonView() 8IBUEPFT OPUBDUVBMDPEF
Copyright © Merpay, Inc. All Rights Reserved. tutorialBalloon.show(onTapped: { balloon1
in balloon1.nextTransition = { balloon2 in balloon2.nextTransition = { balloon3 in balloon3.nextTransition = { balloon4 in balloon4.nextTransition = { [weak self] balloon5 in balloon5?.dismiss() self?.hideGrayOverlay { } return nil } balloon4?.dismiss() return tutorialFiveBalloonView() } balloon3?.dismiss() return tutorialFourBalloonView() } balloon2?.dismiss() return tutorialThreeBalloonView() } balloon1?.dismiss() return tutorialTwoBalloonView() }) 8IBUEPFT OPUBDUVBMDPEF
Copyright © Merpay, Inc. All Rights Reserved. tutorialBalloon.show(onTapped: { balloon1
in balloon1.nextTransition = { balloon2 in balloon2.nextTransition = { balloon3 in balloon3.nextTransition = { balloon4 in balloon4.nextTransition = { [weak self] balloon5 in balloon5?.dismiss() self?.hideGrayOverlay { } return nil } balloon4?.dismiss() return tutorialFiveBalloonView() } balloon3?.dismiss() return tutorialFourBalloonView() } balloon2?.dismiss() return tutorialThreeBalloonView() } balloon1?.dismiss() return tutorialTwoBalloonView() })
24 Copyright © Merpay, Inc. All Rights Reserved. .JTTJPOBDDPNQMJTIFE 3FBEBCMFDPEF
0OMZPOF#BMMPPO7JFXJONFNPSZ
25 Copyright © Merpay, Inc. All Rights Reserved. $VSSZJOH func
add(x: Int) -> ((Int) -> Int) { return { y in return x + y } } // Removed in Swift 3 // https://github.com/apple/swift-evolution/blob/master/proposals/0002-remove-currying.md func foo(x: Int)(y: Int)
26 Copyright © Merpay, Inc. All Rights Reserved. typealias Filter
= (CIImage) -> CIImage let myFilter = blur(blurRadius) >>> colorOverlay(overlayColor) let result = myFilter(image) *OTQJSBUJPO'VODUJPOBM4XJGU PCKDJP
27 Copyright © Merpay, Inc. All Rights Reserved. 4XJGU0CKFDUJWF$
28 Copyright © Merpay, Inc. All Rights Reserved. 5IBOLZPV HJUIVCDPNNFSDBSJ#BMMPPO7JFX