UIPickerViewの使い方と改善ヒント

iOSアプリを開発すると、UIPickerViewはとても便利なものです。
指のフリックだけで、ユーザに多くのデータを提示することができるため、沢山のアプリで使われていています。

UIPickerViewを使うには、以下のステップが必要です。

  1. UIPickerViewのインスタンスを作成する
  2. データ自体を用意する
  3. UIPickerViewのデータを扱うオブジェクト(DataSource)を定義
  4. UIPickerViewの表示などを扱うオブジェクト(Delegate)を定義
  5. DataSourceでComponent(区切り)数やRow(行)数を返すファンクションを用意する
  6. Delegateで各項目のタイトルを返すファンクションを用意する
  7. UIPickerViewのデータをロードする

簡単な実例を以下に貼り付けいたしました。
生物のリストをUIPickerViewで表示させる簡単なアプリだけです。

ご覧の通り、
生物の順番が作成した順番となって、生物の種類(Kingdom(哺乳類、鳥類、昆虫類、など))を見分けられないのはあまりよくないと思います。
以下の改善に取り組みましょう!

  1. 生物を種類にまとめる
  2. 生物の種類によって文字色を設定する

生物を種類にまとめる

これは一行でできることです!
データで使われるArrayにsortInPlaceファンクションを掛けて、Animalのkingdom値で順番を変更する。

Animal.Species.sortInPlace { $0.kingdom.hashValue < $1.kingdom.hashValue }

生物の種類によって文字色を設定する

これを実現するには、UIPickerViewDelegateの”titleForRow”のファンクションを消去し、”attributedTitleForRow”のファンクションを設置する必要があります。

例は以下に貼り付けています。

Related Post