近期需要写一个交互有点DT的日历控件,具体交互细节这里略过不表。

不过再怎么复杂的控件,也是由基础的零配件组装起来的,这里最基本的就是日历控件。

先上图:

从图中可以看出日历控件就是由一个个小方块组成的,每一行有7个小方块,分别表示一周的星期天到星期六。

给定一个月份,我们首先需要知道这个月有多少周。那么如何确定一个月有多少周呢?

我是这么想的,在NSDate上做扩展:

  1. @interface NSDate (WQCalendarLogic)

0. 首先需要知道这个月有多少天:

  1. - (NSUInteger)numberOfDaysInCurrentMonth
  2. {
  3. // 频繁调用 [NSCalendar currentCalendar] 可能存在性能问题
  4. return [[NSCalendar currentCalendar] rangeOfUnit:NSDayCalendarUnit inUnit:NSMonthCalendarUnit forDate:self].length;
  5. }

1. 确定这个月的第一天是星期几。这样就能知道给定月份的第一周有几天:

  1. - (NSDate *)firstDayOfCurrentMonth
  2. {
  3. NSDate *startDate = nil;
  4. BOOL ok = [[NSCalendar currentCalendar] rangeOfUnit:NSMonthCalendarUnit startDate:&startDate interval:NULL forDate:self];
  5. NSAssert1(ok, @"Failed to calculate the first day of the month based on %@", self);
  6. return startDate;
  7. }
  8. - (NSUInteger)weeklyOrdinality
  9. {
  10. return [[NSCalendar currentCalendar] ordinalityOfUnit:NSDayCalendarUnit inUnit:NSWeekCalendarUnit forDate:self];
  11. }

2. 减去第一周的天数,剩余天数除以7,得到倍数和余数:

  1. - (NSUInteger)numberOfWeeksInCurrentMonth
  2. {
  3. NSUInteger weekday = [[self firstDayOfCurrentMonth] weeklyOrdinality];
  4. NSUInteger days = [self numberOfDaysInCurrentMonth];
  5. NSUInteger weeks = 0;
  6. if (weekday > 1) {
  7. weeks += 1, days -= (7 - weekday + 1);
  8. }
  9. weeks += days / 7;
  10. weeks += (days % 7 > 0) ? 1 : 0;
  11. return weeks;
  12. }

到这里,就可以知道一个月有多少行多少列,从而计算出需要多少个小方块来展示:

  1. @interface WQCalendarTileView : UIView

这些小方块用一个大方块来承载:

  1. @interface WQCalendarGridView : UIView
  2. @property (nonatomic, weak) id<WQCalendarGridViewDataSource> dataSource;
  3. @property (nonatomic, weak) id<WQCalendarGridViewDelegate> delegate;
  4. - (void)reloadData;

和UITableView类似,当WQCalendarGridView调用reloadData接口时,会开始进行布局。而布局所需要的信息由dataSource和delegate提供:

  1. @class WQCalendarGridView;
  2. @protocol WQCalendarGridViewDataSource <NSObject>
  3. @required
  4. - (NSUInteger)numberOfRowsInGridView:(WQCalendarGridView *)gridView;
  5. - (WQCalendarTileView *)gridView:(WQCalendarGridView *)gridView tileViewForRow:(NSUInteger)row column:(NSUInteger)column;
  6. @optional
  7. - (CGFloat)heightForRowInGridView:(WQCalendarGridView *)gridView;
  8. @end
  9. @protocol WQCalendarGridViewDelegate <NSObject>
  10. - (void)gridView:(WQCalendarGridView *)gridView didSelectAtRow:(NSUInteger)row column:(NSUInteger)column;
  11. @end

每一行的高度,heightForRow,我比较倾向于由dataSource提供 :)

