buttonDef

2.4.0 버전부터 지원합니다.

툴바, 메뉴, 풍선팝업에 표시할 플러그인 버튼을 정의합니다.

공통 키

키타입설명
namestring버튼 이름입니다. editor.toolbar, editor.balloon 등에 등록할 때 사용하며 반드시 고유해야 합니다. 단일 버튼 플러그인에서 생략하면 플러그인 이름을 기본값으로 사용하고, 플러그인이 여러 버튼을 정의할 때는 필수입니다.
labelstring버튼 레이블입니다. 툴팁으로 표시됩니다.
typestring2.7.0 버전부터 지원합니다. 'button'(기본값) 또는 'dropdown'.
iconSVGstring버튼 아이콘으로 쓸 SVG 마크업 또는 <img> 태그입니다.
iconNamestring에디터에 이미 등록된 아이콘을 이름으로 지정해 재사용합니다(iconSVG가 설정되지 않은 경우에 사용합니다).

label은 마우스를 올리면 툴팁으로 표시됩니다:

1.00

Button (type: 'button')

키타입설명
onClickFunc함수버튼이 클릭될 때 실행됩니다.
{
  onClickFunc: function (event) {
    // ...
  }
}

2.7.0 버전부터 지원합니다.

키타입설명
onClickFunc함수드롭다운이 클릭될 때 실행됩니다. 분할 버튼 드롭다운(isSingle: false)의 경우, 앞쪽 버튼을 클릭할 때 실행됩니다.
isSinglebooleantrue (기본값) — 단일 드롭다운. false — 분할 버튼 드롭다운.
useIconbooleanfalse (기본값) — 텍스트 드롭다운. true — 아이콘 드롭다운.
dropdownItemsobject[]드롭다운 항목입니다.

onClickFunc 동작:



dropdown_onclickfunc_a.gifdropdown_onclickfunc_b.gif

isSingle — 단일 버튼과 분할 버튼 드롭다운:



dropdown_issingle_a.gifdropdown_issingle_b.gif

useIcon — 아이콘 vs. 텍스트 드롭다운:



dropdown_useicon_a.gifdropdown_useicon_b.gif

dropdownItems 예시:

{
  type: 'dropdown',
  isSingle: true,
  useIcon: false,
  dropdownItems: [
    { label: 'Item 1' },
    { label: 'Item 2' },
    { label: 'Item 3' }
  ]
}

1.00

드롭다운 항목 (dropdownItems)

키타입설명
labelstring항목 라벨입니다.
onClickFunc함수항목을 클릭할 때 실행됩니다.
cssTextstring항목에 적용되는 인라인 CSS입니다.

label 표시 모습:

1.00

onClickFunc 동작:

1.00

cssText 스타일:

{
  dropdownItems: [
    { label: 'Item 1', cssText: 'font-size: 20px; color: orange;' },
    {
      label: 'Item 2',
      cssText: 'font-size: 15px; color: red;',
      onClickFunc: function () { /* ... */ }
    }
  ]
}

1.00