cocos2d-html5版日历组件

根据一as3版本给改编成成了js版的。as3版本的地址:  http://download.csdn.net/detail/fengye513/2722289

胜利项目做的差不多了，由于项目用的是c++，并没有动态更新逻辑的需求，所以也就没有写什么js或者lua脚本，全部c++，涉及到付费或者分享之类特殊处理，objc和java还是写了不少。话不多说，现在游戏里增加了一个会不定期更新的活动模块，逻辑部分和UI部分都会实事改动，一开始想要写lua，但是由于引擎版本差异，引擎代码被改动过等原因，放弃了lua binding的方式，于是就用到了webView这个东东，直接嵌入页面到游戏中，搞定了objc与js互调，java与js互调之后，利用cocosx-html5引擎开些了。

活动嘛，少不了签到，签到，肯定是在日历上签咯。

共三个类，类名没怎么改，还是用as那老兄的命名

DayObject ：日历上每一天的数据
DateShape　: 日历上每一天的视图
SuperCalendar ： 日历容器

new一个SuperCalendar并addChild到你想要它出现的地方,然后调用setData()方法传递年，月，日，就可以了，
支持跳月，跳年就没写了，如果你需要的话可以看看原本的as代码里有。

上代码：

 

 1 /**
 2 *    @anthor JiaDing
 3 *
 4 */
 5 
 6 var DayObject = cc.Class.extend({
 7     
 8     innerText:null,//几号
 9     isToady:false,//是否是当天
10     isMark:false,//是否签到
11     
12 
13     init:function () 
14     {
15         
16         
17         return true;
18             
19     }
20     
21 
22 });
23 
24 DayObject.create = function() 
25 {
26     var obj = new DayObject();
27     if(obj && obj.init())
28     {
29         return obj;
30     }
31     return null;
32 };

 

 1 /**
 2 *    @anthor JiaDing
 3 *
 4 */
 5 
 6 var DateShape = cc.Sprite.extend({
 7     
 8     _label:null,
 9     _lis:null,
10     _Obj:null,
11 
12     init:function (val) 
13     {
14         var ready = false;
15         if (this._super())
16         {    
17             // winSize = cc.Director.getInstance().getWinSize();
18 
19              this._lis = [];
20             this._Obj = val;
21             
22             var markInfo = null;
23             if(this._Obj.isMark)
24             {
25                 markInfo = "(已签)";
26             }
27             else
28             {
29                 markInfo = "(未签)";
30             }
31             this._label = cc.LabelTTF.create(this._Obj.innerText+markInfo, "Arial", 25);
32             
33             
34             if(this._Obj.isToady)
35             {
36                 this._label.setColor(cc.c3b(255,0,0));
37             }
38             else
39             {
40                 this._label.setColor(cc.c3b(255,255,255));
41             }
42             
43             this.addChild(this._label);
44 
45             
46             ready = true;
47         }
48         return ready;
49             
50     }
51     
52 
53 });
54 
55 DateShape.create = function(val) 
56 {
57     var shape = new DateShape();
58     if(shape && shape.init(val))
59     {
60         return shape;
61     }
62     return null;
63 };
64 
65 DateShape.prototype.remove = function()
66 {
67     this.removeAllChildren(true);
68     this._label = null;
69     this._lis = null;
70     
71 }

 

  1 /**
  2 *    @anthor JiaDing
  3 *
  4 */
  5 
  6 var SuperCalendar = cc.Layer.extend({
  7     
  8     daysMonth:null,
  9     thisYear:0,
 10     thisMonth:0,
 11     thisDay:0,
 12     day:null,
 13     dayObj:null,
 14     dateSprite:null,
 15 
 16     inputDate:null,
 17     today:null,
 18     todayTitleInfo:null,
 19 
 20 
 21     init:function () 
 22     {
 23         var bRet = false;
 24         if (this._super())
 25         {    
 26             
 27             this.daysMonth = [31,28,31,30,31,30,31,31,30,31,30,31];//正常的月份日期
 28             this.day = new Array(42);
 29             this.dayObj = new Array(42);
 30             
 31             bRet = true;
 32         }
 33         return bRet;
 34             
 35     },
 36     setData:function(y,m,d)
 37     {
 38         this.thisYear = y;
 39         this.thisMonth = m;
 40         this.thisDay = d;
 41         this.today = this.thisYear + "-" + this.thisMonth + "-" + this.thisDay;
 42         this.updateCalendar();
 43     },
 44     updateCalendar:function () 
 45      {
 46          if(this.dateSprite != null)
 47          {
 48              this.dateSprite.removeAllChildren(true);
 49              this.removeChild(this.dateSprite);
 50              this.dateSprite = null;
 51          }
 52          var iRemove=0; 
 53          // document.write(this.dateSprite);
 54          if(this.dateSprite == null)
 55         {
 56              this.dateSprite = cc.Sprite.create();
 57              this.addChild(this.dateSprite);
 58          }
 59          
 60          var y = this.thisYear;
 61          var m = this.thisMonth;
 62          var d = this.thisDay;
 63          
 64          if(!(y <= 9999 && y >= 1000 && m > 0 && m < 13 && d > 0)){
 65                          //日期初始化
 66              this.thisYear = 2013
 67              this.thisMonth = 7; 
 68              this.thisDay = 10;
 69          }
 70          
 71          this.todayTitleInfo = this.thisYear + "年  " + this.thisMonth + "月";
 72         
 73          y = this.thisYear;
 74          m = this.thisMonth;
 75          d = this.thisDay;
 76          this.daysMonth[1] = (0 == y%4 &&(y%100!=0 || y%400==0)) ? 29:28;
 77          var w = new Date(y,m-1,1).getDay();
 78              
 79          var prevDays = m==1? this.daysMonth[11] : this.daysMonth[m-2];
 80          var i;
 81          for(i=(w-1);i >= 0;i--){
 82              this.day[i] = y + "-" + (m-1) + "-" + prevDays;
 83              if(m == 1){
 84                  this.day[i] = (y-1) + "-" + 12 + "-" + prevDays;
 85              }
 86              prevDays--;
 87          }
 88          for(i=1;i <= this.daysMonth[m-1];i++){
 89              this.day[i+w-1] = y + "-" + m  + "-" + i;
 90          }
 91          for(i=1;i<42-w-this.daysMonth[m-1]+1;i++){
 92              this.day[this.daysMonth[m-1]+w-1+i] = y + "-" + (m+1) + "-" + i;
 93              if(m==12){
 94                  this.day[this.daysMonth[m-1]+w-1+i] = (y+1) + "-" + 1 + "-" + i;
 95              }
 96          }
 97          
 98          for(i=0;i<42;i++)
 99          {
100              var a = this.day[i].split("-");
101              this.dayObj[i] = DayObject.create();
102              this.dayObj[i].innerText = a[2];
103             this.dayObj[i].isToady = false;
104 
105              //非本月份,不显示日期
106              if(i < w)
107             {
108                 continue;
109              }
110              if(i >= w+this.daysMonth[m-1])
111             {
112                 continue;
113              }
114      
115              //今天日期
116              if(this.day[i] == this.today)
117             {
118                 this.dayObj[i].isToady = true;
119              }
120      
121              var dateShape = DateShape.create(this.dayObj[i]);
122              dateShape.setPositionX((i % 7) * 115);
123             //cocos2d的世界里越往下y越小,所以要(6-i)
124              dateShape.setPositionY( Math.floor((6-i) / 7) * 40 );
125             
126              this.dateSprite.addChild(dateShape);
127      
128          }
129      },
130     jumpToPrevMonth:function()
131     {
132         this.thisDay = 1;
133         if(this.thisMonth == 1)
134         {
135             this.thisYear--;
136             this.thisMonth = 13;
137         }
138         this.thisMonth--;
139         this.updateCalendar();
140     },
141     jumpToNextMonth:function()
142     {
143         this.thisDay = 1;
144         if(this.thisMonth == 12)
145         {
146             this.thisYear++;
147             this.thisMonth = 0;
148         }
149         this.thisMonth++;
150         this.updateCalendar();
151     },
152     jumpToToday:function()
153     {
154         this.thisYear = 2013;
155         this.thisMonth = 7;
156         this.thisDay = 10;
157         this.today = this.thisYear + "-" + this.thisMonth + "-" + this.thisDay; //今天("yyyy-dd-mm")
158         this.updateCalendar();
159     }
160 });
161 
162 SuperCalendar.create = function() 
163 {
164     var layer = new SuperCalendar();
165     if(layer && layer.init())
166     {
167         return layer;
168     }
169     return null;
170 };

 

 

posted @ 2013-07-12 00:25  居家懒人  阅读(2287)  评论(0)  编辑  收藏  举报