デジタル時計2 時間帯に合わせてメッセージを表示
Microsoft Silverlight1.0(XAML & Javascript)で作るデジタル時計です。
今回は、時間に合わせて(朝、昼、夜)それぞれメーッセージを表示させます。前回と少〜〜しXAMLの書き方違ってます。
サンプルソースは下です。
XAMLのサンプルソース
<Canvas
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Background="#FFFFFF" Height="11050" Width="1650"
Loaded="onLoaded"
>
<Canvas.Resources>
<!-- Timer Storyboard -->
<Storyboard Duration="0:00:00" x:Name="timerStoryboard" />
</Canvas.Resources>
<TextBlock x:Name="time" Text="" FontSize="36" Canvas.Top="100" Canvas.Left="50" />
<TextBlock x:Name="time2" Text="" FontSize="46" Canvas.Top="145" Canvas.Left="50" />
</Canvas>
Javascriptのサンプルソース
function onLoaded(sender, e)
{
var timer = sender.FindName("timerStoryboard");
timer.AddEventListener("Completed",timerCompleted);
timer.begin();
}
function timerCompleted(sender, e)
{
var mese;
var date = new Date();
var hour = date.getHours();
var min = date.getMinutes();
var sec = date.getSeconds();
if (hour<10){ hour = "0" + hour; }
if (min<10){ min = "0" + min; }
if (sec<10){ sec = "0" + sec; }
if (hour<5){
mese = "Good evening! ";
}else{
if (hour<12){
mese = "Good morning! ";
}else{
if (hour<17){
mese = "Good afternoon! ";
}else{
mese = "Good evening! ";
}
}
}
sender.findName("time").Text = mese;
sender.findName("time2").Text = hour.toString()+":"+min.toString()+":"+sec.toString();
sender.begin();
}