SwiftUIとFlutterを比較する

E586b46d5b09f8109beb66bb146e4f20?s=47 tamappe
September 21, 2020

 SwiftUIとFlutterを比較する

前々からチーム内でBitriseを使ってアプリ配信をしたかったのですが、
既存アプリで設定の仕方が分からなかったのでなかなか導入することができませんでした。

大きな問題となっていたのは、弊社アプリが
- 環境別にApp IDを設定していたこと
- Build Configurationで環境別のマクロを設定していたので当然環境別の配信スキームを用意したい
- 全ての環境で同一のKeychainを使っていたが、環境別でKeychainを設定したいという要望
- AppExtentionも使っていたこと
- plistが環境別にDebugとAdhoc用とで分かれている
- ついでにAppStoreへの自動アップロードも整備したい

問題を上げたらキリがないですが、Bitriseを導入する上で上記の問題がありました。
さらに私はProvisioning Profileの知識が乏しかったので、
BitriseのAutoProvisioningがスキーム別に対応できるのかどうかもこの時は正確には把握できていませんでした。
その状況で3月下旬に社内でリモートワーク導入の連絡が入って急遽、強制的にBitrise配信をできるようにしないといけなくなり
急いでBitriseでアプリの配信をできる環境整備に取り掛かりました。

リモートワークまでにBitriseでビルドできるようにまでは設定できるようになりましたが、
なぜかアプリ起動後にクラッシュするというような問題が発生したりでその原因調査に時間がかかりました。
本セッションでは、上記の問題たちをどのように解決していったのか、そして完成した配信スキームを紹介しようと思います。

E586b46d5b09f8109beb66bb146e4f20?s=128

tamappe

September 21, 2020
Tweet

