렌더기

블록의 모양은 블록의 정의 (즉, 필드와 연결)에 따라 렌더러에 의해 결정됩니다.

내장 렌더러

Blockly는 세 가지 기본 제공 렌더러를 제공하며 각 렌더러는 프로그램에 약간 다른 느낌을 줍니다.

렌더기 설명 이미지
Thrasos 권장 렌더러입니다. 더 균등한 간격과 단색 테두리가 있는 geras 렌더러의 최신 버전입니다. thrasos
Geras 기본 렌더러입니다. Blockly가 빌드된 원래 렌더러입니다. geras
Zelos Scratch 3.0 블록 디자인을 기반으로 하는 렌더러입니다. zelos

이러한 렌더러 중 하나를 사용하려면 이름을 구성 옵션에 전달하세요.

Blockly.inject('blocklyDiv', {
  renderer: 'thrasos'
});

맞춤 렌더러

기본 렌더러와 다른 모양과 느낌을 프로그램에 부여하려면 맞춤 렌더러를 만들 수도 있습니다. 시작하려면 Blockly팀에서 다음을 권장합니다.

  1. 렌더러 개념 문서를 읽고 렌더러의 모든 구성요소가 어떻게 결합되는지 알아보세요.
  2. 맞춤 렌더러 Codelab을 완료하여 맞춤 렌더링을 직접 실습해 보세요.
  3. 프로젝트에 디버그 렌더러를 추가합니다.
  4. 렌더러를 맞춤설정합니다.