iOS

月と日を選択するpickerを作る

投稿日:2017年9月15日 更新日:

はじめに

日付を選択するピッカーが必要になった場合、iOSアプリではUIDatePickerクラスを使えば簡単に作ることができますが、
反面、表示を細かくカスタマイズしたい場合に融通がきかないところがあります。

今回、月と日にちのみを選択するピッカーが必要になったので、UIPickerViewクラスのカスタムクラスを実装して対応しました。

前提条件

  • Xcode 8.3.3
  • Swift version 3.1

 

サンプル

ピッカーのイメージ

実装したピッカーのイメージは下記の通りです。

ピッカーイメージ

ピッカーのxibファイル

ピッカーのxibファイルの内容は下記画像の通りです。
UIButtonの下にUIPickerViewを配置しています。

xibファイル

実装したカスタムクラス

今回作成したカスタムピッカーのコードは下記の通りです。

呼び出し元のコード

呼び出し元のコードは下記の通りです。

 

簡単な解説

MonthAndDayPickerView.swift

3行目:UIPickerViewに関するプロトコルを採用します。

8行目:月ごとに最大日数が異なりますので、1月から12までの各月の日数を定義します。

49〜51行目:ピッカーのコンポーネント数を返します(月と日にちを選択できるので2を返す)

53〜62行目:各コンポーネントの行数を返します。ピッカーが生成されたタイミングとコンポーネントがリロードされたタイミングで実行されます。

66〜74行目:コンポーネントに表示する文字列を返します。

76〜82行目:コンポーネントの値が変化したタイミングで実行されます。月が変更されたタイミングで日にちのコンポーネントをリロードします。

ViewController.swift

12行目:UITextFieldのinputViewにカスタムピッカービューを代入しています。これにより、テキストフィールドをタップした時にピッカーが表示されるようになります。

13〜16行目:カスタムピッカーのDoneボタンにアクションを追加しています。これにより、Doneボタンがタップされた時にdatePickerSelectedメソッドが実行されるようになります。

19〜22行目:Doneボタンがタップされた時にテキストフィールドを更新してピッカーを非表示にします。
 

さいごに

月と日にちを選択できるUIPickerViewのカスタムクラスを実装しました。

iOSアプリ開発はObjective-Cのシンタックスに違和感を感じることから敬遠していましたが、Swiftのシンタックスはかなり書きやすいと思います。
以前Objective-Cで開発していた方は、この機会にSwiftを初めてみてはいかがでしょうか。

blog-page_footer_336




blog-page_footer_336




-iOS

執筆者:


comment

メールアドレスが公開されることはありません。

CAPTCHA


関連記事

swift

[Swift 3] テキストの装飾(フォント・文字サイズ・文字間隔・行間・文字色・下線)

1 はじめに2 フォント・文字サイズ変更3 文字間隔4 行間5 文字色6 下線7 さいごに8 おすすめ書籍 はじめに どうもはじめです。 今回は文字の装飾をやってみようと思います。 完成図を載せておき ...

[Swift]ループできるページングビューをUIScrollViewで作ってみた

1 はじめに1.1 前提条件2 ページングビューとは3 実装3.1 Storyboardの準備3.2 コードの実装4 仕組み5 さいごに はじめに こんにちは、nukkyです。 スライドショーやウォー ...

Xcode11のデバッグ機能

1 はじめに2 Device Conditions2.1 Thermal state condition2.2 Network link condition3 Environment Override ...

swift

[Swift]いろんなインジケータを提供してくれるNVActivityIndicatorView

1 はじめに2 準備3 実装3.1 ストーリーボードで表示を変更する3.2 コードで表示を変更する4 さいごに はじめに こんにちは、nukkyです。 今回はアプリに欠かせないインジケータをいろんなパ ...

swift

Swift3でSCLAlertViewを使ってみた

1 はじめに2 準備3 実装 はじめに 今回はSwiftでフラットなデザインの アニメーション付きアラートビューが扱える SCLAlertViewを試してみたいと思います。 準備 おなじみCocoaP ...

フォロー

follow us in feedly

blog-page_side_responsive

2017年9月
 12
3456789
10111213141516
17181920212223
24252627282930

アプリ情報

私たちは無料アプリもリリースしています、ぜひご覧ください。 下記のアイコンから無料でダウンロードできます。
Get it on App Store
Get it on Google Play