第一个dataSource方法上面已经可以计算出来了,第二个dataSource方法需要对每一个tile进行配置,比如非当前月的以灰色展示,那么我们就需要知道当前月展示中包含的 上个月残留部分,和 下个月的开头部分:

  1. #pragma mark - method to calculate days in previous, current and the following month.
  2. - (void)calculateDaysInPreviousMonthWithDate:(NSDate *)date
  3. {
  4. NSUInteger weeklyOrdinality = [[date firstDayOfCurrentMonth] weeklyOrdinality];
  5. NSDate *dayInThePreviousMonth = [date dayInThePreviousMonth];
  6. NSUInteger daysCount = [dayInThePreviousMonth numberOfDaysInCurrentMonth];
  7. NSUInteger partialDaysCount = weeklyOrdinality - 1;
  8. NSDateComponents *components = [dayInThePreviousMonth YMDComponents];
  9. self.daysInPreviousMonth = [NSMutableArray arrayWithCapacity:partialDaysCount];
  10. for (int i = daysCount - partialDaysCount + 1; i < daysCount + 1; ++i) {
  11. WQCalendarDay *calendarDay = [WQCalendarDay calendarDayWithYear:components.year month:components.month day:i];
  12. [self.daysInPreviousMonth addObject:calendarDay];
  13. [self.calendarDays addObject:calendarDay];
  14. }
  15. }
  16. - (void)calculateDaysInCurrentMonthWithDate:(NSDate *)date
  17. {
  18. NSUInteger daysCount = [date numberOfDaysInCurrentMonth];
  19. NSDateComponents *components = [date YMDComponents];
  20. self.daysInCurrentMonth = [NSMutableArray arrayWithCapacity:daysCount];
  21. for (int i = 1; i < daysCount + 1; ++i) {
  22. WQCalendarDay *calendarDay = [WQCalendarDay calendarDayWithYear:components.year month:components.month day:i];
  23. [self.daysInCurrentMonth addObject:calendarDay];
  24. [self.calendarDays addObject:calendarDay];
  25. }
  26. }
  27. - (void)calculateDaysInFollowingMonthWithDate:(NSDate *)date
  28. {
  29. NSUInteger weeklyOrdinality = [[date lastDayOfCurrentMonth] weeklyOrdinality];
  30. if (weeklyOrdinality == 7) return ;
  31. NSUInteger partialDaysCount = 7 - weeklyOrdinality;
  32. NSDateComponents *components = [[date dayInTheFollowingMonth] YMDComponents];
  33. self.daysInFollowingMonth = [NSMutableArray arrayWithCapacity:partialDaysCount];
  34. for (int i = 1; i < partialDaysCount + 1; ++i) {
  35. WQCalendarDay *calendarDay = [WQCalendarDay calendarDayWithYear:components.year month:components.month day:i];
  36. [self.daysInFollowingMonth addObject:calendarDay];
  37. [self.calendarDays addObject:calendarDay];
  38. }
  39. }

到此,就可以顺利地展现出给定月份的日历控件了。最近项目比较忙,随手记一篇 :)

copy from http://blog.csdn.net/jasonblog/article/details/21977481

