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

詳解Storyboard

coe
September 21, 2020
3.5k

 詳解Storyboard

2019年、SwiftUIという新しいUI記述方法が導入されました。
SwiftUIでは宣言型シンタックスを導入し、Appleの各プラットフォームに対し、シンプルなUIコードの記述ができるようになりました。
しかしながら、SwiftUIにない機能を使いたい、あるいはサポートするOSの関係でSwiftUIの導入ができないなど、他の手段でUIを構築することはまだあるかと思います。

そのUIの構築方法の一つであるStoryboardは、GUIベースでのUIデザインツールとしてのイメージを持たれている方が多いと思いますが、UIデザインツールとしての側面だけでなく、様々な機能が盛り込まれています。

- リストア機能を使って、バックグラウンド状態からKillされても元の状態に戻し、ユーザー体験を損なわない
- FirstResponderを使って、手軽にUndo、Redoなどを実装する
- 言語だけではない、ロケールごとの画面遷移方法の設定
- コードとデザインを分離し、iPhone、iPadなどの様々な画面サイズや、tvOSなどのプラットフォームでコードを共通化する
- OSバージョン別にUIをデザインする
- Objectを使って、ViewControllerにコードをFatに書かない、あるいはViewControllerを全く用意しないアプリを作る

など、UIの作成にとどまらない、あなたのコードライティング時間をより多くビジネスロジックに回せるようなStoryboardの活用法をお伝えします。

coe

September 21, 2020
Tweet

Transcript

  1. "CPVU w ೔޲ڧʢ5TVZPTIJ)ZVHBʣ w "NB[JB JOD w !DP⒎FFHZVOZV w J1IPOF04ʙ

    w "OESPJE%POVUʙ w %BZʮ͋ͳͨͷ஌Βͳ͍࿈བྷઌͷੈքʯ
  2. 3FTUPSBUJPOͷ࣮૷ w 4UPSZCPBSEͰ෮ݩ͍ͨ͠γʔϯʹରͯ͠3FTUPSBUJPO*%ΛೖΕ͓ͯ͘ w 6*"QQMJDBUJPO%FMFHBUFͷ3FTUPSFܥϝιουΛUSVFʹ͢Δ w BQQMJDBUJPO @TIPVME4BWF4FDVSF"QQMJDBUJPO4UBUF  w

    BQQMJDBUJPO @TIPVME3FTUPSF4FDVSF"QQMJDBUJPO4UBUF  w BQQMJDBUJPO @TIPVME4BWF"QQMJDBUJPO4UBUF  w BQQMJDBUJPO @TIPVME3FTUPSF"QQMJDBUJPO4UBUF ͜Ε͚ͩʂ
  3. ϦετΞͷ͘͠Έ w ΞϓϦ͕όοΫάϥ΢ϯυʹͳͬͨ৔߹ɺݱࡏͷঢ়ଶΛ෮ݩϙΠϯτͱ͠ ͯΞʔΧΠϒ࡞੒͢Δ w Կ͔ͷഥࢠʹΞϓϦ͕࠶ىಈͱͳͬͨ৔߹ɺinit(coder:)ʹͯΞʔΧΠϒ͠ ͨ෮ݩϙΠϯτ DPEFS ͔ΒҎલͷঢ়ଶʹ໭͢ w

    JOJU DPEFS ͸ɺ6*7JFX΍6*7JFX$POUSPMMFS͕/4$PEJOHʹద߹͍ͯ͠ ΔͨΊɺඞཁʹͳΔ w JOJU DPEFS ͸ɺΞʔΧΠϒ͔ΒΠϯελϯεΛ࡞ΔॲཧશൠͰ࢖ΘΕΔ
  4. -PDBMJ[BUJPO w ੏ͱ໊ͷςΩετϑΟʔϧυ͕ฒͿ w ӳޠͰೖྗ͢Δ৔߹ɺ(JWFO OBNF ໊ ˠ'BNJMZ/BNF ੏ ͷೖྗ͕

    ҰൠతͳͷͰ୯७ͳϩʔΧϥΠζͩͱෆ ࣗવͳॱ൪ʹςΩετϑΟʔϧυ͕ฒͿ
  5. -PDBMJ[BUJPO w ੏ͱ໊ͷςΩετϑΟʔϧυ͕ฒͿ w ӳޠͰೖྗ͢Δ৔߹ɺ(JWFO OBNF ໊ ˠ'BNJMZ/BNF ੏ ͷೖྗ͕Ұ

    ൠతͳͷͰ୯७ͳϩʔΧϥΠζͩͱෆࣗ વͳॱ൪ʹςΩετϑΟʔϧυ͕ฒͿ w ϛυϧωʔϜ΍ɺ+SͳͲΛࣔ͢4V⒏Y OBNF͕ඞཁͳਓ΋͍ΔͷͰɺ੏ͱ໊ͷ ςΩετϑΟʔϧυͰ͸଍Γͳ͍৔߹͕ ͋Δ
  6. 04όʔδϣϯ͝ͱʹ4UPSZCPBSEΛࠩ͠ସ͑Δ w 6*4UPSZCPBSE4FHVFͷΧελϜΫϥεΛ࡞Δ w QFSGPSN ΛΦʔόʔϥΠυͯ͠BWBJMBCMFͰόʔδϣϯνΣοΫͯ͠ 4UPSZCPBSEΛࠩ͠ସ͑Δ w ैདྷͷॲཧͰྑ͚Ε͹TVQFSQFSGPSN 

    w 4UPSZCPBSEͷதʹಛఆͷόʔδϣϯΛཁٻ͢ΔΦϒδΣΫτʢ"37JFX ͳͲʣΛ࢖͏ʹ͸*OUFSGBDF#VJMEFS%PDVNFOUͷ#VJMETGPSͷόʔδϣ ϯΛ্͛Δ
  7. -PBE7JFX$POUSPMMFSͷ͠͝ͱมߋޙ #VUUPOλοϓ w ϘλϯΛԡͨ͠Β w ΫϦοΫԻΛग़͢ w ΫϦοΫԻΛग़͢0CKFDU͕୲౰ w )BQUJDΛ࣮ߦ

    w )BQUJDΛ࣮ߦ͢Δ0CKFDU͕୲౰ w σʔλͷϩʔυΛߦ͏ w σʔλͷϩʔυΛߦ͏0CKFDU͕୲౰ w ը໘Λϩʔυதʹมߋ w -PBE7JFX$POUSPMMFS͕୲౰ -PBE7JFX$POUSPMMFS͸ը໘มߋͷλεΫͷΈʹͳΔ
  8. -PBE7JFX$POUSPMMFSͷ͠͝ͱ #VUUPOλοϓ w ϘλϯΛԡͨ͠Β w ΫϦοΫԻΛग़͢ w ΫϦοΫԻΛग़͢0CKFDU͕୲౰ w )BQUJDΛ࣮ߦ

    w )BQUJDΛ࣮ߦ͢Δ0CKFDU͕୲౰ w σʔλͷϩʔυΛߦ͏ w σʔλͷϩʔυΛߦ͏0CKFDU͕୲౰ w ը໘Λϩʔυதʹมߋ w -PBE7JFX$POUSPMMFS͕୲౰
  9. ௨৴ऴྃͨ࣌͠ w 4PVOE0CKFDU w ௨৴੒ޭࣦഊͷԻΛग़͢ w )BQUJD0CKFDU w ௨৴੒ޭࣦഊͷৼಈΛग़͢ w

    -PBE7JFX$POUSPMMFS w ϩʔυը໘ΛऴΘΔ ෳ਺EFMFHBUFͱͯ͠ಈ࡞͍ͨ͠ΦϒδΣΫτ͕͍Δ
  10. ·ͱΊ w *#4FHVF"DUJPO w 3FTUPSBUJPO w 4UPSZCPBSEͷ෼ׂ w -PDBMJ[BUJPO w

    'JSTU3FTQPOEFS w 04όʔδϣϯຖͷ4UPSZCPBSEʢ$VTUPNTFHVFʣ w 4J[F$MBTTFT w 0CKFDU