[開発日記]JTAppleCalendarでもう少しカスタマイズしてみた①~月の表示~
前回は、JTAppleCalendarを使って、簡単にカレンダーの表示をしてみました、(前回の記事はこちら)
まだ、見栄えは十分ではないので、もう少し整えていこうと思います。
月の表示
今の状態だと、今見ているのが何年の何月かわかりません...なので、まずはそれを表示できるようにしようと思います。こんな感じに変えていきます。
1.NavigationBarを追加
まずは、Main.storyboard
に月を表示するためのNavigationBarを追加していきましょう。
今回は、カレンダーに使った色と同じ色になるようにします。つい、CalendarのViewControllerで編集しようとして、あれ!?できない!?って焦りますが、NavigationControllerの方で編集です。知っててもたまに間違える...。
また、デフォルトでは半透明色になるので、今回はそれも解除します。(Translucentのチェックを外す。)
2.MainCalendarViewDelegateの作成・設定
今回、MainCalendarView
に、JTAppleCalendarのカレンダーであるcalendarView
があり、calendarViewがスクロールされた時に呼ばれるdelegateはMainCalendarView
内にあります。
つまり、calendarView
がスクロールされた時は、MainCalendarView
がそれを感知して、何かしらの処理を実行できます。
しかし、今の状態では、calendarView
がスクロールされた事を、ViewController
が感知し処理を実行(今回は月を表示)する事ができません。なので、MainCalendarViewからViewControllerに継承できるように、Delegateを設定しましょう。
まず、MainCalendarView.swift
にMainCalendarViewDelegateを書いていきます。
protocol MainCalendarViewDelegate: class {
func changeMonth(month: String)
}
続いて、MainCalendarView
にdelegateを宣言しましょう。現在の日付を保存しておく変数として、currentMonth
も宣言します。
var currentMonth: String!
var calendarDelegate: MainCalendarViewDelegate?
ここで、currentMonth
を変更するchangeCurrentMonth
メソッドも書いておきましょう。
func changeCurrentMonth(from visibleDates: DateSegmentInfo) {
guard let startDate = visibleDates.monthDates.first?.date else {
return
}
let month = Calendar(identifier: .gregorian).dateComponents([.month], from: startDate).month
let monthName = DateFormatter().monthSymbols[Int(month!)-1]
let year = Calendar(identifier: .gregorian).component(.year, from: startDate)
currentMonth = monthName + " " + String(year)
}
では、次に、実際に、スクロールされた時に、monthChanged
メソッドを実行するようにコードを書きます。monthChangedextension MainCalendarView: JTAppleCalendarViewDelegate
の中に書きます。
func calendar(_ calendar: JTAppleCalendarView, didScrollToDateSegmentWith visibleDates: DateSegmentInfo) {
self.changeCurrentMonth(from: visibleDates)
calendarDelegate?.changeMonth(month: currentMonth)
}
これで、下準備は全て終わりです。月表示のコードを書いていきましょう。
3.ViewControllerで月表示
まず、MainCalendarViewを宣言します。関連付けも忘れずに。
合わせて、現在の月をいれておく変数currentMonth
も宣言しておきましょう。currentMonth
が変更されたら、navigationItemのタイトルが変更されるようにしておきます。
@IBOutlet var mainCalendar: MainCalendarView!
var currentMonth: String! = String() {
didSet {
self.navigationItem.title = currentMonth
}
}
```swift:ViewController.swift
mainCalendar.calendarDelegate = self
mainCalendar.calendarView.scrollToDate(Date())
最後に、currentMonth
を実際に変更します。
extension ViewController: MainCalendarViewDelegate {
func changeMonth(month: String) {
currentMonth = month
}
}
完成!
Author And Source
この問題について([開発日記]JTAppleCalendarでもう少しカスタマイズしてみた①~月の表示~), 我々は、より多くの情報をここで見つけました https://qiita.com/tanirei/items/790e7124ba67232c1434著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .