Swiftで遊ぼう！ - 328 - My Picker Project : カスタム Picker View

Swiftで遊ぼう！の古い記事-> Life-LOG OtherSide
質問 : Swiftで遊ぼう！ - 252 - FaceViewプロジェクト始動 - Swiftで遊ぼう! on Hatena

次はピッカー表示に文字ではなくイメージを使うカスタムPicker Viewを考えていきます。

いつものようにCustomPickerViewControllerファイルを用意します。

class CustomPickerViewController: UIViewController,
            UIPickerViewDelegate, UIPickerViewDataSource {

表示させるためのイメージをプロパティとして用意します。

private var images:[UIIMage]!

次はMain.storyboardにオブジェクトを並べる必要があります。Picker View、Label、Buttonをオブジェクト・ライブラリから引っぱってきます。当然、コンストレイントを設定*1します。Labelを選択して、アトリビュート・インスペクタからテキストサイズを48ポイントにして、明るく目立つ色に変えてから、タイトルの「Label」を消去します。消去するとMain.storyboard上で選択することができなくなるので、Document Outlineで操作するようになります。

それぞれのオブジェクトを「Ctrl + ドラッグ」してコード上にOutletとActionを作ります。Picker Viewに、「picker」、LabelはDocument Outlineからラベルを引っぱって、「winLabel」にします。Buttonは「spin()」にします。

pickerにデリゲーションの設定をしないといけないので、data sourceとdelegateを繋げます。

それと、今回はスロットマシーンのようなミニゲームを作るので、pickerにインタラクションを要りません。アトリビュート・インスペクタのViewにあるUser Interaction Enabledチェックボックスを外しておきます。

今日はここまで。

*1:こういう説明もちゃんとしないといけませんが、もう何度もしているのでパスします。タイトルの無いオブジェクトを操作する場合、Document Outlineを使用すると便利です。