사전 요구 사항
레이아웃 미리 보기
레이아웃 미리 보기는 VS Code 탐색기를 통해 편집기에서 레이아웃 파일을 여는 것만큼 간단합니다. 번들의layouts 디렉터리 내에 있는 레이아웃 파일을 클릭하기만 하면 레이아웃의 JSON 내용이 한 탭에 표시되고, 레이아웃의 실시간 미리 보기가 옆의 탭에 자동으로 나타납니다.
레이아웃 파일에 오류가 있는 경우 VS Code 문제 패널에 표시됩니다. 오류가 해결될 때까지 미리 보기는 업데이트되지 않습니다. 이는 상태, 오류 및 경고 섹션에서 자세히 다룹니다.
- 레이아웃 파일의 오른쪽 상단에 있는 “Open Preview” 버튼을 클릭합니다.
- 명령 팔레트를 통해 “Touch Adaptation Kit: Open preview to the side” 명령을 실행합니다.
상태, 오류 및 경고
검증 상태
번들 내의 레이아웃, 자산 및 기타 파일에 수정이 이루어짐에 따라, 확장은 모든 번들이 준수해야 하는 미리 정의된 규칙 세트에 대해 번들의 유효성을 지속적으로 검증합니다. 이는 백그라운드에서 수행되며 번들 내에 중첩된 파일이 저장되거나 어떤 방식으로든 변경(예: 이름 변경)될 때마다 다시 평가됩니다. 이 검증의 상태는 창의 오른쪽 하단에 있는 상태 표시줄 항목을 통해 보고됩니다. 이 상태 표시줄 항목은 편집기에서 적어도 하나의 레이아웃 파일이 열려 있을 때만 표시됩니다. 활성 번들의 이름과 번들에서 발견된 문제 수(오류 및 경고)를 표시합니다. 상태 표시줄 항목을 클릭하면 번들에서 발견된 모든 문제 목록이 있는 VS Code 문제 패널이 열립니다.동기화 상태
미리 보기 패널은 TAK CLI에 대한 활성 번들 사이드로드 연결을 갖고 있습니다. 이것이 어떻게 작동하는지에 대해 자세한 내용은 TAK CLI 문서에서 읽을 수 있습니다. 이 연결의 상태는 검증 상태 표시줄 항목 옆에 있는 창의 오른쪽 하단에 있는 상태 표시줄 항목을 통해 보고됩니다. 이 상태는 미리 보기 패널이 열려 있을 때만 표시됩니다. 위의 스크린샷은 연결이 활성 상태이고 미리 보기가 동기화되었을 때의 상태 표시줄 항목을 보여줍니다. 이는 번들에 오류가 없는 경우입니다(경고는 허용되며 상태를 “동기화됨”으로 유지합니다). 오류가 있는 경우 상태는 “Out of sync”로 변경됩니다. 이 상태 표시줄 항목 위로 마우스를 가져가면 TAK CLI가 호스팅하는 사이드로드 서버에 대한 세부 정보가 있는 툴팁이 나타납니다. 이 주소는 콘텐츠 테스트 앱과 같은 다른 게임 스트리밍 클라이언트를 미리 보기에 연결하는 데 사용할 수 있습니다.오류 및 경고
VS Code 문제 패널은 번들에서 발견된 모든 문제 목록을 표시합니다. 여기에는 검증 프로세스 중에 발견된 모든 문제가 포함됩니다. 문제가 있는 경우 검증 또는 동기화 상태 표시줄 항목을 클릭하면 문제 패널이 열리고 문제 목록이 표시됩니다. 각 문제에는 설명과 문제가 발견된 번들 내의 위치가 있습니다. 예를 들어, 다음 스크린샷에서는platformer-advanced.json 레이아웃 파일이 번들에 존재하지 않는 자산(run.png)을 참조하는 오류가 번들에 하나 있습니다.
번들에 존재하는 자산으로 참조를 변경하거나 번들에 자산을 추가할 때까지 미리 보기의 상태는 “Out of sync”입니다.
다음 단계
[!div class=“nextstepaction”] 미리 보기 사용자 지정
