• 그래픽스 엔진 등 공학적인 주제에 초점을 맞춤
  
• RPG만들기 에뮬레이터 스마트폰 버전
  
• 참고 위키: RPG만들기 한글, 영문
  
• Java로 만든 3D 물리 엔진으로 2D 엔진 만들기
  
• 툴이 아닌 에뮬레이터 위주
  
• UDK로 뭔가 삽질 하다가 멘붕하고 선회한 스터디 -ㅅ-
  

• 권순의, 박재민, 박한기
  
  

• 여름방학: 매 주 화, 목 저녁 7시 반 ~ 10시
  
• 2학기: 매 주 목요일 오후 5시 이후
  
  

• 알피지 만들기(RPG Maker, 이하 알만툴)은 누구든지 손쉽게 바람의나라 같은 형식의 2D 롤플레잉 게임을 만들 수 있도록 도와주는 툴이다.
  
  요즘 한창 날리는 UDK(이쒸....)나, Unity같은 게임엔진과 딸려오는 툴과 같은 개념이다.
  
  현재 VX Ace버전까지 나와있으며 아직도 전세계에서 많은 이들이 알만툴로 게임을 만들고 있다.
  
  
• PC에서 돌아가는 게임 엔진(런타임)은 있지만 요즘 대세인 모바일에서 돌릴 수 있는 런타임이 존재하지 않는다.
  
  따라서 이번 기회에 알만툴용 모바일 버전 엔진을 만들어 보려고 한다.
  
  
  
• 제작 순서는 다음과 같이 진행하려고 한다.
  RPGMaker VX Version을 Java로 -> Android용으로 -> Windows용으로... (겨울 방학 끝날 때 쯤엔 완성 되겠지...)
  
  실질적으로 2단계서부터 모바일화가 진행되며 1단계가 가장 오래 걸릴 듯 싶다.
  
  

• 3D 그래픽스 지식 및 기본 그래픽스 개념
  
• 리버스 엔지니어링 노하우
  
• 모바일 프로그래밍
  
• 게임 로직 및 흐름의 이해
  
• 설계 패턴
  