iOS 日历控件的更多相关文章

  1. iOS日历控件

    项目需要,前一阵子重构了下iPad工程,添加了一个滚动无缝日历. 当时没有头绪,网上找了一个源码改吧改吧就上线了(参考链接),这个功能很多而且流畅性也特别好,推荐不会写的可以参考下. 这几天,活不太忙 ...

  2. iOS开发之自定义日历控件

    前言 日常开发中经常会遇到日期选择,为了方便使用,简单封装了一个日历控件,在此抛砖引玉供大家参考. 效果 功能 支持单选.区间 支持默认选中日期 支持限制月份 支持过去.当前.未来模式 支持frame ...

  3. IOS自定义日历控件的简单实现(附思想及过程)

    因为程序要求要插入一个日历控件,该空间的要求是从当天开始及以后的六个月内的日历,上网查资料基本上都说只要获取两个条件(当月第一天周几和本月一共有多少天)就可以实现一个简单的日历,剩下的靠自己的简单逻辑 ...

  4. 在iOS上实现一个简单的日历控件

    http://blog.csdn.net/jasonblog/article/details/21977481 近期需要写一个交互有点DT的日历控件,具体交互细节这里略过不表. 不过再怎么复杂的控件, ...

  5. android日历控件(一)

    自定义日历并且具备设置今天以前的时间不可点选,以前的颜色和当前的颜色不同,以及获取两次点击日期之间间隔的天数所以说细节比较多 个人习惯,先上图 靠,笔记本不知道怎么回事,禁用到触摸板之后 再次唤醒屏幕 ...

  6. JS调用Android、Ios原生控件

    在上一篇博客中已经和大家聊了,关于JS与Android.Ios原生控件之间相互通信的详细代码实现,今天我们一起聊一下JS调用Android.Ios通信的相同点和不同点,以便帮助我们在进行混合式开发时, ...

  7. 初识IOS,Label控件的应用。

    初识IOS,Label控件的应用. // // ViewController.m // Gua.test // // Created by 郭美男 on 16/5/31. // Copyright © ...

  8. JQuery日历控件

    日历控件最后一弹——JQuery实现,换汤不换药.原理一模一样,换了种实现工具.关于日历的终于写完了,接下来研究研究nodejs.嗯,近期就这点事了. 同样还是将input的id设置成calendar ...

  9. 【转】【WebDriver】不可编辑域和日历控件域的输入 javascript

    http://blog.csdn.net/fudax/article/details/8089404 今天用到日历控件,用第一个javascript执行后页面上的日期控件后,在html中可以看到生效日 ...

随机推荐

  1. win7程序关闭后弹出 程序兼容性助手 这个程序可能安装不正确 如果此程序没有正确安装,处理方式

    用WTL编写的程序,编译成release后,在win7上关闭后,弹出这个对话框 处理方法: 将这个xml文件命名成 xxx.exe.manifest,保存到指定目录下 <?xml version ...

  2. IOS 播放音频

    1,播放短音频 #import <AudioToolbox/AudioToolbox.h>#import "GLYViewController.h"static voi ...

  3. squid客户端命令

    常用squid客户端命令: squidclient -p mgr:info #取得squid运行状态信息: squidclient -p mgr:mem #取得squid内存使用情况: squidcl ...

  4. C++ 面向对象学习1

    #include "stdafx.h" #include <iostream> //不要遗漏 否则不能使用cout using namespace std; class ...

  5. 【android开发】小说阅读器

    新人开发理念 1 activity 是每个功能页面的入口 2 动画效果需要配合资源文件中,动画的定义 3 文件的读取是有权限控制的 4 布局应该尽量简单,这样才能让程序跑的飞快 前记 重新开始一个新的 ...

  6. FormView分页显示数据的例子

    %@ Page Language="C#" AutoEventWireup="true" CodeBehind="FormView控件.aspx.cs ...

  7. 基于Visual C++2013拆解世界五百强面试题--题10-找出N个数种最大的K个数

    有一亿个整数,请找出最大的 1000 个,要求时间越短越好, 空间占用越好越好. 如果不考虑时间效率,很容易想到解决方法,我们只需存储前一千个数, 然后依次读入后面的数和这一千个数组比较,替换其中比较 ...

  8. 不同服务器之间使用svn钩子post-commit同步代码遇到的证书认证问题.md

    遇到的问题,以下其他问题都是因解决这个问题引申出来的问题 VisualSVN hooks自动同步更新到web服务器 错误信息如下: Error validating server certificat ...

  9. java学习之即时通信项目实战

     项目总结:这次项目主要是根据视频来的,结果跟到一半感觉跟不上,慢慢自己有了自己的想法,决定自己先不看学习视频,自己先试着写. 总结写前面,算是写的第一个项目吧.项目中遇到几点问题,首先Scoket对 ...

  10. Apache 错误代码配置

    ErrorDocument 400 /error_pages/400.htmlErrorDocument 401 /error_pages/401.htmlErrorDocument 403 /err ...