NW.js의 선언 설정

NW.js의 초기 선언 설정법에 관한 내용입니다.

NW.js 프레임워크 소개 포스트에도 서술한 것처럼 NW.js 앱을 만들려면 package.json 파일이 필수적으로 있어야 합니다. 일단, 가장 간단하게 설정한 예를 보겠습니다.

{
	"name": "helloworld",
	"main": "index.html"
}

name과 main입니다. 최소한 이 두 개는 필요합니다. name은 앱의 이름, main은 처음으로 보여줄 문서입니다. 필수적인 것은 아니지만 추가로 "version": "1.0.0" 식으로 앱의 버전을 선언할 수도 있습니다.

http://docs.nwjs.io/en/latest/References/Manifest%20Format/으로 들어가면 더욱 다양한 설정에 대해 볼 수 있습니다. 이 포스트에서는 그들 중 자주 쓰이는 속성에 대해 서술합니다.

{
	"name": "helloworld",
	"main": "index.html"
	"window": {
		"icon": "icon.png",
		"width": 400,
		"height": 600,
		"resizable": false
	}
}

4번 줄부터 9번 줄까지는 창에 관한 설정을 한 예입니다.

  • icon은 제목 표시줄 위쪽과 작업 표시줄에 표시될 아이콘을 의미합니다. 파비콘과 함께 있을 경우는 파비콘을 무시하고 package.json에서 설정된 아이콘이 표시됩니다.
  • width와 height는 창의 폭과 높이입니다. 프레임을 제외한 부분의 폭과 높이를 의미하므로 프레임이 있을 경우 실제 크기는 지정한 것보다 더 크게 됩니다.
  • resizable은 창의 크기를 변경할 수 있는가의 여부를 설정하는 것입니다. false로 설정하면 창의 크기를 변경할 수 없습니다. 다만, resizable을 false로 하였더라도 자바스크립트를 사용하여 창의 크기를 변경하는 것은 가능합니다.

그 외에도 여러 설정들이 가능합니다. 그 중에서 유용한 윈도우 설정들을 나열하자면,

id
창에 id를 설정합니다. (문자열)
min-width, min-height
조절할 수 있는 창의 최소 크기를 설정합니다. (숫자)
max-width, max-height
조절할 수 있는 창의 최대 크기를 설정합니다. (숫자) 최소 크기와 최대 크기를 같게 하면 크기 조절이 불가능한 상태가 됩니다. 다만, 최소 크기와 최대 크기를 같게 하는 방법보다는 resizable을 false로 해서 창 크기를 고정하는 것이 더 좋습니다.
always_on_top
항상 모든 창의 위에 놓을 것인지 설정합니다. (true/false)
frame
이것은 프레임셋과 관련된 설정이 아니라 창틀이 보이게 할 것인지를 설정하는 것입니다. false로 설정하면 전체 화면으로 보는 것처럼 창틀이 숨겨집니다. 다만 이 경우 제목 표시줄도 숨겨집니다. (true/false)
fullscreen, kiosk
전체 화면으로 표시됩니다. kiosk의 경우 말 그대로 무인화상기기에 최적화된 모드가 됩니다. (true/false)

그 밖에도 윈도우 관련 설정은 아니지만 user-agent와 chromium-args도 유용한 설정입니다.

참고: 윈도우 설정 중 toolbar 설정은 0.13.0에서 툴바가 삭제되면서 사용하지 않게 된 설정입니다.

답글 남기기

이메일 주소는 공개되지 않습니다. 필수 항목은 *(으)로 표시합니다