2009/11/16

カレンダーを作る1(今月のカレンダー)

シンプルなカレンダーです。
作っていく流れは

  1. 必要なデータの準備
  2. 日付を配列にする
  3. データを整形
  4. スタイルシートの用意
  5. html部分を整形し完成

です。
サンプル

1.必要なデータの準備

まずカレンダーに必要なデータを用意します。

  • 表示する年
  • 表示する月
  • 月末の日付
  • 月初めの曜日
  • 月末の曜日
  • 曜日の配列

date関数とmktime関数を使います。

$y=date("Y",time());//現在の年
$m=date("m",time());//現在の月
$t=date("t",mktime(0,0,0,$m,1,$y));//月末の日付
$start=date("w",mktime(0,0,0,$m,1,$y));//月初めの曜日
$end=date("w",mktime(0,0,0,$m,$t,$y));//月末の曜日
$week=array("日","月","火","水","木","金","土");//曜日の表示
$date=$y."/".$m;//表示する年月

2.日付を配列にする

次にfor文を使い日付を配列にしていきます。
処理は

  1. $tblを初期化
  2. $startの個数分$tbl配列に空白を挿入
  3. 月末の日付まで$tbl配列に日付を挿入
  4. $endから週末になるまで$tbl配列に空白を挿入

となります。

$tbl="";
for($i=0;$i<$start;$i++){//1日までの空白 $tbl[]="-"; } for($i=1;$i<=$t;$i++){//日付 $tbl[]=$i; } for($i=$end;$i<6;$i++){//月末からの空白 $tbl[]="-"; }

3.データを整形

次に$tbl配列に入った今月の日付データを整形します。
日付部分のforeach文でループ処理は

  1. 変数$iを0で初期化
  2. $iが7で割り切れるとき($i%7==0)<tr>を追加
  3. 日付を追加し$iを+1する
  4. $iが7で割り切れるとき($i%7==0)</tr>を追加

となります。

$table="
<div class="\"ttl\"">".$date."</div>
\n";//年月の書き出し
$table.="

";
foreach($week as $val){//曜日の書き出し
$table.= "

\n";
}
$table.="

\n";
$i=0;
foreach($tbl as $val){
if($i%7==0){//週の始まり
$table.="

\n";
}
$table.="

\n";
$i++;
if($i%7==0){//週の終わり
$table.="

\n";
}
}
$table.="
<table>
<tbody>
<tr>
<th>".$val."</th>
</tr>
<tr>
<td>".$val."</td>
</tr>
</tbody>
</table>
\n";

4.スタイルシートの用意

必要部分のスタイルを記入し1.cssで保存します。

#main{
width:350px;
}
table{
border: 1px solid #ccc;
}
.ttl{
background: #999;
color: #fff;
border: 1px solid #ccc;
text-align:center;
height:1.5em;
line-height:1.5em;
}
th{
border: 1px solid #ccc;
background: #ccc;
color: #fff;
font-weight: normal;
padding: 2px;
}
td{
border: 1px solid #ccc;
text-align: center;
width: 50px;
height:50px;
vertical-align: top;
}

5.html部分を整形し完成

<div id="main"><!--?php echo $table; ?--></div>

全体のソース

<!--?php
//今月のカレンダー
$y=date("Y",time());//現在の年
$m=date("m",time());//現在の月
$t=date("t",mktime(0,0,0,$m,1,$y));//月初めの曜日
$start=date("w",mktime(0,0,0,$m,1,$y));//月初めの曜日
$end=date("w",mktime(0,0,0,$m,$t,$y));//月末の曜日
$week=array("日","月","火","水","木","金","土");//曜日の表示
$date=$y."/".$m;//表示する年月

$tbl="";
for($i=0;$i<$start;$i++){//1日までの空白
	$tbl[]="-";
}
for($i=1;$i<=$t;$i++){//日付
	$tbl[]=$i;
}
for($i=$end;$i<6;$i++){//月末からの空白
	$tbl[]="-";
}

$table="
<div class=\"ttl\"-->".$date."

\n";//年月の書き出し
$table.="

";
foreach($week as $val){//曜日の書き出し
$table.= "

\n";
}
$table.="

\n";
$i=0;
foreach($tbl as $val){
if($i%7==0){//週の始まり
$table.="

\n";
}
$table.="

\n";
$i++;
if($i%7==0){//週の終わり
$table.="

\n";
}
}
$table.="
<table>
<tbody>
<tr>
<th>".$val."</th>
</tr>
<tr>
<td>".$val."</td>
</tr>
</tbody>
</table>
\n";
?>
<div id="main"><!--?php echo $table; ?--></div>