欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

iOS自定义日历控件的简单实现过程

程序员文章站 2023-12-20 09:01:34
因为程序要求要插入一个日历控件,该空间的要求是从当天开始及以后的六个月内的日历,上网查资料基本上都说只要获取两个条件(当月第一天周几和本月一共有多少天)就可以实现一个简单的...

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

1.首先做nsdate类目,扩展一些方法让日期之间转换更加方便

#import <foundation/foundation.h>

@interface nsdate (lywcalendar)

#pragma mark - 获取日
- (nsinteger)day:(nsdate *)date;
#pragma mark - 获取月
- (nsinteger)month:(nsdate *)date;
#pragma mark - 获取年
- (nsinteger)year:(nsdate *)date;
#pragma mark - 获取当月第一天周几
- (nsinteger)firstweekdayinthismonth:(nsdate *)date;
#pragma mark - 获取当前月有多少天
- (nsinteger)totaldaysinmonth:(nsdate *)date;

@end

下面一一实现这些方法

#import "nsdate+lywcalendar.h"

@implementation nsdate (lywcalendar)

/**
 *实现部分
 */
#pragma mark -- 获取日
- (nsinteger)day:(nsdate *)date{
 nsdatecomponents *components = [[nscalendar currentcalendar] components:(nscalendarunityear | nscalendarunitmonth | nscalendarunitday) fromdate:date];
 return components.day;
}

#pragma mark -- 获取月
- (nsinteger)month:(nsdate *)date{
 nsdatecomponents *components = [[nscalendar currentcalendar] components:(nscalendarunityear | nscalendarunitmonth | nscalendarunitday) fromdate:date];
 return components.month;
}

#pragma mark -- 获取年
- (nsinteger)year:(nsdate *)date{
 nsdatecomponents *components = [[nscalendar currentcalendar] components:(nscalendarunityear | nscalendarunitmonth | nscalendarunitday) fromdate:date];
 return components.year;
}

#pragma mark -- 获得当前月份第一天星期几
- (nsinteger)firstweekdayinthismonth:(nsdate *)date{
 nscalendar *calendar = [nscalendar currentcalendar];
 //设置每周的第一天从周几开始,默认为1,从周日开始
 [calendar setfirstweekday:1];//1.sun. 2.mon. 3.thes. 4.wed. 5.thur. 6.fri. 7.sat.
 nsdatecomponents *comp = [calendar components:(nscalendarunityear | nscalendarunitmonth | nscalendarunitday) fromdate:date];
 [comp setday:1];
 nsdate *firstdayofmonthdate = [calendar datefromcomponents:comp];
 nsuinteger firstweekday = [calendar ordinalityofunit:nscalendarunitweekday inunit:nscalendarunitweekofmonth fordate:firstdayofmonthdate];
 //若设置从周日开始算起则需要减一,若从周一开始算起则不需要减
 return firstweekday - 1;
}
#pragma mark -- 获取当前月共有多少天

- (nsinteger)totaldaysinmonth:(nsdate *)date{
 nsrange daysinlastmonth = [[nscalendar currentcalendar] rangeofunit:nscalendarunitday inunit:nscalendarunitmonth fordate:date];
 return daysinlastmonth.length;
}

接下来就要写逻辑部分了,在viewcontroller里面实现,先说思想,首先想到的是用collectionview,但是每个月天数不一样在日历中的显示就不一样,有时候有五行有时候有六行,既然要用自动填充就必须考虑到这一点,下面是代码实现

#import "viewcontroller.h"
#import "macro.h"
#import "nsdate+lywcalendar.h"
#import "lywcollectionviewcell.h"
#import "lywcollectionreusableview.h"

定义一些全局变量

static nsstring *cellid = @"cellid";
static nsstring *headerid = @"headerid";
static nsstring *footerid = @"footerid";

@implementation viewcontroller
{
 //自动布局
 uicollectionviewflowlayout *_layout;
 //表格视图
 uicollectionview *_collectionview;
 //当月第一天星期几
 nsinteger firstdayinmounthinweekly;
 nsmutablearray *_firstmounth;
 //容纳六个数组的数组
 nsmutablearray *_sixarray;
 
}

