티스토리 뷰

Windows 8

[Windows 8] Digital Clock 만들기

생각많은 소심남 2012. 7. 28. 18:55

이번에 다뤄볼 내용은 간단한 디지털 시계를 만드는 방법입니다. 무척이나 간단한 앱이지요. 조금더 응용을 해서 초시계까지 만드는 것을 목적으로 하고 있습니다.

우선 Blank Application으로 Timer라는 이름의 프로젝트를 생성합니다. 처음으로는 시간을 불러올 TextBlock을 집어넣어야 겠지요? 중앙에 오도록 간단하게 처리합니다.

 

 

당연히 Text에는 아무것도 집어넣지 않았기 때문에 디자인뷰상에서는 아무것도 안뜹니다. 정작 집어넣을 내용은 코드 부분에 들어가겠지요.

 시간을 다루는 자료형은 DispatcherTimer라는 자료형으로 정의됩니다. 각각에 Interval 이나 Tick같은 속성이 포함되어 있으며, 그것들을 적절하게 활용하면 됩니다. 우선은 가상으로 내재되어 있는 이벤트(지난 포스트에서 잠깐 다뤘습니다.) 중에 있는 OnTimerTick이란 것을 사용합니다. 이 이벤트는 timer가 Tick할 때마다 발생합니다.

 

 

 

여기까지 작성하면 아래와 같이 자동으로 이벤트가 생성됩니다. 두번 탭을 해주면 아래와 같이

 

생성된다는 겁니다. 이제 해당 Timer를 동작하고  OnTimerTick 이벤트에서 앞에서 정한 txtblk의 텍스트를 계속 갱신하게 하면 되겠지요.

 

실행 결과는 다음과 같습니다.

 

 

참고로 DateTime 포멧에는 연도와 달, 날짜도 표시할 수 있습니다. 보통 연도는 y, 달은 M 등으로 표시되는데 더 자세한 것은 다음 링크를 참고하시기 바랍니다.

http://msdn.microsoft.com/en-us/library/zdtaw1bw.aspx

아무튼 포멧을 바꾸고 다른 걸로 표시하면 다음의 결과도 얻을 수 있습니다.

 

신기하네요. 자 그럼 앞에서 언급한 바와 같이 초시계를 만들어보고자 합니다.

 

초시계에 필요한 것들이 무엇이 있을까요? 우선은 시각적으로 보여줄 텍스트랑 버튼 3개가 기본적으로 있을겁니다. 시작버튼, 정지버튼 그리고 리셋 버튼 이렇게 있겠지요.

 

각 버튼에 대한 이벤트는 미리 생성해놓는 것이 좋겠지요. 버튼을 더블 클릭합니다.

자 초시계를 만들려면 그대로 DispatcherTimer를 쓰는게 좋을까요? 사실 라이브러리중에도 StopWatch 기능을 제공하는 것이 있습니다. 바로 system.diagnostics 입니다. 이걸 using 구문을 써서 추가 시킵시다.

 

이제 StopWatch란 자료형을 쓸 수 있게 됩니다. 전역적으로 써야 하기 때문에 Stopwatch로 정의되는 변수는 해당 클래스의 제일 상위에 집어넣습니다.

 

Stopwatch의 동작은 매우 단순합니다. 그냥 앞의 버튼이 지정한 것처럼 Start과 Stop Reset의 기능이 구현되어 있습니다.

 

 

이제 마지막으로 해줘야 할 것은 이제 Ticktock이라고 이름지은 TextBlock에 어떤 내용을 집어넣느냐는 겁니다. 저는 Timespan 자료형을 써서 다음과 같이 구현하였습니다.

 

지금의 이 timer_Tick 이벤트는 앞에서 만든 이벤트입니다. 다시 설명하자면 이 이벤트는 매초마다 갱신되어 호출되는 이벤트입니다. 초시계의 내용은 매 시간 갱신되어야 하기 때문에 이렇게 집어넣은 겁니다.

 자 이게 끝일까요? 한가지 더 고쳐야 할 부분이 있습니다. 우리가 아까 timer 이벤트를 만들때 그에 대한 interval을 1초로 선언해주었습니다. 그말은 즉 1초마다 OnTimerTick 이벤트가 호출된다는 겁니다. 그런데 초시계도 1초마다 호출되면 바른 동작일까요? 원하는 건 miliSec 단위로도 움직이는 것이겠지요. 그래서 해당 interval도 바꿔줘야 합니다.

 

 

그냥 인터벌만 바꿔준 겁니다. 10ms 단위로 갱신이 되도록 말입니다. 이렇게 해도 기존의 Text에는 전혀 지장이 없습니다. 어차피 초만 나타낼 것이기 때문이지요. 한번 결과를 확인해보도록 하겠습니다.

 

 

물론 DispatcherTimer로도 초시계를 만들 수 있습니다만.. 조금 복잡하지요. 그냥 이럴때는 기존 라이브러리에서 그냥 불러오는 것도 참 좋은 방법일 것이라 생각됩니다.

 

 

댓글