앱에서 테이블 레코드 또는 커넥터 출력의 대화형 목록 표시하기
  • 21 Oct 2024
  • 3 읽을 분
  • 기여자

앱에서 테이블 레코드 또는 커넥터 출력의 대화형 목록 표시하기


기사 요약

앱에서 클릭 가능한 레코드 또는 개체 목록을 표시하는 방법은 다음과 같습니다.

이 문서에서는 다음을 학습합니다.

  • 변수를 기반으로 여러 테이블 레코드를 표시하는 방법
  • 목록에서 레코드를 선택하여 앱에 로드하는 방법
  • 커넥터 출력을 대화형 목록으로 전환하는 방법
  • 작업자가 대화형 목록에서 행을 선택할 때 트리거 로직을 실행하는 방법

참고: 이 튜토리얼을 사용하려면 테이블을 만드는 방법을 이해해야 합니다. 이전에 해본 적이 없다면 별도의 가이드를 참조하세요.

작업자와 기술자에게 이러한 일반적인 작업 현장 자산을 표시해야 하나요?

  • 워크스테이션별 작업 지시 할당 목록
  • 검사해야 하는 기계
  • 시설 내 도구 및 해당 위치
  • 스테이션에 기록된 문제 및 해결 진행 상황
  • 자재 목록

그렇다면 앱 에디터에서 임베디드 테이블 위젯을 사용해야 합니다.

임베드된 테이블 위젯은 다음과 같은 데이터 소스에서 제공될 수 있습니다:

  • 여러 행의 SQL 출력
  • HTTP 커넥터의 객체 배열
  • 튤립 테이블 레코드
  • 사용자 필드

데이터 소스를 설정한 후에는 운영자에게 필터링된 목록을 표시하고 운영자가 테이블의 행을 클릭하도록 허용할 수 있습니다. 운영자가 레코드를 선택한 후 트리거 로직을 실행할 수도 있습니다.

이 가이드에서는 위의 각 사용 데이터 소스에 대한 대화형 테이블을 만드는 방법을 보여드립니다.

상황에 맞는 예시를 보고 싶으시다면 이 워크오더의 스테이션별 가시성 프로세스 가이드를 확인하세요.

임베디드 테이블 위젯 추가하기

테이블

먼저 화면 왼쪽에 레코드 플레이스홀더를 만듭니다. 이렇게 하면 목록에서 하나의 레코드를 앱으로 로드할 수 있습니다.

그런 다음 도구 모음에서 '삽입'을 선택한 다음 '튤립 표'를 선택하여 위젯을 단계에 추가합니다.

그런 다음 '데이터 소스' 드롭다운을 통해 튤립 테이블에 연결합니다:

그런 다음 내장된 테이블을 레코드 플레이스홀더에 연결하고 컨텍스트 창에서 필터 추가를 시작할 수 있습니다. 다음은 그 모습입니다:

열을 추가하려면 드롭다운 목록에서 열을 선택하여 한 번에 하나씩 추가합니다.

앱 에디터 또는 플레이어에서 각 열을 드래그하여 열의 너비를 변경하여 표의 레이아웃을 변경할 수 있습니다.

커넥터 출력

커넥터 출력에서 대화형 목록을 만드는 방법은 다음과 같습니다.

먼저, 배열을 Tulip 앱으로 전송하는 커넥터를 설정합니다. 여기에서 커넥터와 앱 간의 연결을 구성하는 방법을 알아보세요.

그런 다음 위와 같이 임베디드 테이블을 단계에 추가합니다.

그런 다음 데이터 소스로 '변수'를 선택하고 커넥터 함수에서 출력 배열을 저장하는 변수를 선택합니다.

마지막으로, "연결된 변수" 대화 상자에서 출력을 저장할 "객체" 유형의 변수를 선택하거나 변수를 생성합니다.

그런 다음 표시하려는 개체 내의 각 속성에 대한 열을 선택합니다.

트리거 로직 실행 및 스텝 디자인하기

