レイアウトを、もっと Swifty に（総集編）

Transcript

1. ϨΠΞ΢τΛ
 ΋ͬͱ
   4XJGUZ
   ʹ
 ʢ૯ूฤʣ for
   ",*#"TXJGU
   ʷ
   Τ΢ϨΧ
   ίʔυϨΠΞ΢τษڧձ
2. var employedBy = "YUMEMI Inc." var job = "iOS Developer" var favoriteLanguage = "Swift" var twitter = "@lovee" var qiita = "lovee" var github = "el-hoshino" var additionalInfo = """ Ϛπμϩʔυελʔ͸͍͍ͧʂ """ class Me: Developable, Talkable { }
4. ࢀߟɿ௚઀ίʔυͰϨΠΞ΢τΛ૊Ήํ๏ ▸ ϨΠΞ΢ταΠΫϧͷ೺Ѳ
   ▸ ϨΠΞ΢τʹؔ܎͢ΔϓϩύςΟʔͷಈ͖Λཧղ
   ▸ దٓʹϥΠϒϥϦʔΛಋೖ ˞
   IUUQTTQFBLFSEFDLDPNMPWFFOPTUPSZOPCPBSE
5. ϨΠΞ΢τΛ
 ΋ͬͱ
   4XJGUZ
   ʹ
 ʢ૯ूฤʣ for
   ",*#"TXJGU
   ʷ
   Τ΢ϨΧ
   ίʔυϨΠΞ΢τษڧձ
6. ૯ूฤʁ!
7. IUUQTCPPUIQNKBJUFNT
8. 4XJGUZ
   ͱ͸ ▸ Ϟμϯʁ
   ▸ Φϓγϣφϧʁ
   ▸ ಡΈ΍͢͞ʁ
11. ྑ͍ઃܭ͸ޡͬͨ༻๏Λ
    ίϯύΠϧΤϥʔʹ͢Δ CZ
    ੴ઒
    ༸ࢿ
    גࣜձࣾϝϧΧϦ
12. 4XJGUZ
    ͱ͸ޡͬͨ༻๏͕
    ίϯύΠϧΤϥʔʹͳΔ CZ
    MPWFF
13. ϨΠΞ΢τͷώϡʔϚϯΤϥʔΛ
 ίϯύΠϧΤϥʔʹ͢Δ
14. "VUP
    -BZPVU
    ͷσϝϦοτ͸ ▸ ύϑΥʔϚϯε͕ѱ͍ ▸ σόοά͠ʹ͍͘ ▸ ಈతʹมΘΔϨΠΞ΢τʹରԠ͠ʹ͍͘ ▸ ϨΠΞ΢τʹΤϥʔ͕͋ͬͯ΋͸ϥϯλΠϜͰॳΊͯ஌Δ
15. ϨΠΞ΢τͷώϡʔϚϯΤϥʔΛ
 ίϯύΠϧΤϥʔʹͰ͖ͳ͍
    "VUP
    -BZPVU
    ͸
    4XJGUZ
    ͡Όͳ͍
16. ϨΠΞ΢τͷώϡʔϚϯΤϥʔΛ
 ίϯύΠϧΤϥʔʹ͢Δʹ͸
    CGRect
    Λ࡞Ε͹͍͍
17. CGRect
    Λ࡞Δʹ͸ ▸ CGRect
    ͷΠχγϟϥΠβʔΛ௨͢ඞཁ͕͋Δ
    ▸ CGRect(x: 0, y: 0, width: 100)
    ΛݺΜ͡Ό͑͹ ίϯύΠϧΤϥʔʹͳΔ
    
    ▸ height
    ΋ඞཁͳͷʹઃఆ͞Ε͍ͯͳ͍
18. CGRect ࡞Δͷ໘౗͡ΌΜʂ ▸ x, y, width, height Ͱ͔͠ઃఆͰ͖ͳ͍ ▸ "VUP -BZPVU ͳΒࠨӈͷ৔ॴͱ͔΋࢖͑Δ ▸ "VUP -BZPVU ͳΒଞͷϏϡʔͱͷҐஔؔ܎ͱ͔΋࢖͑Δ
19. /PU"VUP-BZPVU
    ͩͬͯ
 ࢖͑Δ"
20. IUUQTHJUIVCDPNFMIPTIJOP/PU"VUP-BZPVU
21. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } ٿطصعٛوطقپ⑦؃و٩٦ٸڋخٿطصعٛ
 猺؆د؊⯪⟓؞䐂נنڋٜٿطصعٛ猻
22. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } PCN؃٠ڋٳٌ٭ڋٌخⓨا
23. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } NC[QWV؃و٩٦ٸڋخ ٿطصعٛ
24. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } ٿطصعٛ⻟彂 ؊و٩٦ٸڋ
25. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } デ⃫猺6QR.GHV猻ֻ⛔䷐猺4KIJV猻؄⃬䷐猺$QVVQO猻 ؊⬕㔡خٴِٖٜٔغڋچ؃崎⹻
26. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } デ⃫خOCKP6KVNG.CDGN؊デ⃬؇٧چ
27. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } ⛔䷐خOCKP6KVNG.CDGN؊⛔䷐؇٧چ
28. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } ⃬䷐خ岋؊َڋ٨ػٽص؊⃬䷐؇崎⹻
29. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } ٿطصعٛخ∽اٴڋؾڋ
30. /PU"VUP-BZPVU
    ͸ͱͯ΋ศར ▸ ࠨӈͷ৔ॴͱ͔΋ϨΠΞ΢τܾΊʹ࢖͑Δ
    ▸ ଞͷϏϡʔΛࢀর͢Δ͜ͱ΋Ͱ͖Δ
    ▸ ಡΈ΍͍͢ߏจͰϨΠΞ΢τ͕؆୯ʹΠϝʔδͰ͖Δ
    ▸ ϝιουνΣʔϯͰඞཁͳ΋ͷ͸ίʔυิ׬Ͱ͙͢ॻ͚Δ
    ▸ ઃఆ͕଍Γͳ͚Ε͹ίϯύΠϧΤϥʔͰڭ͑ͯ͘ΕΔʂ
31. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } }
32. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) } } Cannot convert value of type 'LayoutMaker<IndividualProperty.TopLeft.WillSetRightProperty>' (aka 'LayoutMaker<IndividualProperty.TopLeftRight>') to closure result type 'LayoutMaker<IndividualLayout>'
33. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .fitWidth() } } Type 'IndividualProperty.TopLeft.WillSetRightProperty' (aka 'IndividualProperty.TopLeftRight') does not conform to protocol 'LayoutPropertyCanStoreWidthType'
34. Ͳ͏΍ͬͯ͜ͷ࢓૊ΈΛ ࡞͔ͬͨ!
35. O x y ࢛͍֯ྖҬΛ࡞Δʹ͸ ▸ ԣʹॏෳ͠ͳ͍
    
    ཁૉ
    ▸ ॎʹॏෳ͠ͳ͍
    
    ཁૉ
    ▸ ˞୺Ͱ͋Δඞཁ͸ͳ͍
    ▸ ྫ͑͹தԝͩͬͨΓɺ௕͞ ͩͬͨΓ΋
    0,
    ▸ ྫ͑͹
    CGRect(x, y, width, height)
    ͸ԣʹ
    x
    ͱ
    width
    ͷ
    
    ཁૉɺॎ ʹ
    y
    ͱ
    height
    ͷ
    
    ཁૉ
36. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } طٞيٶپٴڋؾڋ
 猺ؚ׼∶؞崎⹻ױب؂נ؆נ猻
37. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } デ⃫崎⹻䃩؛ٴڋؾڋ
 猺㴋屢倁؇デ䷐ֻ儇屢倁؇⃫䷐ר崎⹻ױب׻猻
38. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } デ⃫؄⛔崎⹻䃩؛ٴڋؾڋ
 猺㴋屢倁؇デ䷐؄⛔䷐ֻ儇屢倁؇⃫䷐ר崎⹻ױب׻猻
39. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } ٨ٿڋٳ崎⹻䃩؛ٴڋؾڋ
 猺⑉؂؊㊦屢؆屢倁ר崎⹻ױب׻猻
40. /PU"VUP-BZPVU
    Λ࢖ͬͨϨΠΞ΢τίʔυ public override func layoutSubviews() { super.layoutSubviews() // ...ུ... self.nal.layout(self.subTitleLabel) { $0 .pinTopLeft(to: self.mainTitleLabel, with: { $0.bottomLeft }) .pinRight(to: self.mainTitleLabel, with: { $0.right }) .setBottom(by: { $0.safeAreaGuide.bottom }) } } .C[QWV/CMGT+PKVKCN  .C[QWV/CMGT(TCOG 
 恘䎚؄倣䎚ר㽛ؚ׿؂מاقڀڋًٶڋ
43. ϝιουνΣʔϯͱΫϩʔδϟΛ ૊Έ߹ΘͤΔ͜ͱʹΑͬͯ
    ߋͳΔརศੑͱ҆શੑ
44. /PU"VUP-BZPVU
    

    
    
    
    
    
    
    
    
    
    $PNQBUJCMF
    XJUI
    4XJGU
    
 "WBJMBCMF
    GSPN
    5PEBZ Should be IUUQTHJUIVCDPNFMIPTIJOP/PU"VUP-BZPVU
45. IUUQTCPPUIQNKBJUFNT ϨΠΞ΢τΛɺ΋ͬͱ
    4XJGUZ
    ʹ ࣥච࣌͸όʔδϣϯ
    
    ͕ͩɺ /PU"VUP-BZPVU
    ʹ࢖ΘΕͯΔ ςΫχοΫ౳΋ܝࡌ