상세 컨텐츠

본문 제목

툰붐 스토리보드프로 스크립트 1탄! 패널 익스포트 비트맵 이미지

툰붐

by gyaree 2024. 6. 7. 11:34

본문

반응형

작품 출처 : Mike Morris - Race Around The Moon

선택한 패널을 바로 비트맵 이미지로 익스포트하는 스크립트.

 

스토리보드 프로에서 작업하는 패널을 바로 비트맵 이미지로 익스포트하고 싶을 때, 스토리보드프로는 스크립트 기능을 제공합니다. 스토리보드프로에서 사용하는 스크립트 언어는 자바스크립트 입니다.

스토리보드프로에서 기본 제공하는 TB_ExportCurrentPanelToBitmap.js 스크립트를 이용해서 이미지로 익스포트하는 것과 응용 편으로 씬, 패널 번호를 함께 익스포트하는 방법을 알아보겠습니다.

 

 

TB_ExportCurrentPanelToBitmap.js 

스크립트 코드는 다음과 같습니다.

/*
-------------------------------------------------------------------------------
Name:		TB_ExportXML.js

Description:	This script exports the current panel

Usage:	This function is provided as an example of how to create a shortcut for image export.
        By attaching this function to a toolbar, and customizing it to your current export directory,
        you will then have a toolButton to export the current panel.

Author:		Lori Sponagle

Created		v01 2015/08/15
            
Copyright:   (c) Toon Boom Animation 2015
 
-------------------------------------------------------------------------------
*/
function ExportCurrentPanelToBitmap()
{
   // 익스포트 할 디렉토리 경로를 입력하세요.
   var path = "/Users/usabatch/exportTest";

   // 익스포트 파일 이름을 적어주세요.
   var fileName = "exportTest";
    
   // 익스포트 이미지 포맷 설정. 지원 포맷은 jpg, psd 또는 tga입니다.
   var format = "tga";

   // 이미지 사이즈를 입력합니다.
   var width = 480;
   var height = 270;
   
   var exp = new ExportManager;

   // 카메라 스케일링을 비활성화하려면 주석 처리를 해제하세요.
   // exp.setCameraScaling( false );

   // 카메라의 검은 테두리를 비활성화하려면 주석 처리를 해제하세요.
   // exp.setShowCamera(false);

   // 카메라 키프레임을 표시하려면 주석 처리를 해제하세요.
   //exp.setShowCameraKeyFrames( true );
  
   // 이미지를 확대하려면 주석 처리를 해제하세요.
   //exp.setZoomFactor( 2.0 );
   
    exp.setUseCurrentPanel(true);
    exp.exportToBitmap(path, fileName, format, width, height);
}

 

코드의 주요 부분 설명

  1. 경로 및 파일 이름 설정:
    • 익스포트 할 파일이 저장될 디렉토리 경로와 파일 이름을 설정합니다.
var path = "/home/user/exportTest";
var fileName = "exportTest";

 

2. 내보내기 형식 설정:

  • 이미지 포맷을 설정합니다. 지원하는 포맷은 jpg, psd, tga입니다. png도 가능합니다.
var format = "tga";

 

3. 해상도 설정:

  • 내보내기 이미지의 가로 세로 사이즈를 설정합니다.
var width = 480;
var height = 270;

 

4. ExportManager 객체 생성:

  • ExportManager 객체를 생성합니다. 이 객체는 익스포트 작업을 수행하는 데 사용됩니다.
var exp = new ExportManager;

 

5. 카메라 및 키프레임 설정 옵션:

  • 사용자가 카메라 스케일링, 카메라의 검은 테두리 표시, 카메라 키프레임 표시, 이미지 확대 등을 설정할 수 있는 주석 처리된 코드 블록들이 있습니다. 필요에 따라 주석 처리를 해제하여 사용할 수 있습니다.

 

6. 현재 패널 사용 설정:

  • 현재 패널을 사용하도록 설정합니다.
exp.setUseCurrentPanel(true);

 

7. 비트맵 익스포트:

  • 설정된 경로, 파일 이름, 형식, 해상도를 사용하여 현재 패널을 비트맵 파일로 내보냅니다.
exp.exportToBitmap(path, fileName, format, width, height);

 

 

TB_ExportCurrentPanelToBitmap.js 사용 방법

 

1. 상단 메뉴 바에서 마우스 우클릭:

Scripting 항목을 꺼냅니다.

Scripting

2. 메뉴 바에 Scripting 아이콘이 나타납니다.

 

3. Manage Scripts 아이콘을 클릭하면 아래와 같이 팝업 창이 나타납니다.

 

4. 아래 그림 순서대로 클릭합니다.

 

 

5. 메뉴 바에 Scripting 아이콘 옆으로 방금 꺼낸 스크립트 아이콘이 나타납니다. 

이제 스크립트를 사용할 준비는 끝났습니다.

 

 

6. 썸네일 뷰에서 적당한 패널을 선택합니다.

작품 출처 : Mike Morris - Race Around The Moon

 

 

7. 메뉴 바에 Scripting 패널에서 TB_ExportCurrentPanelToBitmap.js 아이콘을 클릭합니다.

TB_ExportCurrentPanelToBitmap.js

 

 

8. TB_ExportCurrentPanelToBitmap.js 스크립트에 설정한 폴더로 패널 이미지가 저장됩니다.

  1. 경로 및 파일 이름 설정:
    • 익스포트 할 파일이 저장될 디렉토리 경로와 파일 이름을 설정합니다. path 부분에 사용자의 컴퓨터 폴더 경로를 적으면 됩니다.
var path = "/home/user/exportTest";
var fileName = "exportTest";


   var path = "/Users/usabatch/exportTest";

저장 위치 : /Users/usabatch/exportTest

 

이렇게 TB_ExportCurrentPanelToBitmap.js 스크립트를 사용하면 패널의 그림을 손쉽게 이미지로 익스포트 할 수 있습니다.  위의 다른 옵션을 조정하면서 결과가 어떻게 변경되는지 시험해보세요.

 

 

스토리보드프로 스크립트 응용편

topyeson_ExportCurrentPanelToBitmap.js
0.00MB

위에 있는 새롭게 만든 스크립트 파일을 다운로드하세요.

 

이번에는 익스포트 이미지에 씬과 패널 이름을 넣으려면 어떻게 해야 할까요?

그 답은 툰붐의 스토리보드프로 API를 이용할 수 있는 메뉴얼에 있습니다.

 

https://docs.toonboom.com/help/storyboard-pro-22/storyboard/scripting/reference/classExportManager.html#a561e1404dd7805fad06b613cca1cd257

 

Storyboard Pro 22 Scripting Interface: ExportManager Class Reference

This interface is used to export the storyboard project. More... bool exportToBitmap (String &exportDir, String &filePattern, String &bitmapFormat)  Export storyboard to bitmap file. More...   bool exportToMovie (String &exportDir, String &filePattern,

docs.toonboom.com

 

  • TB_ExportCurrentPanelToBitmap.js 스크립트에서 아래 문구가 있는 곳 바로 아래에 다음을 추가합니다.
exp.setUseCurrentPanel(true);

 

위 라인 바로 아래에 다음 내용을 추가합니다.

exp.setShowScenePanelNamesOverlay(true);  (씬과 패널 번호를 출력하는 함수)

 

익스포트된 이미지의 하단 센터에 씬, 패널 번호가 표시됩니다.

 

작품 출처 : Mike Morris - Race Around The Moon


 

반응형

관련글 더보기