임베디드 테이블을 설정한 후에는 두 가지 방법으로 사용할 수 있습니다:

  1. 작업자가 행을 누르면 즉시 트리거 액션을 실행합니다.
  2. 변수 또는 레코드 플레이스홀더를 업데이트하고 트리거를 실행하지 않습니다.

이 섹션에서는 앱에서 이 두 가지 상황을 설정하는 방법을 보여드리겠습니다.

트리거 로직 실행

플레이어에서 행을 누르거나 클릭할 때 실행되는 트리거를 추가하려면 컨텍스트 창에서 트리거 레이블 옆의 "+" 버튼을 클릭합니다. "언제" 절이 "행이 선택될 때"로 설정된 트리거 편집기가 열립니다.

단계 디자인하기

다음은 플레이어에서 임베드된 표를 사용하는 일반적인 방법에 대한 개요입니다:

임베디드 표는 다른 두 개의 위젯과 함께 사용됩니다:

  1. 운영자에게 레코드를 클릭하거나 누르도록 지시하는 텍스트 위젯.
  2. 표 레코드 위젯은 어떤 레코드가 선택되었는지 표시합니다.

운영자가 레코드를 선택하려면 레코드를 눌러야 하지만 올바른 레코드를 성공적으로 선택했다는 피드백을 주고 싶을 수도 있습니다.

이렇게 하려면 '표 레코드' 텍스트 위젯을 단계에 추가합니다.

그런 다음 컨텍스트 창에서 임베드된 테이블과 동일한 레코드 플레이스홀더에 연결합니다:

플레이어에서 테스트하면 레코드 플레이스홀더가 실시간으로 업데이트됩니다.

임베드된 표의 표시 변경

행 크기

기본적으로 행 크기는 노트북이나 데스크톱에서 클릭하는 데 최적화되어 있습니다. 그러나 태블릿이나 모바일 장치에서 쉽게 누를 수 있도록 각 행을 더 크게 만들고 싶을 수 있습니다.

이렇게 하려면 컨텍스트 창에서 "글꼴 크기"를 변경합니다. 그러면 글꼴 크기에 맞게 행의 높이가 자동으로 증가합니다.

각 행의 버튼

각 행 옆에 있는 버튼을 제거하려면 '버튼 선택' 옵션을 토글하여 버튼을 표시하거나 숨깁니다.

'선택 버튼'을 켜거나 끄는 것과 관계없이 행의 아무 부분이나 누르거나 클릭하여 행을 선택할 수 있습니다.

행 색인

활성화하면 레코드의 색인이 표 내에 표시됩니다.

페이지당 행 수

표에서 한 번에 사용할 수 있는 행 수를 결정합니다.

위젯에서 필터 및 정렬 설정하기

이 섹션은 튤립 테이블 및 사용자 필드에 연결된 임베디드 테이블에만 적용됩니다.

운영자에게 표시되는 레코드 목록을 필터링하고 싶을 수 있습니다. 다음을 기준으로 필터링할 수 있습니다:

  1. 앱을 실행 중인 스테이션
  2. 앱을 사용하는 운영자
  3. 앱 내 변수의 값
  4. 기타!

필터 옵션 옆의 "편집" 아이콘을 클릭하여 필터를 설정합니다.

필터 옵션에는 다음이 포함됩니다:

  1. 정적 값
  2. 변수
  3. 튤립 테이블 레코드
  4. 앱 정보

먼저 테이블에서 필터를 설정할 필드를 선택합니다. 그런 다음 조건을 선택합니다. "변수" 옵션에는 사용자 및 스테이션과 같은 앱 메타데이터와 앱과 관련된 변수가 모두 표시됩니다.

필터를 선택한 후 모달의 오른쪽 상단에 있는 "X"를 클릭합니다.

"정렬 기준" 옵션을 사용하여 임베디드 테이블에 대한 정렬을 설정할 수 있습니다.

더 읽어보기


원하는 정보를 찾았나요?

community.tulip.co로 이동하여 질문을 게시하거나 다른 사람들이 비슷한 문제를 겪었는지 확인할 수도 있습니다!


이 문서가 도움이 되었습니까?