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

How to release apps faster with SwiftUI

Akio Itaya
September 17, 2021

How to release apps faster with SwiftUI

iOSDC JAPAN 2021

Akio Itaya

September 17, 2021
Tweet

More Decks by Akio Itaya

Other Decks in Programming

Transcript

  1. AkkeyLab / AKIO ITAYA
    ࣮ϓϩμΫτΛԻ଎ϦϦʔεͨ͠࿩🚀
    WED, Inc.
    SwiftUIͰ
    1

    View Slide

  2. ࣗݾ঺հ
    2

    View Slide

  3. ࣗݾ঺հ
    ໊લɿAKIO ITAYAɹ/ɹAKKEY


    झຯɿۭؒσβΠϯ


    ׆ಈɿ@AkkeyLab


    ̧̥ɿγϧόʔˍTγϟπεϙϯαʔ

    ̧̥ɿݪߘ̎ίϯςϯπ߹ܭ̍̎ϖʔδ


    WED, Inc.


    ݩ Cyberagent, Inc.
    3

    View Slide

  4. ࣗݾ঺հ
    ໊લɿAKIO ITAYAɹ/ɹAKKEY


    झຯɿۭؒσβΠϯ


    ׆ಈɿ@AkkeyLab


    ̧̥ɿγϧόʔˍTγϟπεϙϯαʔ

    ̧̥ɿݪߘ̎ίϯςϯπ߹ܭ̍̎ϖʔδ


    WED, Inc.


    ݩ Cyberagent, Inc.
    4

    View Slide

  5. ࣗݾ঺հ
    ໊લɿAKIO ITAYAɹ/ɹAKKEY


    झຯɿۭؒσβΠϯ


    ׆ಈɿ@AkkeyLab


    ̧̥ɿγϧόʔˍTγϟπεϙϯαʔ

    ̧̥ɿݪߘ̎ίϯςϯπ߹ܭ̍̎ϖʔδ


    WED, Inc.


    ݩ Cyberagent, Inc.
    5

    View Slide

  6. ࣗݾ঺հ
    ໊લɿAKIO ITAYAɹ/ɹAKKEY


    झຯɿۭؒσβΠϯ


    ׆ಈɿ@AkkeyLab


    ̧̥ɿγϧόʔˍTγϟπεϙϯαʔ

    ̧̥ɿݪߘ̎ίϯςϯπ߹ܭ̍̎ϖʔδ


    WED, Inc.


    ݩ Cyberagent, Inc.
    6

    View Slide

  7. ࣗݾ঺հ
    Check Novelty Box!!
    1SPEVDFECZ"LLFZ-BC
    7

    View Slide

  8. ࣗݾ঺հ
    ໊લɿAKIO ITAYAɹ/ɹAKKEY


    झຯɿۭؒσβΠϯ


    ׆ಈɿ@AkkeyLab


    ̧̥ɿγϧόʔˍTγϟπεϙϯαʔ

    ̧̥ɿݪߘ̎ίϯςϯπ߹ܭ̍̎ϖʔδ


    WED, Inc.


    ݩ Cyberagent, Inc.
    8

    View Slide

  9. Agenda
    1. SwiftUI Ͱ։ൃͨ͠ΞϓϦ


    2. SwiftUI ࠾༻ཧ༝


    3. SwiftUI ϨΠΞ΢τςΫχοΫ


    4. UIKit ΁ͷුؾ


    5. SwiftUI ະରԠϥΠϒϥϦ
    9

    View Slide

  10. SwiftUI Ͱ։ൃͨ͠ΞϓϦ
    10

    View Slide

  11. د෇͕͙ͦ͢͹ʹɻ
    د෇ઌͷஂମͱد෇ϓϥϯΛબͿ͚ͩɻ1෼Ͱ
    ؆୯ʹد෇͕Ͱ͖ΔΞϓϦͰ͢ɻد෇ͷ͓ྱ
    ͱͯ͠ɺΦϦδφϧεςοΧʔ͕ಧ͘࢓૊Έ
    ʹͳ͍ͬͯ·͢ɻ
    11

    View Slide

  12. SwiftUI
    SwiftUI ͱ UIKit ߹ܭΛ100%ͱͯ͠ܭࢉ
    95%
    Ҏ্
    12

    View Slide

  13. Engineer
    iOS / GCF / Firebase DB
    01

    13

    View Slide

  14. ։ൃظؒ
    େن໛࢓༷มߋ2ճ࣮ࢪ
    02
    ϲ݄
    14

    View Slide

  15. SwiftUI ࠾༻ཧ༝
    ॏཁʂ
    15

    View Slide

  16. 1. SwiftUI Ͱͷ։ൃྺ༗Γ


    2. ݱঢ়ͷ SwiftUI Ͱ࣮ݱͰ͖Δ UI


    3. ։ൃ 㲗 FB ͷճసεϐʔυΛॏཁࢹ


    4. SwiftUI ʹର͢Δ஌ݟΛ૿΍͢
    SwiftUI ࠾༻ཧ༝
    16

    View Slide

  17. 1. SwiftUI Ͱͷ։ൃྺ༗Γ


    2. ݱঢ়ͷ SwiftUI Ͱ࣮ݱͰ͖Δ UI


    3. ։ൃ 㲗 FB ͷճసεϐʔυΛॏཁࢹ


    4. SwiftUI ʹର͢Δ஌ݟΛ૿΍͢
    SwiftUI ࠾༻ཧ༝
    17

    View Slide

  18. SwiftUI Ͱͷ։ൃྺ༗Γ
    iOS13 ਖ਼ࣜϦϦʔε਺ϲ݄ޙ

    ݸਓͰ SwiftUI ੡ΞϓϦΛϦϦʔε
    18

    View Slide

  19. 1. SwiftUI Ͱͷ։ൃྺ༗Γ


    2. ݱঢ়ͷ SwiftUI Ͱ࣮ݱͰ͖Δ UI


    3. ։ൃ 㲗 FB ͷճసεϐʔυΛॏཁࢹ


    4. SwiftUI ʹର͢Δ஌ݟΛ૿΍͢
    SwiftUI ࠾༻ཧ༝
    19

    View Slide

  20. ݱঢ়ͷ SwiftUI Ͱ࣮ݱͰ͖Δ UI
    iOS14 Ҏ͕߱λʔήοτ

    ࡉ͔͍Ξχϝʔγϣϯ΋؆୯ʹ࣮૷Ͱ͖Δ
    20

    View Slide

  21. 1. SwiftUI Ͱͷ։ൃྺ༗Γ


    2. ݱঢ়ͷ SwiftUI Ͱ࣮ݱͰ͖Δ UI


    3. ։ൃ 㲗 FB ͷճసεϐʔυΛॏཁࢹ


    4. SwiftUI ʹର͢Δ஌ݟΛ૿΍͢
    SwiftUI ࠾༻ཧ༝
    21

    View Slide

  22. ։ൃ 㲗 FB ͷճసεϐʔυΛॏཁࢹ
    Xcode Previews ͰଈνʔϜ΁ڞ༗

    খ͞ͳεύϯͰ։ൃͱमਖ਼Λ܁Γฦ͢͜ͱ͕Մೳʂ
    22

    View Slide

  23. 1. SwiftUI Ͱͷ։ൃྺ༗Γ


    2. ݱঢ়ͷ SwiftUI Ͱ࣮ݱͰ͖Δ UI


    3. ։ൃ 㲗 FB ͷճసεϐʔυΛॏཁࢹ


    4. SwiftUI ʹର͢Δ஌ݟΛ૿΍͢
    SwiftUI ࠾༻ཧ༝
    23

    View Slide

  24. SwiftUI ʹର͢Δ஌ݟΛ૿΍͢
    ۤઓՕॴΛத৺ʹΞ΢τϓοτ΋

    جຊతʹ SwiftUI ͱ͍͏ڧ੍͍໿Ͱଟ͘ͷֶͼΛಘͨ
    24

    View Slide

  25. SwiftUI ϨΠΞ΢τςΫχοΫ
    େن໛࢓༷มߋ΋΢ΣϧΧϜʂ
    25

    View Slide

  26. 1. UIKit ͱൺֱ͢ΔΧελϜϘλϯ


    2. εΫϦʔϯϩάͰֶͿॲཧͷڞ௨Խ


    3. Ξχϝʔγϣϯ΁ͷରԠ
    SwiftUI ϨΠΞ΢τςΫχοΫ
    26

    View Slide

  27. 1. UIKit ͱൺֱ͢ΔΧελϜϘλϯ


    2. εΫϦʔϯϩάͰֶͿॲཧͷڞ௨Խ


    3. Ξχϝʔγϣϯ΁ͷରԠ
    SwiftUI ϨΠΞ΢τςΫχοΫ
    27

    View Slide

  28. SwiftUI ϨΠΞ΢τςΫχοΫ
    օ͞Μ͸ɺͲͷΑ͏ʹ࡞Γ·͔͢ʁ
    28

    View Slide

  29. UIKit ver.
    29

    View Slide

  30. SwiftUI ϨΠΞ΢τςΫχοΫ
    30

    View Slide

  31. SwiftUI ϨΠΞ΢τςΫχοΫ
    UIButton Λܧঝͨ͠ΧελϜΫϥεΛ࡞੒
    31

    View Slide

  32. SwiftUI ϨΠΞ΢τςΫχοΫ
    ΦʔόʔϥΠυͯ͠ػೳΛΧελϚΠζ͍ͯ͘͠
    32

    View Slide

  33. SwiftUI ϨΠΞ΢τςΫχοΫ
    ೚ҙͷλΠϛϯάͰ૷০
    33

    View Slide

  34. SwiftUI ver.
    34

    View Slide

  35. SwiftUI ϨΠΞ΢τςΫχοΫ
    35

    View Slide

  36. SwiftUI ϨΠΞ΢τςΫχοΫ
    Button ΛؚΉΧελϜϏϡʔΛ࡞੒
    36

    View Slide

  37. SwiftUI ϨΠΞ΢τςΫχοΫ
    ૷০͸ελΠϧͱͯ͠ผఆٛ
    Point !
    37

    View Slide

  38. SwiftUI ϨΠΞ΢τςΫχοΫ
    ButtonStyle Protocol ʹ४ڌͨ͠ߏ଄ମΛఆٛ
    38

    View Slide

  39. SwiftUI ϨΠΞ΢τςΫχοΫ
    ButtonStyleCon
    fi
    guration ߏ଄ମΛҾ਺ʹऔΔؔ਺Λએݴ
    39

    View Slide

  40. SwiftUI ϨΠΞ΢τςΫχοΫ
    ButtonStyleCon
    fi
    guration ʹ͸ Button ͷ Label ؚ͕·ΕΔ
    40

    View Slide

  41. SwiftUI ϨΠΞ΢τςΫχοΫ
    ϝιουνΣʔϯͰ૷০΍ΞχϝʔγϣϯΛࢪ͢
    41

    View Slide

  42. SwiftUI ϨΠΞ΢τςΫχοΫ
    ButtonStyleCon
    fi
    guration ʹ͸ ԡ͞Ε͍ͯΔ͔Λࣔ͢ϑϥάؚ͕·ΕΔ
    42

    View Slide

  43. SwiftUI ϨΠΞ΢τςΫχοΫ
    buttonStyle ϝιουʹελΠϧͷΠϯελϯεΛ౉͚ͩ͢
    43

    View Slide

  44. 1. UIKit ͱൺֱ͢ΔΧελϜϘλϯ


    2. εΫϦʔϯϩάͰֶͿॲཧͷڞ௨Խ


    3. Ξχϝʔγϣϯ΁ͷରԠ
    SwiftUI ϨΠΞ΢τςΫχοΫ
    44

    View Slide

  45. SwiftUI ϨΠΞ΢τςΫχοΫ
    օ͞Μ͸ɺͲͷΑ͏ʹεΫϦʔϯϩάऔΓ·͔͢ʁ
    45

    View Slide

  46. SwiftUI ϨΠΞ΢τςΫχοΫ
    46

    View Slide

  47. SwiftUI ϨΠΞ΢τςΫχοΫ
    ڞ௨ॲཧ͸ ViewModi
    fi
    er ͱͯ͠ผఆٛ
    47
    Point !

    View Slide

  48. SwiftUI ϨΠΞ΢τςΫχοΫ
    48

    View Slide

  49. ViewModi
    fi
    er Protocol ʹ४ڌͨ͠ߏ଄ମΛఆٛ
    SwiftUI ϨΠΞ΢τςΫχοΫ
    49

    View Slide

  50. Modi
    fi
    er Λࢦఆͨ͠ର৅ͷ View ͕౉ͬͯ͘Δ
    SwiftUI ϨΠΞ΢τςΫχοΫ
    50

    View Slide

  51. ର৅ͱͳΔ View ͷ

    onAppear ͰॲཧΛ࣮ߦ
    SwiftUI ϨΠΞ΢τςΫχοΫ
    51

    View Slide

  52. ͜͜Ͱ૷০Λߦ͑͹

    ϨΠΞ΢τͷڞ௨Խ͕Մೳʹ
    SwiftUI ϨΠΞ΢τςΫχοΫ
    52

    View Slide

  53. 1. UIKit ͱൺֱ͢ΔΧελϜϘλϯ


    2. εΫϦʔϯϩάͰֶͿॲཧͷڞ௨Խ


    3. Ξχϝʔγϣϯ΁ͷରԠ
    SwiftUI ϨΠΞ΢τςΫχοΫ
    53

    View Slide

  54. SwiftUI ϨΠΞ΢τςΫχοΫ
    54

    View Slide

  55. AnimatableModi
    fi
    er Protocol ʹ४ڌͨ͠ߏ଄ମΛఆٛ
    SwiftUI ϨΠΞ΢τςΫχοΫ
    55

    View Slide

  56. ͜ͷมߋ͕Ξχϝʔγϣϯ͠ͳ͕ΒదԠ͞ΕΔΑ͏ʹͳΔ
    SwiftUI ϨΠΞ΢τςΫχοΫ
    56

    View Slide

  57. UIKit ΁ͷුؾ
    ̑ˋͷ
    57

    View Slide

  58. 1. ුؾ૬ख


    2. ෦෼తʹ UIKit Λར༻͢Δํ๏


    3. ৄ͘͠͸ͪ͜Βʂ
    UIKit ΁ͷුؾ
    58

    View Slide

  59. 1. ුؾ૬ख


    2. ෦෼తʹ UIKit Λར༻͢Δํ๏


    3. ৄ͘͠͸ͪ͜Βʂ
    UIKit ΁ͷුؾ
    59

    View Slide

  60. UIKit ΁ͷුؾ
    TextField ͕ඞཁͳը໘͸ UIKit Ͱ։ൃ
    60

    View Slide

  61. UIKit ΁ͷුؾ
    61
    InputAccessoryView
    ؆୯ʹΩʔϘʔυϝχϡʔΛ࡞੒Մೳ

    View Slide

  62. UIKit ΁ͷුؾ
    62
    BecomeFirstResponder
    ࣍ͷೖྗཝʹࣗಈҠಈՄೳ
    ※ iOS15 ͔Β SwiftUI Ͱ΋ਖ਼ࣜαϙʔτ

    View Slide

  63. UIKit ΁ͷුؾ
    63
    UIScrollView.setContentOffset
    ೖྗͷ๦͛ʹͳΒͳ͍ҐஔʹεΫϩʔϧ

    View Slide

  64. 1. ුؾ૬ख


    2. ෦෼తʹ UIKit Λར༻͢Δํ๏


    3. ৄ͘͠͸ͪ͜Βʂ
    UIKit ΁ͷුؾ
    64

    View Slide

  65. SwiftUI ϨΠΞ΢τςΫχοΫ
    65

    View Slide

  66. UIViewControllerRepresentable Protocol ʹ४ڌͨ͠ߏ଄ମΛఆٛ
    SwiftUI ϨΠΞ΢τςΫχοΫ
    66

    View Slide

  67. UIKit Ͱߏஙͨ͠ΫϥεΛॳظԽ
    SwiftUI ϨΠΞ΢τςΫχοΫ
    67

    View Slide

  68. SwiftUI ϨΠΞ΢τςΫχοΫ
    68

    View Slide

  69. SwiftUI ϨΠΞ΢τςΫχοΫ
    69

    View Slide

  70. SwiftUI ϨΠΞ΢τςΫχοΫ
    70

    View Slide

  71. UI ΁൓ө
    SwiftUI ϨΠΞ΢τςΫχοΫ
    71

    View Slide

  72. 1. ුؾ૬ख


    2. ෦෼తʹ UIKit Λར༻͢Δํ๏


    3. ৄ͘͠͸ͪ͜Βʂ
    UIKit ΁ͷුؾ
    72

    View Slide

  73. UIKit ΁ͷුؾ
    iOSDC ެࣜύϯϑϨοτ΁ܝࡌ

    UIKit ΁ුؾͤ͟ΔΛಘͳ͍͔ҰॠͰ൑அʂ
    73

    View Slide

  74. SwiftUI ະରԠϥΠϒϥϦ
    ༉அې෺ʂ
    74

    View Slide

  75. 1. ࠇຐज़Λར༻͍ͯ͠ΔSDK


    2. σόοάπʔϧ
    SwiftUI ະରԠϥΠϒϥϦ
    75

    View Slide

  76. 1. ࠇຐज़Λར༻͍ͯ͠ΔSDK


    2. σόοάπʔϧ
    SwiftUI ະରԠϥΠϒϥϦ
    76

    View Slide

  77. SwiftUI ະରԠϥΠϒϥϦ
    ࣗಈͰεΫϦʔϯϩάΛऔಘͰ͖ͳ͍
    77

    View Slide

  78. 1. ࠇຐज़Λར༻͍ͯ͠ΔSDK


    2. σόοάπʔϧ
    SwiftUI ະରԠϥΠϒϥϦ
    78

    View Slide

  79. SwiftUI ະରԠϥΠϒϥϦ
    dani-gavrilov/GDPerformanceView-Swift
    79

    View Slide

  80. Summary
    80

    View Slide

  81. Summary
    1. dim. ͸ SwiftUI Ͱ։ൃ͞Εͨ


    2. ৚݅࣍ୈͰ SwiftUI ࠾༻Ձ஋͋Γ


    3. ButtonStyle, ViewModi
    fi
    er


    4. UIKit ΋͓๨Εͳ͘


    5. ֎෦ϥΠϒϥϦͷಈ࡞֬ೝ͸৻ॏʹ
    81

    View Slide

  82. Summary
    1. dim. ͸ SwiftUI Ͱ։ൃ͞Εͨ


    2. ৚݅࣍ୈͰ SwiftUI ࠾༻Ձ஋͋Γ


    3. ButtonStyle, ViewModi
    fi
    er


    4. UIKit ΋͓๨Εͳ͘


    5. ֎෦ϥΠϒϥϦͷಈ࡞֬ೝ͸৻ॏʹ
    82

    View Slide

  83. Summary
    1. dim. ͸ SwiftUI Ͱ։ൃ͞Εͨ


    2. ৚݅࣍ୈͰ SwiftUI ࠾༻Ձ஋͋Γ


    3. ButtonStyle, ViewModi
    fi
    er


    4. UIKit ΋͓๨Εͳ͘


    5. ֎෦ϥΠϒϥϦͷಈ࡞֬ೝ͸৻ॏʹ
    83

    View Slide

  84. Summary
    1. dim. ͸ SwiftUI Ͱ։ൃ͞Εͨ


    2. ৚݅࣍ୈͰ SwiftUI ࠾༻Ձ஋͋Γ


    3. ButtonStyle, ViewModi
    fi
    er


    4. UIKit ΋͓๨Εͳ͘


    5. ֎෦ϥΠϒϥϦͷಈ࡞֬ೝ͸৻ॏʹ
    84

    View Slide

  85. Summary
    1. dim. ͸ SwiftUI Ͱ։ൃ͞Εͨ


    2. ৚݅࣍ୈͰ SwiftUI ࠾༻Ձ஋͋Γ


    3. ButtonStyle, ViewModi
    fi
    er


    4. UIKit ΋͓๨Εͳ͘


    5. ֎෦ϥΠϒϥϦͷಈ࡞֬ೝ͸৻ॏʹ
    85

    View Slide

  86. @AkkeyLab
    86

    View Slide

  87. Thank you !!
    87

    View Slide