6. 헬로월드(Hello World)

휴~배경 지식이 꽤 많았네요. 드디어 손을 더럽힐 때입니다! 무엇이 “Hello World” 프로그램보다 더 좋은게 있을까요. 이 매뉴얼은 그것이 없이는 완전해질 수 없어요, 그렇죠?

6.1. 체크리스트

여기 사전 준비 사항을 간략히 요약 해 놓았습니다:

  • IDE를 선택하고 다운로드했습니다.
  • 최신 버전의 AIR SDK를 다운로드했습니다.
  • 최신 버전의 Flash Player 프로젝터를 다운로드했습니다.
  • Starling의 최신 버전을 다운로드했습니다.
  • 올바른 SDK 및 플레이어를 사용하도록 IDE를 구성했습니다.

IDE 구성 및 프로젝트 설정은 각 IDE에서 약간 다르게 수행됩니다. 이를 돕기 위해 Starling Wiki의 각 IDE에 대한 구체적인 방법을 만들었습니다. 계속하기 전에 해당 자습서를 따르십시오.

틀림없이 그러한 모든 설정 절차는 고통스럽습니다. 그러나 저와 함께 견뎌내봅시다: 당신은 이것을 매우 여유롭게 수행할 필요가 있습니다.

6.2. 시작 코드

IDE에 새 프로젝트 또는 모듈 만들기; “Hello World”라는 이름의 Flash Player 프로젝트 (대상 플랫폼: Web)로 시작하는 것이 좋습니다. 초기화 프로세스의 일부로 IDE는 최소 시작 클래스도 설정합니다. 아래 코드로 변경하세요. (일반적으로, 클래스의 이름은 프로젝트와 비슷하기 때문에 아래의 클래스 이름을 프로젝트 이름과 같게 바꾸세요.)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
package
{
    import flash.display.Sprite;
    import starling.core.Starling;

    [SWF(width="400", height="300", frameRate="60", backgroundColor="#808080")]
    public class HelloWorld extends Sprite
    {
        private var _starling:Starling;

        public function HelloWorld()
        {
            _starling = new Starling(Game, stage);
            _starling.start();
        }
    }
}

이 코드는 Starling 인스턴스를 만들고 바로 시작합니다. 우리는 “Game”클래스에 대한 참조를 Starling 생성자에 전달합니다. Starling은 준비가 되면 해당 클래스를 인스턴스화 합니다. (그렇게하면 객체 정렬 순서가 올바르게 되었는지 신경쓰지 않아도 됩니다. 하나 뿐이니까요.)

그 클래스는 당연히 먼저 만들어져 있어야 됩니다. Game 클래스를 생성하고 다음 코드로 변경하세요:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
package
{
    import starling.display.Quad;
    import starling.display.Sprite;
    import starling.utils.Color;

    public class Game extends Sprite
    {
        public function Game()
        {
            var quad:Quad = new Quad(200, 200, Color.RED);
            quad.x = 100;
            quad.y = 50;
            addChild(quad);
        }
    }
}

위 클래스는 우리가 모든 것을 올바르게 설정했는지 확인하기 위해 간단한 빨간색 쿼드를 표시합니다.

Game 클래스는 flash.display.Sprite가 아닌 starling.display.Sprite를 상속 받았습니다. 이것은 우리가 Starling 세계에 있기 때문에 중요합니다. flash.display 패키지와는 완전히 별개입니다.

6.3. 첫 번째 실행

이제 프로젝트를 시작하십시오. 여러분 중 일부는 출력이 약간의 오류를 일으킬 수 있습니다. 오류 메시지가 다음과 같이 표시되기 때문입니다:

Startup error message
그림 2. 예상되는 쿼드 대신 이 오류를 만나보실 수 있습니다.

이 경우 독립 실행 형 Flash Player 대신 열려있는 브라우저일 가능성이 큽니다. 실행/디버그 구성을 확인하고 브라우저가 아닌 Flash Player 프로젝터 (디버그 버전)가 사용되는지 확인하십시오. 문제를 해결해야 합니다.

브라우저 오류 수정

언젠가는 SWF 파일을 HTML 페이지에 포함하려고 할 것입니다. 이 경우 SWF 파일이 포함 된 HTML 파일에서 wmode Flash 매개 변수를 직접 변경하여 오류를 해결할 수 있습니다. 일반적으로 이는 다음과 같이 변경해야 합니다:

1
2
3
4
5
// 다음 줄을 찾으세요 ...
var params = {};

// ... 바로 아래 줄에 추가하십시오:
params.wmode = "direct";
AIR 오류 수정

SWF 파일 대신 AIR 응용 프로그램을 만든 경우에도 이 오류가 표시됩니다. 이 경우 AIR 응용 프로그램 설명자 (HelloWorld-app.xml 또는 이와 비슷한 이름)를 편집해야 합니다. XML 노드 중 renderMode를 검색하고(주석 처리 되었을 수 있음) 값을 direct로 변경하십시오:

1
2
3
4
5
이것 찾기:
<!-- <renderMode></renderMode> -->

이것으로 바꾸기:
<renderMode>direct</renderMode>

여기서 우리가 하고있는 일은 런타임이 GPU에 액세스 할 수 있도록 허용하는 것입니다. 이렇게 하지 않으면, Stage3D가 접근할 수 없습니다.

6.4. 실행이 해결됨

축하합니다! Starling 기반 프로젝트를 성공적으로 컴파일하고 실행했습니다.

Hello World
그림 3. 환상적이군요: 빨간색 상자 안에 있는 빨간색 Starling이라니.

진지모드: 가장 어려운 부분은 이제 당신 뒤에 있습니다. 드디어 실제 프로젝트를 파고들 준비가 되었습니다!

7. 요약

이제 Starling과 함께 작업 할 도구와 리소스에 대해 기본적으로 이해해야 합니다. 첫 번째 실제 게임에 뛰어 들어야 할 때입니다!

Was this article helpful?

Related Articles