Transcript

  1. SwiftUIͱFlutterΛൺֱ͢Δ iOSDC 2020 Tamappe @tamapppe

  2. I N T R O D U C T I

    O N Tamappe ϞόΠϧΞϓϦΤϯδχΞ 2014೥-2019೥3݄·ͰϑϦʔϥϯεͱͯ͠׆ಈ 2019೥4݄ΑΓϨΞδϣϒʹϞόΠϧΞϓϦΤϯδχΞͱͯ͠ೖࣾ झຯ: ϒϩάͷߋ৽ɺσΟζχʔ८Γ(ίϩφʹΑΓࣗॗ) Qiita: https://qiita.com/tamappe Blog: https://tamappe.com Twitter: https://twitter.com/tamapppe 01 גࣜձࣾϨΞδϣϒ
  3. ຊ೔ͷςʔϚ SwiftUIͱFlutterͷൺֱ

  4. ˎSwiftUI͸FlutterΛͱͯ΋ҙ͍ࣝͯ͠Δͱ͸ࢥ͏ Flutter࠷ߴ ݁࿦...

  5. Ajenda 1. ίϯϙʔωϯτ 2. ϨΠΞ΢τͷ૊Έํ 3. List & Collection

  6. ίϯϙʔωϯτ (Components) 02 View UIViewRespontable StatelessWidget StatefulWdiget ίϯϙʔωϯτ ProtocolͰ४ڌ શ͕ͯWidget

  7. 02 View UIViewRespontable StatelessWidget StatefulWidget ίϯϙʔωϯτ ProtocolͰ४ڌ શ͕ͯWidget ίϯϙʔωϯτ (Components)

    ϓϩτίϧͷྔ͕ଟͯ͘ɺ ࢖͍ํͰ໎͏͜ͱ͕ଟ͍
  8. https://flutter.ctrnost.com/ https://www.youtube.com/channel/ UCwXdFgeE9KYzlDdR7TG9cMw Document / Youtube Channel

  9. 02 View UIViewRespontable StatelessWidget StatefulWidget ίϯϙʔωϯτ ProtocolͰ४ڌ શ͕ͯWidget ϓϩτίϧͷྔ͕ଟͯ͘ɺ ࢖͍ํͰ໎͏͜ͱ͕ଟ͍

    ίϯϙʔωϯτ (Components) Flutter࠷ߴ
  10. 03 VStack (Vertical) ZStack (z-index) SwiftUI HStack (Horizontal) Flutter Column

    (Vertical) Container Row (Horizontal) ϨΠΞ΢τͷ૊Έํ
  11. 03 VStack (Vertical) ZStack (z-index) SwiftUI HStack (Horizontal) Flutter Column

    (Vertical) Container Row (Horizontal) ϨΠΞ΢τͷ૊Έํ FlutterͷRow͕΍΍͍͜͠
  12. 03 VStack (Vertical) ZStack (z-index) SwiftUI HStack (Horizontal) Flutter Column

    (Vertical) Container Row (Horizontal) ϨΠΞ΢τͷ૊Έํ ͜͜͸SwiftUI͔ʁ
  13. 03 VStack (Vertical) ZStack (z-index) SwiftUI HStack (Horizontal) Flutter Column

    (Vertical) Container Row (Horizontal) ϨΠΞ΢τͷ૊Έํ ͜͜͸SwiftUI͔ʁ Ͱ΋Flutter࠷ߴ
  14. 04 Flutter SwiftUI γϣʔτΧοτ

  15. 05 SwiftUI Flutter UIKit UITableView UICollectionView List LazyVGrid / LazyHGrid

    ListView GridView List & Collection
  16. 05 SwiftUI Flutter UIKit UITableView UICollectionView List LazyVGrid / LazyHGrid

    ListView GridView List & Collection iOS13ͰGrid͕࢖͑ͳ͍ɾɾɾ
  17. 05 SwiftUI Flutter UIKit UITableView UICollectionView List LazyVGrid / LazyHGrid

    ListView GridView iOS13ͰGrid͕࢖͑ͳ͍ɾɾɾ List & Collection Flutter ࠷ߴͩΑ
  18. ·ͱΊ

  19. ·ͱΊ 1. ίϯϙʔωϯτ 2. ϨΠΞ΢τͷ૊Έํ 3. List & Collection

  20. ·ͱΊ 1. ίϯϙʔωϯτ 2. ϨΠΞ΢τͷ૊Έํ 3. List & Collection Flutter

    Flutter Flutter
  21. ·ͱΊ Flutter Flutter Flutter 1. ίϯϙʔωϯτ 2. ϨΠΞ΢τͷ૊Έํ 3. List

    & Collection
  22. ·ͱΊ 1. ίϯϙʔωϯτ 2. ϨΠΞ΢τͷ૊Έํ 3. List & Collection Flutter

    Flutter Flutter
  23. ·ͱΊ 1. ίϯϙʔωϯτ 2. ϨΠΞ΢τͷ૊Έํ 3. List & Collection Flutter

    Flutter Flutter
  24. ·ͱΊ 1. ίϯϙʔωϯτ 2. ϨΠΞ΢τͷ૊Έํ 3. List & Collection Flutter

    Flutter Flutter
  25. ·ͱΊ 1. ίϯϙʔωϯτ 2. ϨΠΞ΢τͷ૊Έํ 3. List & Collection Flutter

    SwiftUI Flutter Flutter࠷ߴʂʂ
  26. 06 ٕज़ධ࿦͕ࣾൃץ͍ͯ͠ΔࡶࢽʰSoftware DesignʱͷFlutterಛूͰࣥච͢Δ͜ ͱʹͳΓ·ͨ͠ɻಛूͰ͸ϞόΠϧΞϓϦΤϯδχΞ޲͚ʹFlutterͷັྗΛ 200%ͷ੎͍Ͱ఻͑·͢ɻ10/18ൃץͷ11݄߸Ͱܝࡌɻ ࡶࢽʰSoftware Designʱ(10/18)Ͱࣥච

  27. Thank you!

  28. ͓·͚

  29. σϞ 07

  30. 08

  31. 09

  32. 10 SwiftUI ιʔείʔυ

  33. 11 Flutter ιʔείʔυ

  34. 12 ϦϙδτϦ SwiftUI ιʔείʔυ Flutter ιʔείʔυ https://github.com/tamappe/iosdc_talk_app https://github.com/tamappe/iOSDC20App

  35. शಘ೉қ౓ 13 ɹFlutter: 1ϲ݄ ɹSwiftUI: 2ϲ݄

  36. Φεεϝษڧ๏ 14 ɾSwiftUI͕ඞཁͰͳ͚Ε͹FlutterͰ૊Έํʹ׳ΕΔ ɾFlutter͸1ϲ݄΄ͲͰWidgetͷ֓೦Λཧղ ɾFlutterͷ֓೦ͰSwiftUIΛཧղ͢ΔͱָʹͳΔ