<< Click to Display Table of Contents >>
dialogueflow.stylejson
DialogueFlow의 스타일을 설정합니다.
Reference
파라미터 값은 {"common":{"Key1":"Value1,"Key2":"Value2",...},"progressbutton":{"Key1":"Value1,"Key2":"Value2",...},"contents":{"Key1":"Value1,"Key2":"Value2",...},"progressbar":{"Key1":"Value1,"Key2":"Value2",...},"popupwindow":{"Key1":"Value1,"Key2":"Value2",...},"inputcomp":{"Key1":"Value1,"Key2":"Value2",...,"ComponentType":{"PropertyName1":"PropertyValue1,"PropertyName2":"PropertyValue2",...}}} 형태로 JSON 형식의 문자열로 설정하시기 바랍니다.
common에서 설정 가능한 Key는 아래와 같습니다.
Key |
설명 |
background |
배경 이미지 또는 색 |
dialogclosebutton |
[닫기] 버튼 이미지 경로 또는 색 |
fixedgroupheader |
그룹 헤더 틀 고정 |
fixedseperatorcolor |
틀 고정 구분선 색 |
fixedseperatorthick |
틀 고정 구분선 두께 |
optionaltext |
선택 항목 텍스트 |
optionaltextcolor |
선택 항목 글꼴 색 |
requiredtext |
필수 항목 텍스트 |
requiredtextcolor |
필수 항목 글꼴 색 |
showtitle |
제목 표시 여부 |
progressbutton에서 설정 가능한 Key는 아래와 같습니다.
Key |
설명 |
|
background |
배경 색 |
|
buttonsizetype |
진행 버튼 크기 타입 normal, fittowidth 중 하나의 값으로 설정 |
|
cornerradius |
둥근 테두리 반경 |
|
fontcolor |
글꼴 색 |
|
fontsizenormal |
글꼴 크기(높은 해상도) |
|
fontsizesmall |
글꼴 크기(낮은 해상도) |
|
text |
done |
[Done] 버튼 텍스트 |
inputcomp |
입력 영역의 [OK] 버튼 텍스트 |
|
statement |
안내문의 [다음] 버튼 텍스트 |
|
thankyou |
[종료] 버튼 텍스트 |
|
welcome |
[시작] 버튼 텍스트 |
contents에서 설정 가능한 Key는 아래와 같습니다.
Key |
설명 |
|
description |
fontcolor |
글꼴 색 |
fontsizenormal |
글꼴 크기(높은 해상도) |
|
fontsizesmall |
글꼴 크기(낮은 해상도) |
|
fontstyle |
글꼴 스타일 normal, bold, italic 중 하나의 값으로 설정 |
|
textalignment |
텍스트 정렬 left, center, right 중 하나의 값으로 설정 |
|
displayname |
fontcolor |
글꼴 색 |
fontsizenormal |
글꼴 크기(높은 해상도) |
|
fontsizesmall |
글꼴 크기(낮은 해상도) |
|
fontstyle |
글꼴 스타일 normal, bold, italic 중 하나의 값으로 설정 |
|
textalignment |
텍스트 정렬 left, center, right 중 하나의 값으로 설정 |
|
question |
fontcolor |
글꼴 색 |
fontsizenormal |
글꼴 크기(높은 해상도) |
|
fontsizesmall |
글꼴 크기(낮은 해상도) |
|
fontstyle |
글꼴 스타일 normal, bold, italic 중 하나의 값으로 설정 |
|
textalignment |
텍스트 정렬 left, center, right 중 하나의 값으로 설정 |
|
title |
backgroundcolor |
배경 색 |
cornerradius |
둥근 테두리 반경 shapetype이 badge인 경우에 적용됨 |
|
fontcolor |
글꼴 색 |
|
fontsizenormal |
글꼴 크기(높은 해상도) |
|
fontsizesmall |
글꼴 크기(낮은 해상도) |
|
fontstyle |
글꼴 스타일 normal, bold, italic 중 하나의 값으로 설정 |
|
shapetype |
표시 형태 normal, badge 중 하나의 값으로 설정 |
|
textalignment |
텍스트 정렬 left, center, right 중 하나의 값으로 설정 |
progressbar에서 설정 가능한 Key는 아래와 같습니다.
Key |
설명 |
backgroundcolor |
배경 색 |
disablenextbutton |
비활성화된 [다음] 버튼 이미지 경로 |
disableprevbutton |
비활성화된 [이전] 버튼 이미지 경로 |
enablenextbutton |
활성화된 [다음] 버튼 이미지 경로 |
enableprevbutton |
활성화된 [이전] 버튼 이미지 경로 |
progresscolor |
프로그레스 바의 전경 색 |
trackcolor |
프로그레스 바의 배경 색 |
popupwindow에서 설정 가능한 Key는 아래와 같습니다.
Key |
설명 |
|
backgroundcolor |
배경 색 |
|
optionaltextcolor |
선택 글꼴 색 |
|
requiredtextcolor |
필수 글꼴 색 |
|
cancelbutton |
backgroundcolor |
배경 색 |
cornerradius |
둥근 테두리 반경 |
|
fontcolor |
글꼴 색 |
|
fontsizenormal |
글꼴 크기(높은 해상도) |
|
fontsizesmall |
글꼴 크기(낮은 해상도) |
|
confirmbutton |
backgroundcolor |
배경 색 |
cornerradius |
둥근 테두리 반경 |
|
fontcolor |
글꼴 색 |
|
fontsizenormal |
글꼴 크기(높은 해상도) |
|
fontsizesmall |
글꼴 크기(낮은 해상도) |
|
description |
fontcolor |
글꼴 색 |
fontstyle |
글꼴 스타일 normal, bold, italic 중 하나의 값으로 설정 |
|
itembutton |
bordercolor |
테두리 색 |
cornerradius |
둥근 테두리 반경 |
|
fontcolor |
글꼴 색 |
|
selectbackgroundcolor |
선택된 아이템 배경 색 |
|
selectbordercolor |
선택된 아이템 테두리 색 |
|
unselectbackgroundcolor |
선택되지 않은 아이템 배경 색 |
|
unselectbordercolor |
선택되지 않은 아이템 테두리 색 |
|
question |
fontcolor |
글꼴 색 |
fontstyle |
글꼴 스타일 normal, bold, italic 중 하나의 값으로 설정 |
|
attachmentbutton |
titlebackgroundcolor |
첨부 개수 영역 배경 색 |
titlefontcolor |
첨부 개수 글꼴 색 |
|
attachtextcolor |
추가 글꼴 색 |
|
fontcolor |
첨부된 파일 이름 글꼴 색 |
|
separatorcolor |
구분선 색 |
|
filesizecolor |
파일 사이즈 글꼴 색 |
|
grabbericon |
순서 이동 아이콘 이미지 경로 또는 색 HTML5JS PC 뷰어에서는 동작 안 함 |
|
contextmenuicon |
팝업 메뉴 아이콘 이미지 경로 또는 색 모바일 뷰어에서는 동작 안 함 |
|
datetimepicker |
disabledaycolor |
비활성화된 날짜 색 |
fontcolor |
글꼴 색 |
|
saturdaycolor |
토요일 날짜 색 |
|
selectbackgroundcolor |
선택된 날짜 배경 색 |
|
selectbordercolor |
선택된 날짜 테두리 색 |
|
sundaycolor |
일요일 날짜 색 |
|
todaycolor |
오늘 날짜 색 |
inputcomp에서 설정 가능한 Key는 아래와 같습니다.
Key |
설명 |
|
clearbuttonimage |
[초기화] 버튼 이미지 경로 |
|
readybackgroundcolor |
입력 대기 배경 색 |
|
readybordercolor |
입력 대기 테두리 색 |
|
readyborderthick |
입력 대기 테두리 두께 |
|
popupbutton |
backgroundcolor |
배경 색 |
bordercolor |
테두리 색 |
|
borderthick |
테두리 두께 |
|
fontcolor |
글꼴 색 |
|
guidehighlight |
backgroundcolor |
배경 색 |
bordercolor |
테두리 색 |
|
borderthick |
테두리 두께 |
|
questiontextcolor |
질문 텍스트 글꼴 색 |
|
type |
하이라이트 타입 none, border, questiontextcolor, backgroundcolor 중 하나의 값으로 설정 |
|
itembutton |
bordercolor |
테두리 색 |
cornerradius |
둥근 테두리 반경 |
|
fontcolor |
글꼴 색 |
|
selectbackgroundcolor |
선택된 아이템 배경 색 |
|
selectbordercolor |
선택된 아이템 테두리 색 |
|
selectborderthick |
선택된 아이템 테두리 두께 |
|
unselectbackgroundcolor |
선택되지 않은 아이템 배경 색 |
|
unselectbordercolor |
선택되지 않은 아이템 테두리 색 |
|
unselectborderthick |
선택되지 않은 아이템 테두리 두께 |
inputcomp에서 설정 가능한 ComponentType과 PropertyName/PropertyValue는 아래와 같습니다.
ComponentType |
PropertyName |
설명 |
||
attachmentbutton |
documentimage |
파일 아이콘 이미지 경로 또는 색 HTML5JS 뷰어에서는 동작 안 함 |
||
cameraimage |
촬영 아이콘 이미지 경로 또는 색 HTML5JS 뷰어에서는 동작 안 함 |
|||
albumimage |
갤러리 아이콘 이미지 경로 또는 색 HTML5JS 뷰어에서는 동작 안 함 |
|||
mergeimage |
사진 합치기 아이콘 이미지 경로 또는 색 HTML5JS 뷰어에서는 동작 안 함 |
|||
fontcolor |
첨부 후 텍스트 글꼴 색 |
|||
fontsizenormal |
첨부 후 텍스트 글꼴 크기(높은 해상도) |
|||
fontsizesmall |
첨부 후 텍스트 글꼴 크기(낮은 해상도) |
|||
checkbox |
checkedmarkimage |
체크된 이미지 경로 또는 색 |
||
uncheckedmarkimage |
체크되지 않은 이미지 경로 또는 색 |
|||
datetimepicker |
disabledaycolor |
비활성화된 날짜 색 |
||
fontcolor |
글꼴 색 |
|||
icon |
달력 아이콘 이미지 경로 또는 색 |
|||
saturdaycolor |
토요일 날짜 색 |
|||
selectbackgroundcolor |
선택된 날짜 배경 색 |
|||
selectbordercolor |
선택된 날짜 테두리 색 |
|||
selectcolor |
선택된 날짜 색 |
|||
sundaycolor |
일요일 날짜 색 |
|||
todaycolor |
오늘 날짜 색 |
|||
imagepicker |
camera |
icon |
카메라 아이콘 이미지 경로 또는 색 |
|
gallerybutton |
backgroundcolor |
갤러리/앨범 버튼 배경 색 |
||
bordercolor |
갤러리/앨범 버튼 테두리 색 |
|||
borderthick |
갤러리/앨범 버튼 테두리 두께 |
|||
fontcolor |
갤러리/앨범 버튼 글꼴 색 |
|||
image |
갤러리/앨범 아이콘 이미지 경로 또는 색 |
|||
id |
icon |
신분증 아이콘 이미지 경로 또는 색 |
||
seal |
icon |
도장 아이콘 이미지 경로 또는 색 |
||
numericupdown |
buttonbackgroundcolor |
기능 버튼 배경 색 |
||
buttoncolor |
기능 버튼 테두리 색 |
|||
focusedbordercolor |
포커스된 테두리 색 |
|||
focusedborderthick |
포커스된 테두리 두께 |
|||
fonstsizenormal |
글꼴 크기(높은 해상도) |
|||
fonstsizesmall |
글꼴 크기(낮은 해상도) |
|||
fontcolor |
글꼴 색 |
|||
signpad |
backgroundcolor |
서명 영역 배경 색 |
||
bordercolor |
테두리 색 |
|||
borderthick |
테두리 두께 |
|||
icon |
서명 아이콘 이미지 경로 또는 색 |
|||
textbox |
backgroundcolor |
배경 색 |
||
bordercolor |
테두리 색 |
|||
focusedbordercolor |
포커스된 테두리 색 |
|||
focusedborderthick |
포커스된 테두리 두께 |
|||
fontcolor |
글꼴 색 |
|||
voicerecorder |
bordercolor |
테두리 색 |
||
fontcolor |
녹음 후 텍스트 글꼴 색 |
|||
fontsizenormal |
녹음 후 텍스트 글꼴 크기(높은 해상도) |
|||
fontsizesmall |
녹음 후 텍스트 글꼴 크기(낮은 해상도) |
|||
image |
clear |
초기화 아이콘 이미지 경로 또는 색 |
||
pause |
일시 정지 아이콘 이미지 경로 또는 색 |
|||
play |
재생 아이콘 이미지 경로 또는 색 |
|||
record |
녹음 시작 아이콘 이미지 경로 또는 색 |
|||
stop |
녹음 완료 아이콘 이미지 경로 또는 색 |