//定义星期视图,若为周末则字体颜色为绿色
 self.automaticallyadjustsscrollviewinsets = no;//关闭自动适应
 nsarray *weektitlearray = @[@"周日",@"周一",@"周二",@"周三",@"周四",@"周五",@"周六"];
 for (int i = 0; i < weektitlearray.count; i++) {
 uilabel *weektitlelable = [[uilabel alloc]initwithframe:cgrectmake(i * ((screenwidth/(weektitlearray.count))), 64, screenwidth/(weektitlearray.count ), 30)];
 if (i == 0 || i == 6) {
  weektitlelable.textcolor = [uicolor greencolor];
 }else{
  weektitlelable.textcolor = [uicolor blackcolor];
 }
 weektitlelable.text = [weektitlearray objectatindex:i];
 weektitlelable.textalignment = nstextalignmentcenter;
 [self.view addsubview:weektitlelable];
}
//设置collectionview及自动布局,代理方法尤为重要
 _layout = [[uicollectionviewflowlayout alloc]init];
 //头部始终在顶端
 _layout.sectionheaderspintovisiblebounds = yes;
 //头部视图高度
 _layout.headerreferencesize = cgsizemake(414, 40);
 _layout.minimumlinespacing = 0;
 _layout.minimuminteritemspacing = 0;
 _collectionview = [[uicollectionview alloc]initwithframe:cgrectmake(0, 64 + 30, screenwidth, screenheight - 64 - 30) collectionviewlayout:_layout];
 _collectionview.backgroundcolor = [uicolor whitecolor];
 //注册表格
 [_collectionview registerclass:[lywcollectionviewcell class] forcellwithreuseidentifier:cellid];
 //注册头视图
 [_collectionview registerclass:[lywcollectionreusableview class] forsupplementaryviewofkind:uicollectionelementkindsectionheader withreuseidentifier:headerid];
 //注册尾视图
// [_collectionview registerclass:[uicollectionreusableview class] forcellwithreuseidentifier:footerid];
   _collectionview.delegate = self;
 _collectionview.datasource = self;
 [self.view addsubview:_collectionview];

逻辑部分,这里有个比较长的三项表达式

(daysinmounth > 29 && (firstdayinthismounth == 6 || firstdayinthismounth ==5) ? 42 : 35)

就是日历到底是六行还是七行,这就要根据日历的特性来判断了,如果当月天数大于29天并且当月第一天星期六(以这个程序的准则)或者星期天是返回六行剩下的返回三行,也有可能返回四行的,但是就这个程序来说是不可能的也就不需要做判断了

 //numbermounthes 为宏定义,表示要显示月的个数,程序要求是六个月,所以宏定义为六
  //#define numbermounthes 6 //想要展示的月数

//创建六个数组,并将这六个数组装入大数组中
 _sixarray = [[nsmutablearray alloc]init];
 for (int i = 0; i < numbermounthes ; i++ ) {
 nsmutablearray *array = [[nsmutablearray alloc]init];
 [_sixarray addobject:array];
 }
 //为六个数组写入每个月的日历信息
 for (int i = 0 ; i < numbermounthes; i++) {
 //获取月份
 int mounth = ((int)[currentdate month:currentdate] + i)%12;
 nsdatecomponents *components = [[nsdatecomponents alloc]init];
 //获取下个月的年月日信息,并将其转为date
 components.month = mounth;
 components.year = 2016 + mounth/12;
 components.day = 1;
 nscalendar *calendar = [nscalendar currentcalendar];
 nsdate *nextdate = [calendar datefromcomponents:components];
 //获取该月第一天星期几
 nsinteger firstdayinthismounth = [nextdate firstweekdayinthismonth:nextdate];
 //该月的有多少天daysinthismounth
 nsinteger daysinthismounth = [nextdate totaldaysinmonth:nextdate];
 nsstring *string = [[nsstring alloc]init];
 for (int j = 0; j < (daysinmounth > 29 && (firstdayinthismounth == 6 || firstdayinthismounth ==5) ? 42 : 35) ; j++) {
  if (j < firstdayinthismounth || j > daysinthismounth + firstdayinthismounth - 1) {
  string = @"";
  [[_sixarray objectatindex:i]addobject:string];
  }else{
  string = [nsstring stringwithformat:@"%ld",j - firstdayinthismounth + 1];
  [[_sixarray objectatindex:i]addobject:string];
  }
 }
 }

下面是代理方法

//这两个不用说,返回cell个数及section个数
- (nsinteger)collectionview:(uicollectionview *)collectionview numberofitemsinsection:(nsinteger)section{
 return [[_sixarray objectatindex:section] count];
}

- (nsinteger)numberofsectionsincollectionview:(uicollectionview *)collectionview{
 return _sixarray.count;
}

//这里是自定义cell,非常简单的自定义
- (uicollectionviewcell *)collectionview:(uicollectionview *)collectionview cellforitematindexpath:(nsindexpath *)indexpath{
 lywcollectionviewcell *cell = [collectionview dequeuereusablecellwithreuseidentifier:cellid forindexpath:indexpath];
 uiview *blackgroundview = [[uiview alloc]initwithframe:cgrectmake(0, 0, cell.frame.size.width, cell.frame.size.height)];
 blackgroundview.backgroundcolor = [uicolor yellowcolor];
 cell.datelable.text = [[_sixarray objectatindex:indexpath.section]objectatindex:indexpath.row];
 nsdate *date = [[nsdate alloc]init];
 nsinteger day = [date day:date];
  //设置单击后的颜色
   cell.selectedbackgroundview = blackgroundview;
 return cell;
}

自定义cell  .h

#import <uikit/uikit.h>

@interface lywcollectionviewcell : uicollectionviewcell

@property (nonatomic,strong) uilabel *datelable;

- (instancetype)initwithframe:(cgrect)frame;

@end

.m

#import "lywcollectionviewcell.h"

