화면 문서

client/**/ui/<이름>.json. ui 라는 폴더 안의 .json 이 화면입니다.

로비의 화면은 client/boot/ui/ 에 두세요. 로그인 전에 내려가는 것은 그 폴더뿐이고, 로비는 로그인 전에 그려집니다.

{
  "nodes": [
    {
      "name": "panel", "kind": "Frame", "anchor": "center",
      "width": 380, "height": 200, "colour": [0.09, 0.10, 0.13, 0.95],
      "children": [
        { "name": "title", "kind": "Text", "anchor": "top", "y": -34,
          "width": 340, "height": 24, "text": "내 게임", "fontSize": 18 },
        { "name": "action", "kind": "Button", "anchor": "bottom", "y": 28,
          "width": 240, "height": 40, "colour": [0.2, 0.42, 0.85, 1],
          "visible": false }
      ]
    }
  ]
}
name 스크립트가 부르는 이름. 없어도 됩니다 — 화면의 대부분은 배경입니다
kind Frame Text Image Button
anchor 부모 안의 어디에 붙을지
x y width height 그 기준점에서의 자리와 크기
text fontSize image colour visible 생김새
children 그 안에 놓이는 것들

트리 모양 그대로 중첩합니다. 부모를 번호로 가리키는 형식은 눈으로 확인할 수 없습니다.

스크립트와의 관계

문서는 무엇이 있는지, 스크립트는 무엇이 언제 바뀌는지입니다.

local screen = Chain2D.UI.load("lobby")
screen.find("action"):set({ text = "시작", visible = true })

버튼의 onPressed 는 문서에 쓸 수 없습니다. 함수는 파일에 담기지 않고, 담긴 척하는 형식은 결국 파일 안의 프로그램이 됩니다.

에디터

Creator 의 씬 트리에 화면으로 나옵니다. 눌러서 고르고, 인스펙터에서 값을 고치고, 저장하면 이 파일이 바뀝니다. 배치는 게임이 쓰는 것과 같은 코드가 풀기 때문에 미리보기와 실제가 같은 이유로 같습니다.

숨겨진 노드도 에디터에서는 흐리게 보입니다. 게임은 아예 그리지 않지만 — 숨긴 패널의 버튼이 눌리면 안 됩니다 — 스크립트가 켜 주기 전에는 보이지도 집히지도 않는 화면은 편집할 수가 없습니다.