UIPickerViewの使い方と改善ヒント
iOSアプリを開発すると、UIPickerViewはとても便利なものです。
指のフリックだけで、ユーザに多くのデータを提示することができるため、沢山のアプリで使われていています。
UIPickerViewを使うには、以下のステップが必要です。
- UIPickerViewのインスタンスを作成する
- データ自体を用意する
- UIPickerViewのデータを扱うオブジェクト(DataSource)を定義
- UIPickerViewの表示などを扱うオブジェクト(Delegate)を定義
- DataSourceでComponent(区切り)数やRow(行)数を返すファンクションを用意する
- Delegateで各項目のタイトルを返すファンクションを用意する
- UIPickerViewのデータをロードする
簡単な実例を以下に貼り付けいたしました。
生物のリストをUIPickerViewで表示させる簡単なアプリだけです。
ご覧の通り、
生物の順番が作成した順番となって、生物の種類(Kingdom(哺乳類、鳥類、昆虫類、など))を見分けられないのはあまりよくないと思います。
以下の改善に取り組みましょう!
- 生物を種類にまとめる
- 生物の種類によって文字色を設定する
生物を種類にまとめる
これは一行でできることです!
データで使われるArrayにsortInPlaceファンクションを掛けて、Animalのkingdom値で順番を変更する。
Animal.Species.sortInPlace { $0.kingdom.hashValue < $1.kingdom.hashValue }
生物の種類によって文字色を設定する
これを実現するには、UIPickerViewDelegateの”titleForRow”のファンクションを消去し、”attributedTitleForRow”のファンクションを設置する必要があります。
例は以下に貼り付けています。