Button
Button(버튼) 위젯은 사용자가 누르면 지정한 동작을 실행하는 클릭 가능한 버튼입니다.
확인·취소·이동 등 화면의 모든 액션 트리거에 사용합니다.
정보
예제 파일: 07_Work_with_Widgets/button_objet.lfp
정의 / 역할
Button 위젯은 텍스트(및 선택적 아이콘)를 담은 누를 수 있는 영역을 그려줍니다. 누르면 onClick에 연결한 동작이 실행됩니다. 배경색·테두리·모서리·크기·아이콘 위치를 설정할 수 있습니다.
- 카테고리: Contents (입력·선택)
- 기본 표시 문구:
Button - 기본 사이즈: 너비
100·높이50 - 기본 배경색:
#009DFF
기능
| 기능 | 설명 |
|---|---|
| 클릭 동작 | 버튼을 누르면 onClick에 연결한 동작(로직·스크립트)이 실행됩니다. |
| 텍스트·배경 | 표시 문구와 배경색을 설정합니다. 텍스트는 데이터 바인딩을 지원합니다. |
| 아이콘 표시 | 글자와 함께 아이콘을 배치하고 위치(위·왼쪽·오른쪽·아래)를 지정합니다. |
| 모양 설정 | 크기·정렬·여백·테두리·모서리 둥글기를 조정합니다. |
사용 방법
- 왼쪽 위젯 팔레트에서 Contents 카테고리를 엽니다.
- Button 항목을 캔버스로 끌어다 놓습니다.
- 오른쪽 속성 패널에서
text값을 원하는 문구로 수정합니다. onClick에 클릭했을 때 실행할 동작(로직·스크립트)을 연결합니다.- 필요하면 배경색(
fillColor)·아이콘·크기 등을 조정합니다.
속성 (Property)
노트
글자 색·크기 등 세부 글자 스타일은 공통 Style(스타일) 설정에서 지정합니다. 아래는 Button 고유 속성입니다.
| 속성 | 설명 | 기본값 | 값 / 타입 |
|---|---|---|---|
Size | 버튼 크기 - 너비(width)·높이(height)를 함께 지정하는 묶음 속성 | 너비 100·높이 50 | 크기(너비·높이, 숫자 px) |
alignment | 버튼 안 내용 정렬 | 가운데 | 정렬 값 |
padding | 버튼 안쪽 여백 | 0 | 여백 값 |
border | 테두리 | 흰색 1px | 테두리 값 |
radius | 모서리 둥글기 | 미지정 | 반경 값 |
fillColor | 버튼 배경색 | #009DFF (파랑) | 색상 |
text | 버튼에 표시할 문자열 (데이터 바인딩 지원) | Button | 문자열 |
textStyle | 글자 스타일 (색·크기·굵기 등) | 미지정 | 텍스트 스타일 |
iconPadding | 아이콘 여백 | 0 | 여백 값 |
iconDirection | 글자 기준 아이콘 위치 | left | top, left, right, bottom |
icon | 버튼에 넣을 아이콘 (선택) | 없음 | 아이콘 설정 |
주의 / 팁
노트
버튼이 실제로 반응하려면 onClick에 실행할 동작을 연결해야 합니다. 연결된 동작이 없다면 버튼이 클릭 되어도 작동하지 않습니다.
팁
글자 색·크기는 textStyle(공통 Style)에서 설정합니다. 아이콘을 켜면 iconDirection으로 글자 대비 위치를 바꿀 수 있습니다.
더 알아보기
팁
이 위젯을 스크립트로 제어하는 Widget Control(Property·Method·Event) 전체는 Button (버튼) Widget Control 문서에서 확인하세요.