• 다양한 프로그래밍 언어의 습득(Java, Ruby, C# 등등..)
  

• jpct 설치 및 RPG 만들기가 어떻게 생겨 먹은 놈인지 확인
  
• jpct 튜토리얼 보고 따라 해 보기 - Hello World!
  
  

1. 이클립스 프로젝트 생성은 생략. 게다가 이미 svn repository에 등록해놓았음
   
   
2. PC용 jPCT 엔진을 받는다
   
   
3. 받은 엔진 안에는 jpct에 해당하는 jpct.jar과 또다른 그래픽 라이브러리인 lwjgl이 있다. lwjgl.jar까지 라이브러리로 등록한다
   
   
4. lwjgl.jar은 내부적으로 native 함수를 호출한다. 이 native함수는 dll파일에 담겨져 있는데 이클립스에서 Window -> preferences -> java/installed JREs 에서 vm 설정에 -Djava.library.path=D:\Workspace\rma\libs 형식으로 lwjgl.dll 또는 lwjgl64.dll의 폴더 경로를 입력함으로써 참조하게 한다. 이와 관련된 오류는 java.lang.UnsatisfiedLinkError이다.
   
   

1. 이클립스 메뉴에서 window -> preferences -> java -> build_path -> user_libraries로 가면 유저 라이브러리를 등록할 수 있다.
   jPCT와 LWJGL을 등록하는데 둘이 묶어서 할 수도 있고 서로 다른 라이브러리로 등록해도 된다.
   lwjgl의 경우 참조하는 dll(안드로이드라면 so) 파일을 등록해야 하는데 이건 native library location에서 경로를 지정해주면 된다.
   
   
2. 프로젝트 속성 -> java build path에서 방금 등록한 유저 라이브러리를 추가한다.
   
   (개인적으로 이게 더 깔끔한 방법인 것 같다)
   

• 재민이 블로그 - jpct 설치?에 대한 내용
  
  

• 3D에서 정점, UV좌표, 삼각형의 표현에 대해 설명하고 실제로 객체를 제작해봄
  
  
• 다음 스터디까지 과제로 오각형 만들어오삼
  
• 파일 분석 정보를 기반으로 parser 제작 시작함. *.rvdata는 들어가는 정보의 종류는 다르지만 일정한 포맷이 있는듯함
  예상보다 파일분석은 빨리 끝날지도.
  
  

• 과제 검사(FAIL) - 코딩에 앞서 엄밀한 수학 모델링을 먼저 해보는 것이 필요할듯
  
  
• Actors 파일 해석법을 소개하고 다른 파일을 맛보기로 분석해봄
  
  
• Actor를 읽어들이는 Actors.rvdata용 파일 파서 제작 완료
  
  

• 알만툴을 이해하기 위해 데이터베이스에 해당하는 *.rvdata를 뜯어봐야겠다 라는 생각을 초기에 했었지만
  곧 뻘짓임을 알았다 -_-;;
  
  .rvdata 파일은 단지 클래스들을 Marshal 모듈을 이용하여 덤프한 내용을 기록한 것임을 알게 되었기 때문이다.
  
  게다가 알만툴에서 F1키 누르면 나오는 도움말에 Built-in 클래스나 모듈을 제외한 모든 자료구조(RPG::Actor, RPG::Map 등등..)의 소스가 오픈되어 있었다.
  
  
• 따라서 파일분석은 곧바로 때려치고 루비스크립트로 각종 .rvdata들을 불러오는 작업을 시작했다.
  
  

• built-in class제작 시작함
  워밍업으로 Font, Color 클래스 제작함
  

• 박한기 참가
  

• 프로젝트 오리엔테이션 및 기초이론 소개
  
• Audio 초기화 오류 문제 탐색
  
• 그래픽이 잘리던 문제 탐색
  
  

• 오디오는 여전히 말썽(...)
  
• BufferedImage 클래스를 사용하여 글자를 출력하는 방법 학습
  
  

• 글자의 정렬 구현
  
• 프레임워크에서 비트맵과 스프라이트의 개념, uv좌표에 대한 과외(...)
  
• ogg파일 출력
  
• Tilemap 작업
  Tilemap은 loop이 있는 경우에는 좀더 머리를 써야할듯 싶다
  
  

• 그래픽 엔진을 2D 라이브러리인 Slick2D로 교체하고 작업중
  
  branch 주소 http://nforge.zeropage.org/svn/rma/branches/slick_version
  - 메모리 사용 퍼포먼스가 많이 좋아졌다.
  - 코드가 '많이' 간결해졌다.
  
• 3D에서도 2D를 구현할 수 있음을 jPCT를 통해 충분히 보였고 이 이상의 작업은 3D지식을 필요로 하지 않기 때문에 3D구현은 여기서 끝내도 좋을 것이라 판단되었다.
  

• jPCT에서는 명시적으로 Orthographic rendering(직교투영 렌더링)을 지원하지 않는다
  http://www.jpct.net/forum2/index.php/topic,1789.msg13175.html#msg13175
  따라서 근사적으로라로 직교투영을 만든다
  
  
• 근사 직교투영 좌표계 만들기 : 안드로이드 jPCT-AE로 (근사) 직교투영(Orthogonal Projection) 실현하기
  한줄요약: 카메라를 겁나 멀리 갖다두면 근사적으로 직교투영이 됨ㅋ
  
  
• 실제 구현 코드
  
  

• 이를 이용하면 직교투영 좌표가 된 것처럼 보이긴 하지만 depth에 해당하는 z값이 바뀌면 조금이라도 오차가 생기기 때문에 이를 보정하여야 한다
  특히 렌더링 순서를 z값을 조정함으로 결정시키기 때문에 정확한 렌더링을 위해서는 보정 테크닉을 아는 것이 필수이다.
  

[PNG image (14.84 KB)]

• 위 그림에서 볼 수 있듯이 실제 Object의 중점과 사람이 느끼는 Object의 위치는 다르다. 크기 역시 마찬가지이다.
  만약 위 그림처럼 Object가 스크린에서 delta만큼 떨어져 있다면 간단한 비례식으로 (length-delta)/length 만큼 크기가 조정되어야 한다
  
  중심의 이동은 Object의 중심을 O, Projection의 중심을 P라고 할 때 벡터 PO만큼을 이동시키면 된다. 벡터 PO는 카메라 위치와 Object 중심을 잇는 직선의 연장선상에 있다는 것을 생각하면 계산이 간편해진다.
  
  
• interpolation 구현 코드
  

• 모든 도형의 기초가 되는 도형이다. 모든 도형은 삼각형만으로 구성할 수 있고 또 쪼갤 수 있다.
  
  
• jpct에서 텍스쳐 있는 삼각형을 그리기 위해 필요한 정보는 다음과 같다
  
  
  • 정점(vertex, 꼭지점) : 삼각형은 서로 다른 3개의 한 직선 위에 있지 않은 정점들로 구성된다.
    
    
  • uv좌표 : 텍스쳐가 매핑되는 좌표계를 설정한다. (0, 0)부터 (1, 1)까지의 좌표에 텍스쳐 하나가 들어가게 된다
    텍스쳐에 대해서는 나중에 할 말이 있을것.
    
    
  • 정점들을 잇는 순서 : 이 순서에 따라 삼각형의 보이는 면과 보이지 않는 면이 결정된다.
    다른 곳은 잘 모르겠으나 openGL에서는 오른나사의 법칙에 따라 엄지가 가리키는 방향의 면이 보이는 면이다.
    CCW 판별 알고리즘을 이용해서 순서를 하드코딩하지 않고 자동으로 계산하게 할 수도 있다.
    
    
  • Texture : 도형을 색칠하기 위한 정보가 들어있는 2차원 정사각형이라고 생각해도 좋다. 한 변의 길이는 속도를 위해 2의 제곱수여야 한다.
    

• 왼쪽 위, 오른쪽 아래 좌표만 알면 그릴 수 있다.
  
• 사각형은 2개의 삼각형으로 구성된다.
  
• 실제 구현
  
  

• 직선도 실제로는 너비를 가져야 렌더링이 가능하기 때문에 다음과 같은 구조를 가져야 한다
  

[PNG image (7.47 KB)]

• vLine = vEnd - vStart
  
• normal(vLine과 수직인 벡터) = vLine × (-z방향 벡터) -> normalize하여 길이가 1인 벡터로 만듦.
  
• (u1, v1)과 (u1, v2)는 vStart ± (normal/2)
  
• (u2, v1)과 (u2, v2)는 vEnd ± (normal/2)
  
• 실제 구현
  
  

• 게임의 메인 로직을 담당하는 스크립트(루비로 작성됨)
  
• 캐릭터 정보, 아이템 정보, 스킬 정보 등의 리소스 부분(파일로 저장되어 있음)
  
• 그래픽, 사운드 등 게임의 엔진에 해당하는 부분
  
  

• 알만툴에서 데이터베이스에 해당하는 .rvdata 파일은 루비 클래스를 덤프한 내용을 기록한 것이다.
  이를 불러오고 저장하는 load_data함수와 save_data함수를 도움말에서 제공하고 있다.
  
  

def load_data filename
  File.open(filename, "rb") { |f|
    obj = Marshal.load(f)
    return obj
  }
end

def save_data filename, obj
  File.open(filename, "wb") { |f|
    Marshal.dump(obj, f)
  }
end

1. JRuby 홈페이지에서 JRuby를 설치한다. 64bit OS에서도 32비트 전용으로 설치해야 돌아가는듯 하다.
   
   
2. JRuby설치경로/lib 에 위치한 jruby.jar파일을 프로젝트 라이브러리 폴더에 넣는다.
   
   
3. 이클립스에서 .jar파일 오른쪽 클릭 메뉴에서 build path->add to build path로 등록한다.
   
   
4. 간단하게 코딩한다.
   아래 코드는 프로젝트 내에서 src/ruby/main.rb 파일을 호출하는 코드.
   

        public static void main(String[] args) throws IOException, ScriptException
        {
                ScriptEngine rbEngine = new ScriptEngineManager().getEngineByName("jruby");

                // start rubyscript
                rbEngine.eval(new FileReader("src/ruby/main.rb"));
        }

• 예제: Color 클래스의 구현
  
  

• Bitmap: 이미지 데이터가 저장되는 클래스
  
• Color: 색상 정보(RGBA)를 가지고 있는 클래스
  
• Font: 글꼴 정보를 가지고 있는 클래스. .ttf파일을 지원해야 한다.
  
• Plane: 이미지가 표시되는 평면 클래스. 이미지가 타일형으로 반복표시된다.
  
• Rect: top-left 코너와 너비, 높이 정보를 가지는 클래스.
  
• Sprite: Bitmap의 표현이 이루어지는 클래스.
  
• Table: 3차원 배열 클래스.
  
• Tilemap: 맵의 표시와 관련된 클래스(?)
  
• Tone: 이미지의 색상보정을 위한 클래스(?)
  
• Viewport: 2D상의 뷰포트를 구현한 클래스
  
• Window: 알만툴 내부에서의 윈도우 표시를 담당하는 클래스.
  
• RGSSError: 에러처리 클래스. StandardError클래스를 상속함
  
  

• Audio: 오디오 출력을 담당하는 모듈
  
• Graphics: 그래픽 출력을 담당하는 모듈
  
• Input: 유저의 입력(키보드)를 담당하는 모듈
  
• RPG: 알만툴의 각종 자료구조들을 담고 있는 모듈
  

• Audio를 위한 Java OpenAL 튜토리얼
  
• .wav파일을 불러 오는 것이 다인데 문제는 사용해야 할 파일들이 midi 아님 ogg 파일 <- 코덱이 있어야 한다나 -ㅅ-
  
  • 참고 1
    
  • 참고 2
    
  • 참고 3?
    
    
  • OGG 파일을 사용하기 위해선 Loading Sound에서 말하길 Slick-Util zip을 받아 라이브러리에 추가하라고 함... 그럼 된다나..
    
    • 다운로드
      
    • jorbis-*.jar 과 jogg-*.jar library jar files 를 classpath 에 넣어야 하는데 그게 Slick-Util zip 있다고..
      
      
• 파일이 재생이 안 됨
  
  • 박재민: 이 링크가 재생오류시 도움이 될듯..
    

public void bgm_start(String filename, int volume, double pitch) {
        // Initialize OpenAL and clear the error bit.
        try {
                AL.create();
        } catch (LWJGLException le) {
                le.printStackTrace();
                return;
        }
        AL10.alGetError();

        // Load the wav data.
        if (loadALData("test") == AL10.AL_FALSE) {
                System.out.println("Error loading data.");
                return;
        }

        setListenerValues();

        AL10.alSourcePlay(source.get(0));

        killALData();
        AL.destroy();
}

• 맨 마지막 함수 killALData() 함수와 AL.destroy()가 실행하자마자 종료시킴.. 주석처리 하니까 소리는 나옴
  
  

• 오디오 라이브러리에 playAsSoundEffect()를 여러번 호출하면 여러번 음악 파일이 실행되는 것을 확인 함.
  
  

try {
        // you can play wavs by loading the complete thing into
        // a sound
        wavEffect = AudioLoader.getAudio("WAV", ResourceLoader.getResourceAsStream("sound/Test.wav"));
} catch (IOException e) {
        e.printStackTrace();
}

while (Keyboard.next()) {
        if (Keyboard.getEventKeyState()) {
                if (Keyboard.getEventKey() == Keyboard.KEY_T) {
                        // play as a one off sound effect
                        wavEffect.playAsSoundEffect(1.0f, 1.0f, false);
                }
                if (Keyboard.getEventKey() == Keyboard.KEY_G) {
                        wavEffect.stop();
                }
        }
}

• 위와 같은 방식으로 키보드를 통한 음악 실행과 정지가 가능하다....
  
  • 근데 이렇게 하고 보니 기존에 했던 코드가 아무짝에도 쓸모 없다는 사실을 알았다. -_-;
    
    

public void init(InputStream filename) {

        try {
                // you can play oggs by loading the complete thing into
                // a sound
                oggEffect = AudioLoader.getAudio("OGG", filename); // java.lang.ArithmeticException: / by zero
                oggEffect.playAsSoundEffect(1.0f, 1.0f, false);
        } catch (IOException e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
        }

        // polling is required to allow streaming to get a chance to
        // queue buffers.
        SoundStore.get().poll(0);
}

• 왜 저기서 0으로 나눠서 문제가 된다는거지???????
  박재민: 좀더 검색해보니까 길이가 짧은 스테레오 ogg파일은 문제가 있는듯 보임. 모노로 변환해보니깐 되더라;;
  
  • 난 안됨 - 권순의
    
    

public void init(InputStream filename) {

        URL file = null;
        try {
                file = new URL(filename);
        } catch (MalformedURLException e1) {
                // TODO Auto-generated catch block
                e1.printStackTrace();
        }

         try {
                // you can play oggs by loading the complete thing into
                    // a sound
                        oggStream = AudioLoader.getStreamingAudio("OGG", file);
                        oggStream.playAsMusic(1.0f, 1.0f, true);
                } catch (IOException e) {
                        // TODO Auto-generated catch block
                        e.printStackTrace();
                }

        // polling is required to allow streaming to get a chance to
        // queue buffers.
        SoundStore.get().poll(0);
}

• 위와 같이 바꾸었을 경우 getStreamingAudio()에 들어가는 인자가 String, String이 될 수 없고 URL로 바꾸어 주어야 함. 그래서 소리가 날 까 했는데 no protocol: assets/rpgvx_resources/Audio/SE/Cursor.ogg 이라는 아름다운 문자를 날려줌. -ㅅ-...
  
  • 이 경우 file = new URL(filename); 를 file = new URL("file://" + filename);로 바꾸어 주면 소리가 날 것 처럼 사람들이 써 놨으나 실패. 그래서 절대 경로를 모두 적어주었지만 역시나 파일을 읽는데 실패했다.
    
    

public void init(InputStream filename) {

        try {
            // you can play oggs by loading the complete thing into
            // a sound
                oggStream = AudioLoader.getStreamingAudio("OGG", ResourceLoader.getResource(filename));
                oggStream.playAsMusic(1.0f, 1.0f, true);
        } catch (IOException e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
        }

        // polling is required to allow streaming to get a chance to
        // queue buffers.
        SoundStore.get().poll(0);
}

• Test로 실행이 되었던 소스였으나, 여기선 java.io.BufferedInputStream.read(Unknown Source)라며 즐을 날려 준다 -_-.... 아니 왜!!!
  
  • 맨 위 처음 Test한 방법과 같은 방법으로 시도 해 보았으나 소리가 안 나서 멘붕하고 있음
    
    

• 이클립스에서 help - install new software로 가서 업데이트 사이트에 http://dl-ssl.google.com/android/eclipse/ 를 입력하면 가능한 업데이트 목록이 나온다.
  
  
• 나오는 목록들 중에 Developer tools - Android DDMS, Android development tools를 선택한 뒤 설치를 진행한다.
  
  
• 이클립스를 재부팅하면 Android SDK를 설치할 거냐고 묻는 경우가 있는데, 설치해야 한다.
  
  

• slick은 Mercurial(HG)로 버전관리를 하기 때문에 미리 Mercurial을 설치한다.
  
  
• [hg clone https://bitbucket.org/kevglass/slick] 명령으로 slick의 전체 코드를 다운받는다.
  
  
• 이클립스에서 slick의 코드들 중 Slick과 Slick-AE만 각각 프로젝트로 import한다.
  
  
• 빌드하기 전에 libgdx를 최신버전으로(여기서는 0.9.6) 바꿔야 하는데, 버전이 올라가면서 InputProcessor부분에 인터페이스가 바뀐 부분이 있어 그부분을 새로 고쳐주어야 한다.
  touchUp, touchDown함수는 있는 것을 사용하고, scrolled와 touchMoved 역시 비슷하게 구현해 주자.
  
  
• 이클립스의 package explorer에 보면 Slick-AE에 build.xml이 있다. 이것을 실행하면 빌드가 수행되며, target폴더에 slick-ae.jar 파일이 생성된다.
  

• 안드로이드 환경에서 루비스크립트를 실행하기 위해서는 ruboto라는 프레임워크가 필요하다.
  내부적으로 JRuby를 사용하고 있기 때문에 우리 프로젝트와도 잘 맞는 프레임워크라 할 수 있다.
  
  컴퓨터에 ruboto 세팅하기
  ※ ruboto를 설치/빌드하기 위해서는 JRuby(또는 그냥 Ruby), Ant(자바용 make)가 필요하다.
  
• 모든 세팅이 완료된 후 커맨드라인에서 ruboto gen app --package <애플리케이션 패키지 이름> 으로 앱을 생성하면 알아서 템플릿을 만들어준다.
  그 뒤 생성된 폴더로 가서 rake install start를 하면 바로 컴파일을 하고 폰으로 옮겨 실행까지 해줘서(...) 디버깅이 가능해진다.
  
  
  

  [PNG image (198.25 KB)]
  

  [PNG image (56.95 KB)]
  
  기본 앱을 실행한 화면, ruboto가 동작하기 위해서는 마켓에서 ruboto-core을 설치해야 한다.
  왼쪽 그림에서 이미지를 누르면 ruboto-core을 받을 수 있는 마켓으로 이동한다.
  오른쪽 그림은 core을 설치한 뒤 제대로 실행되는 앱의 모습이다.
  
  

public void start()
{
    init();
    while(running())
        gameLoop();
    finish();
}

protected void gameLoop()
{
    updateAndRender();
}

• OpenGL을 사용하는 GLSurfaceView의 경우 자체적으로 렌더링 루프를 관리하므로 개발자가 손을 댈 수 없다.
  
  
• 게다가 GLThread가 아닌 다른 스레드에서 OpenGL작업을 할 수 없다.
  
  
• Canvas로 직접 제어가 가능한 View인 SurfaceView는 다른 스레드에서 렌더링 작업을 할 수 있으며 이를 이용하여 렌더링 루프도 직접 만들 수 있다.
  
  
• 많은 게임엔진들이 나와 있으나 모조리 OpenGL을 사용한다.
  
  

• 프로젝트 시작 7개월여만에 잉여력을 발산하여 최종 완성.
  
• 안드로이드 플레이 영상
  
  

• 느리다. 초당 20프레임 이상을 낼 수 없다. 싱글 스레드의 한계.
  RTP 엔진의 구조적 문제이므로 맛폰 하드웨어 스펙이 더 좋아지지 않는 이상 원래 소스를 그대로 가져다 쓰면서 성능까지 좋을 수는 없을듯.
  
• 터치가 구린건 애교. -_-a
  
  

• 와 여기 쩐다. 내용 그대로 튜토리얼로 만들 정도인듯.. - 서지혜
  
• 오.. 근데 마지막 결론이..ㅋㅋ