위젯은 앱의 기본 구성 요소입니다. 위젯은 사용자에게 정보를 표시하고, 사용자로부터 데이터를 수집하고, 트리거 로직을 실행하는 데 사용됩니다.

앱 내에서 수십 개의 위젯을 결합하여 앱 단계를 구성하여 프로세스를 간소화하는 앱 인터페이스를 구축할 수 있습니다.

위젯 유형

버튼 위젯

텍스트를 표시하고 작업을 트리거할 수 있는 버튼입니다. 버튼 위젯은 사용자가 완전히 구성할 수 있는 빈 위젯입니다. 다음/이전/메뉴/완료 위젯에는 앱 구축을 간소화하기 위한 기본 트리거가 포함되어 있습니다.

버튼 - 모든 로직을 트리거할 수 있는 완전히 구성 가능한 버튼이전 - 사용자가 마지막으로 있었던 단계로 이동합니다. 메뉴 - 사용자가 앱을 변경하고, 앱 언어를 변경하고, 로그아웃할 수 있는 메뉴를 엽니다다음 - 다음 앱 단계로 진행합니다**.완료** - 앱 변수 값을 저장하는 앱 완료를 실행하고 앱 스플래시 화면으로 돌아갑니다.

버튼 위젯에 대한 자세한 내용은 여기를 참조하세요.

입력 위젯

입력 위젯으로 사용자로부터 데이터를 수집하세요. 각 입력 위젯은 서로 다른 유형의 변수를 지원합니다.

여기에서 입력 위젯에 대해 자세히 알아보세요.

텍스트 위젯

변수 값, 일반 정적 텍스트, 전체 레코드 플레이스홀더를 포함한 정적 또는 동적 텍스트를 표시합니다.

임베디드 위젯

임베디드 위젯으로 동영상, CAD, 문서 등을 애플리케이션에 임베드하세요.

여기에서 임베디드 위젯에 대해 자세히 알아보세요.

카메라 위젯

카메라 위젯으로 Tulip Vision 카메라 피드를 표시하거나 디바이스 카메라로 바코드를 스캔하세요.

여기에서 Tulip Vision에 대해 자세히 읽어보세요.

사용자 지정 위젯

기본 위젯이 필요에 완벽하게 맞지 않는다면 거의 모든 사용 사례를 충족하는 사용자 지정 위젯을 만들 수 있습니다. HMTL, JavaScript, CSS를 결합하여 플랫폼을 광범위하게 확장할 수 있습니다.

여기에서 사용자 지정 위젯에 대해 자세히 알아보세요.

아이콘

애플리케이션 내에서 벡터 이미지를 드래그 앤 드롭하고 크기를 조정하여 Tulip 앱을 브랜드에 맞게 조정할 수 있습니다.

위젯 구성

원하는 형태와 기능에 가장 적합하도록 위젯을 구성할 수 있습니다.

위젯마다 서로 다른 구성 옵션을 지원합니다. 위젯 데이터 소스 - 예: 버튼에 표시할 텍스트, 표의 어떤 열을 표시할지 등 위젯의 다양한 속성에 영향을 줄 수 있습니다. - 예: 입력 값을 어디에 저장할 것인가, 어떤 표를 표시할 것인가?- 스타일링 - 예: 버튼의 색상을 어떤 색으로 할 것인가, 텍스트 위젯을 굵게 또는 이탤릭체로 설정할 것인가?- 트리거 - 예: 사용자가 [Enter]를 클릭하면 어떻게 될 것인가, 사용자가 행을 선택하면 어떻게 될 것인가?- 트리거 - 예: 사용자가 행을 선택할 때 어떤 일이 일어날 것인가?

위젯을 편집하려면 위젯을 선택해야 합니다. 1. 구성하려는 위젯을 선택합니다.2. 컨텍스트 창에 위젯 탭이 열립니다.

위젯 데이터 소스

위젯에 표시되는 콘텐츠는 위젯마다 다르지만 매핑하는 프로세스는 다르지 않습니다. 데이터 소스 설정은 위젯 콘텐츠의 소스를 정의합니다. 위젯을 처음 추가하면 해당 데이터 소스는 매핑되지 않습니다.

데이터 소스 유형은 위젯이 매핑되는 광범위한 소스 유형입니다. 예를 들어 변수, 테이블 레코드 필드, 머신 속성 등이 있습니다.

데이터소스는 위젯이 매핑되는 해당 유형 내의 특정 속성입니다.

데이터 매핑

입력 위젯의 경우 데이터 소스는 사용자 입력이 저장되는 위치를 나타냅니다. 다른 모든 위젯의 경우 데이터소스는 위젯이 표시하는 데이터의 소스를 나타냅니다.

많은 위젯이 데이터에 연결되어 있습니다. 위젯 콘텐츠는 테이블 레코드나 변수와 같은 동적 데이터에 의해 구동될 수 있습니다. 입력 위젯은 변수나 테이블 레코드 필드에 데이터를 채우는 데에도 사용할 수 있습니다.

입력 위젯은 데이터 소스와 함께 읽기/쓰기가 가능하며, 입력을 변경하면 데이터 소스의 값이 변경됩니다. 대부분의 위젯은 읽기 전용으로, 동적 데이터에 의해 구동될 수 있지만 데이터 소스 값에 직접적인 영향을 줄 수는 없습니다.

데이터 기반 위젯

일부 위젯은 동적 데이터로 채울 수 있습니다. 대부분의 동적 위젯에서 데이터 소스 설정은 위젯 상태를 구동하는 데이터를 나타냅니다.

Color모든색상 속성은 정적으로 설정하거나 변수를 기반으로 동적으로 설정할 수 있습니다.

변수변수위젯의 콘텐츠는 색상을 포함한 모든 앱 변수의 값에 연결할 수 있습니다. 이 위젯은 소스 변수가 변경되면 동적으로 변경됩니다.

테이블레코드테이블 레코드 위젯은 전체 레코드 또는 개별 테이블 레코드 필드의 현재 값을 반영합니다.

대화형테이블대화형테이블 위젯은 테이블의 현재 상태를 표시합니다.

스타일링

위젯이 Tulip에 업로드된 후 화면 오른쪽의 컨텍스트 창에서 다음과 같은 위젯 속성을 편집할 수 있습니다. 스타일 지정 옵션은 위젯에 따라 다르지만 대부분의 위젯에는 아래 나열된 옵션이 있습니다:

• 글꼴 크기
• 글꼴 색상
• 글꼴 스타일
• 버튼 텍스트 정렬
• 버튼 색상
• 크기
• 회전
• 그림자
• 테두리 반경
• 깜박임

위젯 트리거

위젯마다 트리거 로직을 결정하는 특정 동작이 있습니다.

입력 위젯모든입력 위젯의 경우입력이 변경되면 해당 위젯의 트리거가 실행됩니다.:::(Info) (NOTE)
In the case of Number and Text input widgets, Triggers will fire on users clicking [Enter]
:::
인터랙티브 테이블사용자가행을 선택하면해당 트리거가 실행됩니다. 또한 해당 행은 연결된 레코드 위젯 설정에 설정된 테이블 레코드 플레이스홀더에 로드됩니다. 대화형 표 위젯에 대해 자세히 알아보려면 여기를 참조하세요.

더 읽어보기

• 입력 위젯
• 임베디드 위젯
• 버튼 위젯