iOS实现日历翻页动画

2020-01-15 17:45:32刘景俊

本文我主要描述两方面:

    1.日历(简单描述原理)

    2.翻页动画(重点)

最终的效果如下图:

    图中沿四个对角的翻页动画,代表对应方向手势的滑动

ios,日历翻页效果,日历开发,ios调用系统日历

1. 日历

要实现一个日历,其实原理很简单,我们只要知道三个数据:

    1.今天是哪一天

    2.这个月的第一天是星期几(哪天)

    3.这个月总共有多少天

根据这个三个数据,就可以把得到的日期显示在日历上了,至于日历用什么来显示,我个人比较喜欢用UICollectionView,一个cell代表一天,当然也可以用很多个label,button来显示。

1.获取今天是哪一天

这个应该是最简单的: NSDate() , 就可以获取当前的日期

2.获取这个月的第一天是星期几(哪天)

下面的方法都是作为NSDate的extension扩展的


//当前月第一天
func firstDateOfCurrentMonth() ->NSDate{
  let calendar = NSCalendar(identifier:NSCalendarIdentifierGregorian )
  let currentDateComponents = calendar!.components([.Year,.Month], fromDate: self)
  let startOfMonth = calendar!.dateFromComponents(currentDateComponents)
  let date = startOfMonth?.dateByAddingTimeInterval(8*60*60)
  return date!
}

//当前月的第一天是星期几
func firstDayOfCurrentMonth() -> Int {
  let calendar = NSCalendar.currentCalendar()
  let components = calendar.components(.Weekday, fromDate: firstDateOfCurrentMonth())
  return components.weekday-1
}

3.获取这个月总共有多少天

根绝上面这些数据,就可以得到日历里面每个格子应该显示的日期,具体的显示和有关日期的三个主要的类: NSDate, NSCalendar, NSDateComponents 由于不是本文的重点,我这里就不详细说了,如果有不明白的可以去看一下文档,或者如果我下次写一个详细的关于这三个类的(又挖一个坑。。)。

2. 翻页动画

动画思路:

上面的动画属于转场动画的一种,所以我们可以利用CATrasition进行动画,CATransition的使用非常简单,只要设置动画时长,时间函数,fillMode等,就可以得到想要的动画,CATransitiontype代表的是过渡时候的动画效果,subType一般代表动画的方向,但是查看了一下CATransitiontype属性,官方文档里面只描述了下面四种预定义的转场动画效果:


NSString * const kCATransitionFade;
NSString * const kCATransitionMoveIn;
NSString * const kCATransitionPush;
NSString * const kCATransitionReveal;