自己做日历

自己做日历 [学习目标]:掌握Date类常用的方法，比如getFullYear()、getMonth()、getDate()、getHours()、getMinutes()、getSeconds()、getTime() 在前面我给大家介绍了字符串、数组，在as中的应用特别的广泛，现在我们再结合Date类，通过实例来更好的掌握它们。 在flash制作as中有许多与时间和日期有关的应用，比如万年、下载时间、做个漂亮的时钟、在网站开发中，录入生日、用户登陆时间、更新日期等等，我们就要用Date类的对象来具体操作。 但这里先声明用Date类的方法获取的时间和日期是本地电脑(播放该swf文件的电脑)的系统时间和日期或者是通用时间(格林尼治平均时，现在叫做通用时间或 UTC)。 一、日期对象的变量声明 说明一下，声明变量时我们先考虑3点，一是变量的数据类型，二能否增加代码提示，三、作用域(有效范围) 下面的定义都是可以的: 1、不赋值 var my_date =new Date(); trace(my_date.getDate());//得到的是系统当前的日期 var my_date:Date =new Date(); 2、赋值 一般格式:va rmy_date =new Date(年,月,日,小时,分钟,秒); var my_date =new Date(2004,9,12); trace(my_date.getDate());//12 注意:年:0-99:代表1900-1999，其他写全4位，比如2003 月:0-11:代表1月-12月，所以你写2代表的是3月 小时: 从 0 (午夜)到 23 (深夜 11 点)之间的整数 声明变量比较简单的吧 二、日期对象的方法 方法 说明 Date.getDate() 按照本地时间返回某天是当月的第几天。(1 至 31 ) Date.getDay() 按照本地时间返回某天是周几。(0 代表星期日，1 代表星期一，依此 类推) Date.getFullYear() 按照本地时间返回 4 位数字的年份数。 Date.getHours() 按照本地时间返回小时值。 0 至 23 之间的整数 Date.getMilliseconds() 按照本地时间返回毫秒值。一个 0 至 999 之间的整数 Date.getMinutes() 按照本地时间返回分钟值。0 至 59 之间的整数 Date.getMonth() 按照本地时间返回月份数。 Date.getSeconds() 按照本地时间返回秒数。 Date.getTime() 返回自 1970 年 1 月 1 日午夜(通用时间)以来的毫秒数。 Date.getTimezoneOffset() 以分钟为单位，返回计算机的本地时间和通用时间的差值。 Date.getUTCDate() 按照通用时间返回某天(日期)是当月的第几天。 Date.getUTCDay() 按照通用时间返回某天是周几。0 代表星期日，1 代表星期一 Date.getUTCFullYear() 按照通用时间返回 4 位数字的年份数。 Date.getUTCHours() 按照通用时间返回小时值。从 0 (午夜)到 23 (深夜 11 点)之间的整数 Date.getUTCMilliseconds() 按照通用时间返回毫秒值。 Date.getUTCMinutes() 按照通用时间返回分钟值。 Date.getUTCMonth() 按照通用时间返回月份数。 Date.getUTCSeconds() 按照通用时间返回秒数。 Date.getYear() 按照本地时间返回年份数。 Date.setDate() 按照本地时间设置某天是当月的第几天。返回以毫秒为单位的新时间。 Date.setFullYear() 按照本地时间设置完整的年份数。返回以毫秒为单位的新时间。 Date.setHours() 按照本地时间设置小时值。返回以毫秒为单位的新时间。 Date.setMilliseconds() 按照本地时间设置毫秒值。 返回以毫秒为单位的新时间。 Date.setMinutes() 按照本地时间设置分钟值。返回以毫秒为单位的新时间。 Date.setMonth() 按照本地时间设置月份数。返回以毫秒为单位的新时间。 Date.setSeconds() 按照本地时间设置秒数。返回以毫秒为单位的新时间。 Date.setTime() 以毫秒为单位设置日期。返回以毫秒为单位的新时间。 Date.setUTCDate() 按照通用时间设置日期。返回以毫秒为单位的新时间。 Date.setUTCFullYear() 按照通用时间设置年份数。返回以毫秒为单位的新时间。 Date.setUTCHours() 按照通用时间设置小时值。返回以毫秒为单位的新时间。 Date.setUTCMilliseconds() 按照通用时间设置毫秒值。返回以毫秒为单位的新时间。 Date.setUTCMinutes() 按照通用时间设置分钟值。返回以毫秒为单位的新时间。 Date.setUTCMonth() 按照通用时间设置月份数。返回以毫秒为单位的新时间。 Date.setUTCSeconds() 按照通用时间设置秒数。返回以毫秒为单位的新时间。 Date.setYear() 按照本地时间设置年份数。 Date.toString() 返回一个表示存储在指定 Date 对象中的日期和时间的字符串值。 Date.UTC() 返回 1970 年 1 月 1 日午夜(通用时间)和指定时间之间的毫秒数。 这些方法很好理解，不是get就是set，大家看一遍一定就知道了，再不理解大家就自己trace()函数去试验了。关键一点:除了"日"外都是从0开始的值，包括年、月、小时... 三、应用实例 要求:做个日历 步骤: 1、新建flsh文档 2、新建MC元件circul_mc，画个圈。(用来突出显示当前日数的) 3、新建MC元件day，插入动态文本框，居中(养成好习惯，元件居中好控制)对应变量名:dateval 4、新建MC元件day_mc，把元件day拖入居中，然后点选day加as: //完成某日的MC的定位和显示值 onClipEvent (load) { _root.SetDate(this); } //完成在选定的日期画圈 on (press) { _root.circul_mc._x = _x; _root.circul_mc._y = _y; _root.day_num = int(dateval); //更新显示年月日星期 _root.ShowDateText(); } 5、新建按纽元件ym_btn，在点击插入关键桢，画个100*20的长方形。 6、新建MC元件ctitle。在上面插入文本框，分别输入 星期日到星期六，做日历的显示标题 7、回到主场景，新建图层txt，插入7个动态文本框，对应变量分别yearval(显示年)、monthval(显示月)、month_txt(显示大大的背景-月)、date_txt(显示年月日星期)、h_txt(显示小时)、m_txt(显示分钟)、s_txt(显示秒)。 8、新建图层btn，插入文本框，分别是2个">>"、2个"<<"、2个":"，1个是"今天"，从库拖入按纽5次ym_btn，分别覆盖在2个">>"、2个"<<"和"今天"，来完成年、月、今天的选择。 9、新建图层ctitle，把元件ctitle拖入，做日历的星期标题。 10，新建图层ActionScript，加as: //1、日历代码 //每月的天数数组 monthdays = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31); //星期数组 weekstr = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"); //每月从...开始的值变量 startday = 1; //每周从...开始的值变量 startweek = 0; //日历开始坐标x，y的值变量 start_x = 100; start_y = 140; //日期的x,y方向间隔的值变量 space_x = 48; space_y = 32; //最大日历行数的值变量 yrow = 0; //保存当前显示的年、月、日的值变量 month_num = ""; year_num = ""; day_num = ""; //显示今天的日历 ShowToday(); //复制画圈的MC(circul_mc) attachMovie("circul_mc", "circul_mc", 2000); //////////////////////////////////////////////////////////// //下面是五个按纽的具体函数 yearprev_btn.onPress = function() { ShowPrevYear(); }; yearnext_btn.onPress = function() { ShowNextYear(); }; monthprev_btn.onPress = function() { ShowPrevMonth(); }; monthnext_btn.onPress = function() { ShowNextMonth(); }; tody_btn.onPress = function() { ShowToday(); }; //下面是各功能函数模块 //显示当前的年、月、日、星期 function ShowDateText() { curdate = new Date(this.yearval, this.monthval-1, day_num); date_txt = this.yearval+"年" +this.monthval+"月"+day_num+"日-"+weekstr[curdate.getDay()]; delete curdate; } //设置年月显示格式，并显示在动态文本框 function SetMY(month_num, year_num) { if (year_num>9999) { year_num = 0; } else if (year_num<0) { year_num = 9999; } if (month_num>12) { month_num = 1; } else if (month_num<0) { month_num = 12; } if (month_num<10) { this.monthval = "0"+month_num; this.month_txt = "0"+month_num; } else { this.monthval = month_num; this.month_txt = month_num; } this.yearval = year_num; } //显示今天的日历全部 function ShowToday() { tody = new Date(); this.yearval = tody.getFullYear(); day_num = tody.getDate(); SetMY(tody.getMonth()+1, this.yearval); delete tody; ShowCal(); } //显示下月的日历全部 function ShowNextMonth() { month_num = int(this.monthval)+1; year_num = int(this.yearval); if (month_num>12) { year_num++; month_num = 1; } SetMY(month_num, year_num); ShowCal(); } //显示上月的日历全部 function ShowPrevMonth() { month_num = int(this.monthval)-1; year_num = int(this.yearval); if (month_num<1) { year_num--; month_num = 12; } SetMY(month_num, year_num); ShowCal(); } //显示下年的日历全部 function ShowNextYear() { month_num = int(this.monthval); year_num = int(this.yearval)+1; SetMY(month_num, year_num); ShowCal(); } //显示上年的日历全部 function ShowPrevYear() { month_num = int(this.monthval); year_num = int(this.yearval)-1; SetMY(month_num, year_num); ShowCal(); } //判断是否闰年 function IsLeap(year) { bLeap = false; if ((year%4) == 0) { if ((year%100) == 0) { if ((year%400) == 0) { bLeap = true; } } else { bLeap = true; } } return bLeap; } //复制后的各个day_mc实例,完成自己的排列定位。 //这个函数有它自己的onLoad事件调用 function SetDate(clip) { if (startday>numdays) { clip.removeMovieClip(); return; } //设置第一日 clip.dateval = startday; //第一日的位置 clip._x = start_x+startweek*space_x; clip._y = start_y+yrow*space_y; if (startday == day_num) { //为了当前日画圈 circul_mc._x = clip._x; circul_mc._y = clip._y; } startweek++; startday++; //换行 if (startweek>=7) { startweek = 0; yrow++; //最多5列 if (yrow>5) { yrow = 0; } } } //关键函数，完成整个日历的显示 function ShowCal() { //取得每月的1日星期几 newdate = new Date(this.yearval, this.monthval-1, 1); startweek = newdate.getDay(); startday = 1; yrow = 0; numdays = monthdays[this.monthval-1]; if ((this.monthval == 2) && IsLeap(this.yearval)) { numdays = 29; } if (numdays< day_num) { day_num = numdays; } //显示年月日星期 ShowDateText(); //复制31次day_mc实例 var i; for (i=1; i<=31; i++) { attachMovie("day_mc", "day_mc"+i, 1000+i); } delete newdate; } //2、时间代码 //下面的是为了显示当前时间的事件函数 onLoad = function () { timer = new Date(); }; onEnterFrame = function () { horas = timer.getHours(); minutos = timer.getMinutes(); segundos = timer.getSeconds(); if (horas<10) { horas = "0"+horas; } if (minutos<10) { minutos = "0"+minutos; } if (segundos<10) { segundos = "0"+segundos; } h_txt = horas; m_txt = minutos; s_txt = segundos; delete timer; timer = new Date(); }; 查看效果 |源代码下载 说明:代码比较长，多用的是函数，大家耐心的看。关键地方我已经注释。真正的自己做一遍。掌握getFullYear()、getMonth()、getDate()、getHours()、getMinutes()、getSeconds()的用法就可以了。 如修改这个日历，可以到MC元件day中去美化具体的某日显示，可以到主场景加些背景图片，也可到day_mc 加as来改变些显示效果。