UIKit - shirai/SwiftLearning GitHub Wiki

項目学習 「基本的な部品の使い方」

UIコンポーネントについて

外部サイトを利用して、iOSで利用できる標準UIコンポーネントを理解する

UIKitUICatalog

以下の日本語サイトでも良い（情報量少し物足りないかもだけど）

目的

  • UI要素の種類や各UI要素の役割・使い分けを学ぶ

そもそもどんな部品があるのか、を知らなければデザインからどのUI要素を利用する想定なのかわからない。

到達目標

  • UI要素の名称と見た目＆機能を紐付けて覚えている
    • 自分「あの、あれです、あの青くてなんか切り替わるヤツ！」
    • 先輩「Segmentted Controls?」
    • 自分「...何それ？」
      ってならないようにする。
      会話の中でもパーツ名が普通に出てくるので会話についていけるように覚えておく。
  • デザイン画像から、そのデザインを実現するためのUI要素を特定することができる
    • 各UI要素について、やろうと思えば分類の垣根を超えた役割を実装することも可能(*)だが、
      「各UIが持つ役割を理解し、機能実現のために利用するUIが分かる」ことを目指す。
      ※分類の垣根を超えた実装：「ボタン」を下に固定で配置してタブ切り替えをさせることもできる
      　→ 本来それは「バー」の役割なのでtabバーを利用するべき
  • 上記は先にデザインが提供されていること前提だが、
    「こんな機能が必要 → このUI要素を使う → こんなデザインにする」
    という機能からデザインを考えることができるようになるとより良い。
    • 「標準UIで実現できないデザインを受領した時に、機能を読み解き実現可能なデザインを提示する」というケースを想定

進め方

  • 学習の成果をまとめて残す
    • Markdown記法(md)で書く
      • 学習の記録はmdで残す
        エンジニア界隈ではmdが書けるのが基本（ソースコメント・Qiita・Githubなど、求められる場面は多い）
  • より良いサイトとかあれば随時共有
    • 更新頻度が高く、サンプルソースも載っているのがベスト

手順

  1. iOSのデフォルトUIコンポーネントを知るを読み込む
    1. 随時学習の記録を残す
  2. アプリのスクショに利用しているであろうコンポーネントをメモ
    • アプリはiOS標準の「リマインダー」アプリ
      • Apple公式アプリ＝ガイドライン準拠したアプリ
  3. レビュー出す（単語一覧に更新あれば一緒に出す）

成果物

  • 学習記録Repository
    • 朝会や週次の学習成果確認会で内容をレビュー
  • アプリスクショにコンポーネントメモ（レビュー済み）
    • リマインダーアプリは以下の画面を対象とする（画面の名称は正式ではないがここでは以下とする）
      • タスク一覧画面
        1
      • タスク詳細画面
        2
        • アラームタップ時
          2-1 _
      • 繰り返し設定画面
        3
      • 繰り返しカスタム画面
        4