Created
December 17, 2011 09:02
-
-
Save yonestra/1489746 to your computer and use it in GitHub Desktop.
Titaniumでmy365風なカレンダーアプリを作る(1) ref: http://qiita.com/items/1398
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var win = Ti.UI.currentWindow; | |
//今日という日 | |
var now = new Date(); | |
now.setHours(12); | |
var Y = now.getYear()+1900; | |
var M = now.getMonth()+1; | |
//表示している画面の年と月 | |
var whenLabel = Ti.UI.createLabel({ | |
font:{ | |
fontFamily:'Helvetica Neue', | |
fontSize:25 | |
}, | |
textAlign:'center', | |
text:Y+"年"+M+"月", | |
top:5, left:'auto', height:25, width:'auto' | |
}); | |
win.add(whenLabel); | |
//月を戻すボタン | |
var backMonthButton = Ti.UI.createLabel({ | |
backgroundColor:"green", | |
top:35, left:30, height:25, width:120, | |
textAlign:'center', | |
text:'back' | |
}); | |
backMonthButton.addEventListener('click', function(){ | |
var date = new Date(Y,parseInt(M)-1-1) | |
var Y_ = date.getYear()+1900; | |
var M_ = date.getMonth()+1; | |
whenLabel.text = Y_+"年"+M_+"月"; | |
cal(date); | |
}); | |
win.add(backMonthButton); | |
//月を進めるボタン | |
var forwardMonthButton = Ti.UI.createLabel({ | |
backgroundColor:"green", | |
top:35, left:170, height:25, width:120, | |
textAlign:'center', | |
text:'forward' | |
}); | |
forwardMonthButton.addEventListener('click', function(){ | |
var date = new Date(Y,parseInt(M)-1+1) | |
var Y_ = date.getYear()+1900; | |
var M_ = date.getMonth()+1; | |
whenLabel.text = Y_+"年"+M_+"月"; | |
cal(date); | |
}); | |
win.add(forwardMonthButton); | |
//ここにカレンダーの各日付を表示。スクロールさせる。 | |
var scrollView = Titanium.UI.createScrollView({ | |
contentWidth:'auto', | |
contentHeight:'auto', | |
top:70, | |
height:300, | |
width:320, | |
backgroundColor:'#fff' | |
}); | |
win.add(scrollView); | |
//カレンダー表示関数 | |
var cal = function(date){ | |
var year = date.getFullYear(); | |
var month = date.getMonth(); | |
var leap_year=false; | |
if ((year%4 == 0 && year%100 != 0) || (year%400 == 0)) leap_year=true; | |
var lom = new Array(31,28+leap_year,31,30,31,30,31,31,30,31,30,31); | |
var w = new Array("red","gray","gray","gray","gray","gray","blue"); //曜日の見分けは色のみ | |
var days=0; | |
for (var i=0; i < month; i++) days+=lom[i]; | |
var week=Math.floor((year*365.2425+days)%7); //その月の開始曜日を取得 | |
var cols = 0; | |
var rows = 0; | |
var width = 80; | |
var height = 80; | |
for(var i=0; i<lom[month]; i++){ | |
var top = 0 + height * rows; //各日付の表示位置制御 | |
var left = 0 + width * cols; | |
var calLabel = Ti.UI.createLabel({ | |
backgroundColor:w[week], | |
borderColor:"black", | |
top:top, left:left, height:height, width:width | |
}); | |
scrollView.add(calLabel); | |
var dayLabel = Ti.UI.createLabel({ | |
color:'white', | |
font:{fontSize:20}, | |
width:'auto', | |
textAlign:'center', | |
height:'auto', | |
text:i+1 | |
}); | |
calLabel.add(dayLabel); | |
if(cols != 3){ //各日付は横4列まで | |
cols++; | |
} else { | |
cols = 0; | |
rows++; | |
} | |
if(week != 6){ | |
week++; | |
} else { | |
week = 0; | |
} | |
} | |
} | |
cal(now); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var leap_year=false; | |
if ((year%4 == 0 && year%100 != 0) || (year%400 == 0)) leap_year=true; | |
var lom = new Array(31,28+leap_year,31,30,31,30,31,31,30,31,30,31); | |
var w = new Array("red","gray","gray","gray","gray","gray","blue"); //曜日の見分けは色のみ | |
var days=0; | |
for (var i=0; i < month; i++) days+=lom[i]; | |
var week=Math.floor((year*365.2425+days)%7); //その月の開始曜日を取得 | |
var cols = 0; | |
var rows = 0; | |
var width = 80; | |
var height = 80; | |
for(var i=0; i<lom[month]; i++){ | |
var top = 0 + height * rows; //各日付の表示位置制御 | |
var left = 0 + width * cols; | |
var calLabel = Ti.UI.createLabel({ | |
backgroundColor:w[week], | |
borderColor:"black", | |
top:top, left:left, height:height, width:width | |
}); | |
scrollView.add(calLabel); | |
var dayLabel = Ti.UI.createLabel({ | |
color:'white', | |
font:{fontSize:20}, | |
width:'auto', | |
textAlign:'center', | |
height:'auto', | |
text:i+1 | |
}); | |
calLabel.add(dayLabel); | |
if(cols != 3){ //各日付は横4列まで | |
cols++; | |
} else { | |
cols = 0; | |
rows++; | |
} | |
if(week != 6){ | |
week++; | |
} else { | |
week = 0; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment