Hello World in Windows 8 Metro style app

오늘 새벽에 Windows 8 Consumer Preview가 발표가 되었고, Visual Studio 11 beta도 공개가 되었다.
그래서, 핼로우 월드를 끄적여 보려고 한다.

1. Windows 8 Consumer Preview 사이트
http://windows.microsoft.com/en-US/windows-8/consumer-preview

설치 파일 exe 버전
http://windows.microsoft.com/en-US/windows-8/download
설치 파일 iso 버전
http://windows.microsoft.com/en-US/windows-8/iso

Windows 7에 설치를하면, 윈도우가 지워질 수 있으니..멀티 부팅을 만든 후 설치하는 것을 권장

2. Visual Studio 11 Express Beta for Windows 8
http://msdn.microsoft.com/en-us/windows/apps/hh852659
이 버전 말고, 다른 버전은 MSDN 구독자만 다운로드가 가능

윈도우8을 설치하고 VS11을 설치하면 환경 설정은 완료
** Metro style app 개발시 최소 화면 크기가 1024 * 768로, 해상도가 이것 보다 적으면 오류 발생

3. 헬로 월드 시작

1) VS11 실행

2) File -> New Project -> Visual C# -> Windows Metro style 선택 -> Blank Application 선택 -> Name : HelloWorld -> OK

3) 상단 메뉴 바로 아래 ▶ Local Machine 오른쪽 역삼각형을 눌러서 Simulator를 선택

4) 오른쪽 Solution Explorer에서 BlankPage.xaml을 더블 클릭 ( 이 페이지에 글씨를 입력 한다 )

5) TextBlock 하나 추가

    <Grid Background="{StaticResource ApplicationPageBackgroundBrush}">
        <TextBlock Text="Hello World in Windows 8 Metro style app"/>
    </Grid>

6) F5 키를 눌러서 실행

시물레이터가 실행이 되고, 앱 화면이 출력이 되었다. 하하.. 그러나, 글씨가 너무 작고, 좌상단에 몰려있는 것이 마음에 들지 않는다.
글씨 크기를 키우고, 위치를 중앙으로 이동 시켜 보자.

7) 상단의 중지 버튼을 눌러서 프로그램 실행을 중지 시키고
화면 왼쪽 하단의 Document Outline 패널에서 TextBlock 선택 -> 오른쪽 하단의 Properties 패널에서 -> Text -> 크기를 36 px로 선택한다.

8) 이제 화면의 가운데로 보내 보자. 이 문제는 Layout System에 대해서 알 고 있어야 하는데. 그 부분은 일단 알고 있다고 생각하고 바로 진행한다.

    <Grid Background="{StaticResource ApplicationPageBackgroundBrush}">
        <Grid>
            <TextBlock Text="Hello World in Windows 8 Metro style app" FontSize="36"/>
        </Grid>
    </Grid>

택스트 블럭을 Grid에 넣어 준다.
왼쪽 하단에서 Grid를 선택 -> 오른쪽 하단에서 Layout을 확장하고 HorizontalAlignment, VerticalAlignment 프로퍼티를 Center로 변경해 준다.

9) 다시 실행 한다.

4. 처음 시작은..간단한 것으로..

HelloWorld.zip