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.7k
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.5k
ReactiveSwift
tkuichooseyou
0
84
Other Decks in Programming
See All in Programming
AIコーディング道場勉強会#2 君(エンジニア)たちはどう生きるか
misakiotb
1
250
エラーって何種類あるの?
kajitack
5
320
設計やレビューに悩んでいるPHPerに贈る、クリーンなオブジェクト設計の指針たち
panda_program
6
1.6k
#kanrk08 / 公開版 PicoRubyとマイコンでの自作トレーニング計測装置を用いたワークアウトの理想と現実
bash0c7
1
600
C++20 射影変換
faithandbrave
0
540
Go1.25からのGOMAXPROCS
kuro_kurorrr
1
820
Cline指示通りに動かない? AI小説エージェントで学ぶ指示書の書き方と自動アップデートの仕組み
kamomeashizawa
1
580
型付きアクターモデルがもたらす分散シミュレーションの未来
piyo7
0
810
都市をデータで見るってこういうこと PLATEAU属性情報入門
nokonoko1203
1
580
Team topologies and the microservice architecture: a synergistic relationship
cer
PRO
0
1.1k
地方に住むエンジニアの残酷な現実とキャリア論
ichimichi
5
1.4k
PHP 8.4の新機能「プロパティフック」から学ぶオブジェクト指向設計とリスコフの置換原則
kentaroutakeda
2
660
Featured
See All Featured
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
It's Worth the Effort
3n
185
28k
Rails Girls Zürich Keynote
gr2m
94
14k
For a Future-Friendly Web
brad_frost
179
9.8k
Facilitating Awesome Meetings
lara
54
6.4k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
181
53k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
46
9.6k
GraphQLとの向き合い方2022年版
quramy
49
14k
Intergalactic Javascript Robots from Outer Space
tanoku
271
27k
Six Lessons from altMBA
skipperchong
28
3.9k
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