@implementation lywcollectionviewcell

- (instancetype)initwithframe:(cgrect)frame{
 if (self == [super initwithframe:frame]) {
 _datelable = [[uilabel alloc] initwithframe:self.bounds];
 [_datelable settextalignment:nstextalignmentcenter];
 [_datelable setfont:[uifont systemfontofsize:17]];
 _datelable.textcolor = [uicolor blackcolor];
 [self addsubview:_datelable];
 }
 return self;
}
@end

接着代理

//cell大小及间距
- (cgsize)collectionview:(uicollectionview *)collectionview layout:(uicollectionviewlayout *)collectionviewlayout sizeforitematindexpath:(nsindexpath *)indexpath{
 return cgsizemake(screenwidth/7, screenwidth/7);
}

- (uiedgeinsets)collectionview:(uicollectionview *)collectionview layout:(uicollectionviewlayout *)collectionviewlayout insetforsectionatindex:(nsinteger)section{
 return uiedgeinsetsmake(0, 0, 0, 0);
}

既然有日历,总得显示哪年哪月吧,前面已经注册表头视图了,这里只需要实现以下代理方法即可

collectionview有点不同其头视图也有单独的类,和cell一样先自定义headcell,也是非常简单的自定义

.h文件

#import <uikit/uikit.h>

@interface lywcollectionreusableview : uicollectionreusableview

@property (nonatomic,strong) uilabel *datelable;

- (instancetype)initwithframe:(cgrect)frame;

@end

.m文件

#import "lywcollectionreusableview.h"

@implementation lywcollectionreusableview

- (instancetype)initwithframe:(cgrect)frame{
 if (self == [super initwithframe:frame]) {
 _datelable = [[uilabel alloc] initwithframe:self.bounds];
 [_datelable settextalignment:nstextalignmentleft];
 [_datelable setfont:[uifont systemfontofsize:20]];
 _datelable.textcolor = [uicolor blackcolor];
 [self addsubview:_datelable];
 }
 return self;
}

@end

接着代理方法,这里也有个三项判断式,和上面的大同小异,主要是防止12月显示为0月

- (uicollectionreusableview *)collectionview:(uicollectionview *)collectionview viewforsupplementaryelementofkind:(nsstring *)kind atindexpath:(nsindexpath *)indexpath{
 if (kind == uicollectionelementkindsectionheader) {
 lywcollectionreusableview *headerrv = [collectionview dequeuereusablesupplementaryviewofkind:kind withreuseidentifier:headerid forindexpath:indexpath];
 //自定义蓝色
 headerrv.backgroundcolor = dodger_blue;
 nsdate *currentdate = [[nsdate alloc]init];
 nsinteger year = ([currentdate month:currentdate] + indexpath.section)/12 + 2016;
 nsinteger mounth = ([currentdate month:currentdate] + indexpath.section) % 12 == 0 ? 12 : ([currentdate month:currentdate] + indexpath.section)%12;
 headerrv.datelable.text = [nsstring stringwithformat:@"%ld年%ld月",year,mounth];
 return headerrv;
 }else{
 return nil;
 }
}

还是代理,处理选中效果,选中的为黄色

- (void)collectionview:(uicollectionview *)collectionview didselectitematindexpath:(nsindexpath *)indexpath{

 lywcollectionviewcell *cell = [self collectionview:_collectionview cellforitematindexpath:indexpath];

 nsdate *currentdate = [[nsdate alloc]init];

 //打印当前日期

 if (![cell.datelable.text isequaltostring:@""]) {

 nsinteger year = ([currentdate month:currentdate] + indexpath.section)/12 + 2016;

 nsinteger mounth = ([currentdate month:currentdate] + indexpath.section)%12;

 nsinteger day = [cell.datelable.text intvalue];

 nslog(@"%ld年%02ld月%02ld日",year,mounth,day);

 }

 //排除空值cell

 //获取月份

 nsinteger mounth = ([currentdate month:currentdate] + indexpath.section) % 12 == 0 ? 12 : ([currentdate month:currentdate] + indexpath.section)%12;

 nsdatecomponents *components = [[nsdatecomponents alloc]init];

 components.month = mounth;

 components.year = 2016 + mounth/12;

 components.day = 1;

 nscalendar *calendar = [nscalendar currentcalendar];

 nsdate *nextdate = [calendar datefromcomponents:components];

 //获取该月第一天星期几

 nsinteger firstdayinthismounth = [nextdate firstweekdayinthismonth:nextdate];

 //该月的有多少天daysinthismounth

 nsinteger daysinthismounth = [nextdate totaldaysinmonth:nextdate];

 if ((indexpath.row < firstdayinthismounth || indexpath.row > daysinthismounth + firstdayinthismounth - 1)){

 //如果点击空表格则单击无效

 [collectionview cellforitematindexpath:indexpath].userinteractionenabled = no;

 [collectionview reloaddata];

 }

}

最后展示很烂的效果图:

iOS自定义日历控件的简单实现过程

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

上一篇:

下一篇: