Playground駆動開発のすすめ / Playground driven development suggestion

Transcript

1. iOSDC Japan 2018
 2018/08/30 גࣜձࣾϛΫγΟ/ΈͯͶࣄۀ෦ ؠ໊༐ً @rockname Playgroundۦಈ։ൃ ͷ͢͢Ί
2. @rockname גࣜձࣾϛΫγΟ / ΈͯͶࣄۀ෦
 ΞϓϦ։ൃG 18৽ଔ iOS(Swift, objc), Android(Kotlin, Java), Rails(ruby)…
3. UIͷ࣮૷Λ൐͏
 iOSΞϓϦ։ൃϑϩʔ
4. 1 ϩδοΫΛ૊Ή 2 StoryboardͰϨΠΞ΢τ 3 ಈ࡞֬ೝ w ͦΕͧΕͷΞʔΩςΫνϟʹԠͯ͡ϩδοΫ͔Β૊ΜͰ͍͘
   w $MFBO"SDIJUFDUVSFͳΒ%PNBJO͔Β
   w ςετॻ͘ w ΞχϝʔγϣϯͳͲಈతͳཁૉҎ֎͸ఆٛͯ͠͠·͏ w ࣮ػ΍4JNVMBUPSͰҙਤͨ͠ڍಈΛ͢Δ͔֬ೝ
5. 1 ϩδοΫΛ૊Ή 2 StoryboardͰϨΠΞ΢τ 3 ಈ࡞֬ೝ w ͦΕͧΕͷΞʔΩςΫνϟʹԠͯ͡ϩδοΫ͔Β૊ΜͰ͍͘
   w $MFBO"SDIJUFDUVSFͳΒ%PNBJO͔Β
   w ςετॻ͘ w ΞχϝʔγϣϯͳͲಈతͳཁૉҎ֎͸ఆٛͯ͠͠·͏ w ࣮ػ΍4JNVMBUPSͰҙਤͨ͠ڍಈΛ͢Δ͔֬ೝ 4 σβΠϯௐ੔
6. 1 ϩδοΫΛ૊Ή 2 StoryboardͰϨΠΞ΢τ 3 ಈ࡞֬ೝ w ͦΕͧΕͷΞʔΩςΫνϟʹԠͯ͡ϩδοΫ͔Β૊ΜͰ͍͘
   w $MFBO"SDIJUFDUVSFͳΒ%PNBJO͔Β
   w ςετॻ͘ w ΞχϝʔγϣϯͳͲಈతͳཁૉҎ֎͸ఆٛͯ͠͠·͏ w ࣮ػ΍4JNVMBUPSͰҙਤͨ͠ڍಈΛ͢Δ͔֬ೝ 4 σβΠϯௐ੔ ͕݁͜͜ߏਏ͍…
7. • ෳ਺ղ૾౓ͰͷϨΠΞ΢τ • ৚݅ʹΑͬͯมΘΔදࣔ಺༰ • ϩʔΧϥΠζͷจݴ…
8. Xcode Simulator
 /Device #VJME͕௨ΔͷΛ଴ͬͯ
 ϨΠΞ΢τΛ֬ೝ ϨΠΞ΢τΛௐ੔ͯ͠
 ࠶Ϗϧυ • ෳ਺ղ૾౓ͰͷϨΠΞ΢τ • ৚݅ʹΑͬͯมΘΔදࣔ಺༰ • ϩʔΧϥΠζͷจݴ…
9. UIͷௐ੔Λ΋ͬͱૣ͍αΠΫϧͰճ͍ͨ͠…
10. – Playground driven development “Playgroundۦಈ։ൃ”
11. Playgroundۦಈ։ൃͱ͸ • ViewͷΈΛ୹࣌ؒͰϏϧυͯ͠ର৅ͷγʔϯΛ PlaygroundͰදࣔ͢Δ͜ͱͰσβΠϯௐ੔ͷϑ ϩʔΛૣ͘͢Δ։ൃख๏
 • Kickstarter͕ఏএ
 (https://github.com/kickstarter/ios-oss)
12. Kickstarter͸͜Μͳײ͡
13. Kickstarter͸͜Μͳײ͡
14. Kickstarter͸͜Μͳײ͡
15. ಋೖखॱ
16. 1. Cocoa Touch frameworkΛ λʔήοτʹ௥Ճ
17. 1. Cocoa Touch frameworkΛ λʔήοτʹ௥Ճ
18. 2. ࡞੒ͨ͠Frameworkʹ
 ViewΛ௥Ճ͍ͯ͘͠
19. 3. (CarthageΛ࢖༻ͨ͠৔߹ͷΈ)
 ViewͷදࣔʹඞཁͳϥΠϒϥϦΛ௥Ճ
20. 4. PlaygroundΛ
 ϓϩδΣΫτʹ௥Ճ
21. 5. PlaygroundͰViewΛදࣔ let vc = ViewController() PlaygroundPage.current.liveView = vc
22. 5. PlaygroundͰViewΛදࣔ
23. 5. PlaygroundͰViewΛදࣔ
24. ͞ΒʹPlaygroundʹ৽ػೳ͕…
25. What’s new in Playground
 - WWDC 2018 Xcode10͔ΒPlaygroundͷஞ࣮࣍ߦ͕Մೳʹ…!!
 (https://developer.apple.com/videos/play/ wwdc2018/402/) Alex Brown, Core OS Engineer • Running Step by Step NEW
26. What’s new in Playground
 - WWDC 2018 ҰʑίϝϯτΞ΢τ͢Δඞཁ͕ͳ͘ ϑϩʔΛڞ௨Խ͠΍͘͢ͳͬͨ Alex Brown, Core OS Engineer • Running Step by Step NEW
27. ۩ମతʹͲΜͳखॱͰ σβΠϯௐ੔͢Δͷ
28. DEMO IUUQTHJUIVCDPNSPDLOBNF1MBZHSPVOE%SJWFO%FWFMPQNFOU
29. DEMOͷྲྀΕ • TwitterͷΑ͏ͳΞϓϦΛ࡞ͬͨʂ • σβΠϯ֬ೝ͢Δͧʂ ౤ߘ͕ ͳ͍/͋Δ ͱ͖ͷදࣔ͸ਖ਼͍͠ʁ ͪΌΜͱ ϩʔΧϥΠζ ͞ΕͯΔʁ খ͍͞, େ͖͍୺຤Ͱ ϨΠΞ΢τ ่Εͯͳ͍ʁ • मਖ਼ͯ͠ View͚ͩ ϏϧυͰ࠶֬ೝʂ
30. ࣮૷આ໌
31. func display(device: Device, orientation: Orientation, language: Language) {
 let vc = R.storyboard.twitter.instantiateInitialViewController()!
 
 let (parent, _) = playgroundControllers(device: device, orientation: .portrait, child: vc)
 
 
 AppEnvironment.language = language
 
 
 PlaygroundPage.current.liveView = parent
 vc.load(statuses) } 1SPKFDUQMBZHSPVOE5XJUUFSYDQMBZHSPVOEQBHF
32. func display(device: Device, orientation: Orientation, language: Language) {
 let vc = R.storyboard.twitter.instantiateInitialViewController()!
 
 let (parent, _) = playgroundControllers(device: device, orientation: .portrait, child: vc)
 
 
 AppEnvironment.language = language
 
 
 PlaygroundPage.current.liveView = parent
 vc.load(statuses) }    1SPKFDUQMBZHSPVOE5XJUUFSYDQMBZHSPVOEQBHF
33. 1SPKFDUQMBZHSPVOE5XJUUFSYDQMBZHSPVOEQBHF func display(device: Device, orientation: Orientation, language: Language) {
 let vc = R.storyboard.twitter.instantiateInitialViewController()!
 
 let (parent, _) = playgroundControllers(device: device, orientation: .portrait, child: vc)
 
 
 AppEnvironment.language = language
 
 
 PlaygroundPage.current.liveView = parent
 vc.load(statuses) }    simulatorͷsizeͳͲΛࢦఆ
34. public func playgroundControllers(device: Device = .phone4_7inch, orientation: Orientation, child: UIViewController, additionalTraits: UITraitCollection) -> (parent: UIViewController, child: UIViewController) { let parent = UIViewController() parent.addChild(child) parent.view.addSubview(child.view) child.view.autoresizingMask = [.flexibleWidth, .flexibleHeight] let traits: UITraitCollection switch (device, orientation) { case (.phone3_5inch, .portrait): parent.view.frame = .init(x: 0, y: 0, width: 320, height: 480) traits = .init(traitsFrom: [ .init(horizontalSizeClass: .compact), .init(verticalSizeClass: .regular), .init(userInterfaceIdiom: .phone) ]) ɾ
 ɾ
 ɾ  simulatorͷsizeͳͲΛࢦఆ 1SPKFDUQMBZHSPVOE4PVSDFTEFWJDFTXJGU
35. public func playgroundControllers(device: Device = .phone4_7inch, orientation: Orientation, child: UIViewController, additionalTraits: UITraitCollection) -> (parent: UIViewController, child: UIViewController) { let parent = UIViewController() parent.addChild(child) parent.view.addSubview(child.view) child.view.autoresizingMask = [.flexibleWidth, .flexibleHeight] let traits: UITraitCollection switch (device, orientation) { case (.phone3_5inch, .portrait): parent.view.frame = .init(x: 0, y: 0, width: 320, height: 480) traits = .init(traitsFrom: [ .init(horizontalSizeClass: .compact), .init(verticalSizeClass: .regular), .init(userInterfaceIdiom: .phone) ]) 1SPKFDUQMBZHSPVOE4PVSDFTEFWJDFTXJGU ɾ
 ɾ
 ɾ  simulatorͷsizeͳͲΛࢦఆ Device, OrientationʹԠͯ͡
 sizeΛࢦఆ͢Δ
36. ɾ
 ɾ
 ɾ child.view.frame = parent.view.frame parent.preferredContentSize = parent.view.frame.size parent.view.backgroundColor = .white child.view.backgroundColor = .white let allTraits = UITraitCollection.init(traitsFrom: [traits, additionalTraits]) parent.setOverrideTraitCollection(allTraits, forChild: child) return (parent, child) }  simulatorͷsizeͳͲΛࢦఆ 1SPKFDUQMBZHSPVOE4PVSDFTEFWJDFTXJGU
37. ɾ
 ɾ
 ɾ child.view.frame = parent.view.frame parent.preferredContentSize = parent.view.frame.size parent.view.backgroundColor = .white child.view.backgroundColor = .white let allTraits = UITraitCollection.init(traitsFrom: [traits, additionalTraits]) parent.setOverrideTraitCollection(allTraits, forChild: child) return (parent, child) }  simulatorͷsizeͳͲΛࢦఆ 1SPKFDUQMBZHSPVOE4PVSDFTEFWJDFTXJGU preferredContentSizeΛࢦఆ͢Δ͜ͱͰ Playground্Ͱදࣔ͢ΔViewͷେ͖͞ΛมߋՄೳ
38. func display(device: Device, orientation: Orientation, language: Language) {
 let vc = R.storyboard.twitter.instantiateInitialViewController()!
 
 let (parent, _) = playgroundControllers(device: device, orientation: .portrait, child: vc)
 
 
 AppEnvironment.language = language
 
 
 PlaygroundPage.current.liveView = parent
 vc.load(statuses) }    1SPKFDUQMBZHSPVOE5XJUUFSYDQMBZHSPVOEQBHF
39. func display(device: Device, orientation: Orientation, language: Language) {
 let vc = R.storyboard.twitter.instantiateInitialViewController()!
 
 let (parent, _) = playgroundControllers(device: device, orientation: .portrait, child: vc)
 
 
 AppEnvironment.language = language
 
 
 PlaygroundPage.current.liveView = parent
 vc.load(statuses) }    1SPKFDUQMBZHSPVOE5XJUUFSYDQMBZHSPVOEQBHF LanguageΛࢦఆ
40. public struct AppEnvironment { public static var language: Language = .ja public static var currentUser: String? = nil public var isLoggedIn: Bool { return AppEnvironment.currentUser != nil } } GlobalʹΞϓϦͷ؀ڥΛ͍࣋ͨͤͯΔ  LanguageΛࢦఆ %PNBJO"QQ&OWJSPONFOUTXJGU
41. extension StringResourceType { func localized(language: Language = AppEnvironment.language) -> String { return NSLocalizedString(key, bundle: Bundle(path: stringsBundle.path(forResource: language.rawValue, ofType: "lproj") ?? "") ?? stringsBundle, comment: "") } } private class Pin {} public let stringsBundle = Bundle(for: Pin.self)  LanguageΛࢦఆ 1SFTFOUBUJPOʜ4USJOH3FTPVSDF5ZQF MPDBMJ[FETXJGU
42. extension StringResourceType { func localized(language: Language = AppEnvironment.language) -> String { return NSLocalizedString(key, bundle: Bundle(path: stringsBundle.path(forResource: language.rawValue, ofType: "lproj") ?? "") ?? stringsBundle, comment: "") } } private class Pin {} public let stringsBundle = Bundle(for: Pin.self) 1SFTFOUBUJPOʜ4USJOH3FTPVSDF5ZQF MPDBMJ[FETXJGU NSLocalizedStringͷҾ਺ʹ LanguageʹԠͨ͡BundleΛ౉͢Α͏ʹ͢Δ  LanguageΛࢦఆ
43. func display(device: Device, orientation: Orientation, language: Language) {
 let vc = R.storyboard.twitter.instantiateInitialViewController()!
 
 let (parent, _) = playgroundControllers(device: device, orientation: .portrait, child: vc)
 
 
 AppEnvironment.language = language
 
 
 PlaygroundPage.current.liveView = parent
 vc.load(statuses) }    1SPKFDUQMBZHSPVOE5XJUUFSYDQMBZHSPVOEQBHF
44. func display(device: Device, orientation: Orientation, language: Language) {
 let vc = R.storyboard.twitter.instantiateInitialViewController()!
 
 let (parent, _) = playgroundControllers(device: device, orientation: .portrait, child: vc)
 
 
 AppEnvironment.language = language
 
 
 PlaygroundPage.current.liveView = parent
 vc.load(statuses) } 1SPKFDUQMBZHSPVOE5XJUUFSYDQMBZHSPVOEQBHF    Playground্ͰViewΛදࣔͯ͠
 Cellʹදࣔ͢Δ౤ߘΛಡΈࠐΉ
45.  ViewΛදࣔ
46.  ViewΛදࣔ
47. Α͠ɺΈͯͶͰ΋ಋೖʂ
48. Α͠ɺΈͯͶͰ΋ಋೖʂ
49. ಋೖ·ͰͷಓͷΓ Viewʹදࣔ͢Δ΋ͷΛϞοΫͰ͖ΔΑ͏ʹઃܭ ଟݴޠରԠΛ͍ͯ͠ΔͷͰɺNSLocalizedStringͷ ॳظԽ࣌ʹBundleͷpathΛ౉͢ Embedded Frameworkͷಋೖ PlaygroundͷPageಋೖϑϩʔڞ௨Խɾڞ༗
50. ৽نϓϩδΣΫτͳΒ ׂͱαΫοͱಋೖͰ͖ͦ͏
51. Playgroundۦಈ։ൃͰ
 ര଎ʹ։ൃ͠Α͏