예: ThingWorx Navigate의 사용자 지정 작업 생성
작업의 구성 요소
사용자의 작업은 여러 가지 기본적인 부분으로 구성되어 있습니다.
• 매쉬업 - 작업의 사용자 인터페이스.
• 서비스 - 작업을 실행하는 Java 또는 Java 스크립트. 서비스는 WindchillSwaggerConnector에 있습니다.
• ptc-windchill-demo-thing - 데이터의 소스입니다.
예제: 새 작업 만들기
아래 단원에서는 ThingWorx Composer에서 사용자 지정 작업을 만드는 과정을 처음부터 끝까지 소개합니다. 이 예제 작업을 통해 사용자는 Windchill 데이터를 검색하고 검색 결과를 테이블로 얻게 됩니다. 테이블에서 항목을 선택하면 아래 테이블에 추가 속성이 표시되며 항목의 대화식 3D 표현을 볼 수 있습니다. 링크를 클릭하면 Creo View에서 이 표현을 열 수 있습니다. 아래는 모든 과정이 완료될 때 볼 수 있는 화면입니다.
이 예제에서 작업의 구성 요소들을 작업 매쉬업에 통합하는 방법을 보여줍니다. 사용자의 조직에 필요한 많은 서비스가 WindchillSwaggerConnector에 이미 포함되어 있습니다.
따라서,
ThingWorx 사용자 인터페이스와 이 기본 제공 서비스만을 사용하여 수많은 사용자 지정 작업을 구성할 수 있습니다. 자신만의 서비스를 작성할 필요가 있는 경우, 몇 가지 흔히 사용되는 서비스에 대한 단계를 마련하였기 때문에 유용하게 사용할 수 있습니다. PTC
참조 문서 사이트에서
PTC Windchill Extension 안내서를 확인하십시오.
하지만 먼저 예제 작업을 만들어 보도록 하겠습니다.
작업 구상
시작하기 전에 작업의 기능과 레이아웃을 미리 구상하는 것이 도움이 됩니다. 이 과정은 필요한 서비스가 무엇이며, 각 서비스에 필요한 패널은 어떤 것이고, 어떤 레이아웃을 사용할지 파악할 수 있도록 해줍니다. 계획을 세웠으면 커넥터에 필요한 서비스를 어셈블하는 작업을 시작할 수 있습니다. 다음 단원으로 진행하여 단계를 수행합니다.
ThingWorx Composer에서 새 매쉬업 생성
새 매쉬업을 생성하려면 다음 단계를 따르십시오.
1. 시각화 아래에서 매쉬업을 클릭한 다음 새로 만들기 단추를 클릭합니다. 새 매쉬업 대화 상자가 열립니다.
2. 매쉬업 유형 아래에서 페이지를 선택합니다.
3. 레이아웃 옵션 아래에서 반응형을 선택한 다음 완료를 클릭합니다. 매쉬업 편집기가 열립니다.
4. 위젯 탭에서 패널을 선택한 다음 패널을 레이아웃 미리 보기 영역으로 끌어 놓습니다. 추가 패널 위젯을 끌어 놓은 다음 미리 구상했던 레이아웃이 될 때까지 위젯의 크기를 조정합니다. 이 예제에서는 위 그림의 레이아웃을 사용합니다.
패널에 위젯 추가
이제 작업의 기본 프레임워크가 준비되었습니다. 다음으로 각 패널에 대한 시각적 컴포넌트를 정의할 위젯을 추가하겠습니다.
1. 위젯을 각 패널로 끌어 놓습니다. 이 예제에서는 다음 위젯을 추가할 것입니다.
◦ 목록 - Windchill에서 저장한 검색의 목록을 표시합니다. 목록에서 항목을 선택하면 항목의 세부 정보가 그리드 패널에 표시됩니다.
◦ 텍스트 상자 - 사용자들에게 다른 검색을 수행할 수 있는 기능을 제공합니다.
◦ 버튼 - 검색을 실행합니다.
◦ 그리드 - 사용자가 선택한 항목에 대한 세부 정보를 표시합니다.
◦ 속성 표시 - 그리드 패널에 선택한 항목의 속성을 표시합니다.
◦ Creo View - 선택한 항목의 3D 보기를 표시합니다.
◦ 링크 - 선택한 항목을 Creo View 클라이언트 응용 프로그램에서 엽니다.
데이터 소스와 서비스 추가
이제 위젯이 갖춰졌기 때문에 사용자 인터페이스가 작성되었습니다. 정보 소스를 제공할 차례입니다. 이 예제 작업은 기본 제공 데이터 소스인 ptc-windchill-demo-thing을 사용합니다. 다음 단계에서는 매쉬업이 작동하는 데 필요한 데이터 소스와 서비스를 추가할 것입니다.
1. ThingWorx의 오른쪽 상단에 있는 데이터 탭에서 플러스 기호를 클릭하여 새 데이터 소스를 추가합니다. 데이터 추가 대화 상자가 열립니다.
2. 엔티티 검색 상자에 필요한 데이터 소스를 입력하기 시작합니다. 이 예제에서는 ptc-windchill을 입력하겠습니다.
3. 검색 결과에서 데이터 소스를 선택합니다. 이 예제에서는 ptc-windchill-demo-thing입니다. 이 엔티티에 대해 사용할 수 있는 서비스가 왼쪽에 표시됩니다.
4. 파란색 화살표 버튼을 클릭하여 필요한 서비스를 추가합니다. 이 예제 매쉬업에서는 다음 서비스를 선택하도록 하겠습니다.
◦ GetCreoViewData
◦ ExecuteSavedSearch
◦ ListSavedSearches
이 예제에서는 매쉬업이 로드되는 즉시 Windchill에서 저장된 검색을 표시하고자 합니다. 이를 수행하려면 ListSavedSearches에서 매쉬업 로드? 확인란을 선택합니다.
5. 필요한 모든 서비스를 선택하고 나면 완료를 클릭합니다.
위젯에 서비스 연결
사용자 인터페이스 요소와 함께 데이터 서비스가 갖춰졌습니다. 다음 단계에서는 모든 것을 연결해 보겠습니다.
1. 데이터 패널에서 ListSavedSearches 아래에 있는 반환된 데이터 섹션을 확장합니다.
2. 모든 데이터를 목록 위젯으로 끌어 놓습니다. 그러면 저장된 검색에서 찾은 모든 데이터가 반환됩니다.
3. 바인딩 대상에서 데이터를 클릭합니다. 연결 다이어그램이 Composer의 하단에 표시됩니다.
| 이 단계는 이전 버전의 ThingWorx에서 필요했던 수동 클라이언트측 Java 스크립팅을 대체합니다. |
4. 이제 위젯을 구성할 수 있습니다. 목록 위젯에서 다음 매개 변수를 설정합니다.
◦ DisplayField - name
◦ ValueField - objectid
◦ Label—저장된 검색
| 텍스트 상자의 바깥쪽을 클릭하여 각 엔티티를 저장합니다 |
서비스 간 데이터 바인딩
일부 서비스는 다른 서비스의 데이터에 의존합니다. 예를 들어, 목록에서 저장된 검색을 선택할 때 검색이 실행되기를 원할 수 있습니다. 다음 단계에서는 바인딩이라고 불리는 서비스 간 연결을 작성해 보겠습니다. 또한, ExecuteSavedSearch를 검색 상자에 키워드를 입력하는 작업에 연결하는 것과 같이 서비스를 위젯에 바인딩해볼 것입니다.
1. ExecuteSavedSearch에서 매개 변수를 확장합니다.
2. ListSavedSearches 아래에서 반환된 데이터를 확장한 다음 선택한 행을 확장합니다.
3. 선택한 행 아래에서 objectId를 ExecuteSavedSearch의 매개 변수 섹션에 있는 oid로 끌어 놓습니다.
첫 번째 연결이 완료되었습니다.
4. 두 번째 연결을 위해 ListSavedSearches를 클릭합니다.
5. 그런 다음, 패널 하단에서 SelectedRowsChanged를 ExecuteSavedSearch로 끌어 놓습니다.
이제 검색 기능을 연결해 보겠습니다. 텍스트 상자의 입력 내용이 입력 매개 변수 keyword에 연결되며, 버튼이 서비스에 연결되어 데이터를 가져옵니다.
1. ExecuteSavedSearch를 확장한 다음 매개 변수를 확장합니다.
2. 텍스트 상자 위젯을 선택한 다음 화살표를 클릭하여 목록을 엽니다. Text를 ExecuteSavedSearch 아래의 keyword로 끌어 놓습니다.
3. 다시 텍스트 상자 패널에서 버튼 위젯을 선택하고 드롭다운 메뉴에서 Clicked를 ExecuteSavedSearch로 끌어 놓습니다.
4. 검색 상자와 버튼에 레이블을 추가해 보도록 하겠습니다. 각 요소를 선택한 다음 메뉴에서 레이블을 선택합니다. 다음과 같이 각 엔티티에 대한 이름을 입력합니다.
◦ Text box - Items to find
◦ Button - Find
5. 변경 사항을 저장합니다.
연결 확인
현 시점에서 완료되어 있어야 하는 연결은 다음과 같습니다. 아래의 각 엔티티를 선택하여 연결을 확인합니다.
List widget
ExecuteSavedSearch
ListSavedSearches
부품 구조를 테이블로 표시
부품 구조를 테이블 위젯에 표시하기 위해 부품 구조 데이터를 그리드 위젯에 연결해 보겠습니다. 이 단계에서 이전과는 반대 방향, 즉 서비스에서 위젯으로 끌어 놓는다는 점을 참고하십시오.
1. ExecuteSavedSearch 아래에서 반환된 데이터를 확장한 다음 모든 데이터를 그리드 위젯으로 끌어 놓습니다.
2. 바인딩 대상 선택 아래에서 데이터를 선택합니다.
3. 이제 데이터가 그리드에 연결되었기 때문에 테이블을 설정해 보겠습니다. 그리드 위젯을 선택한 다음 메뉴에서 그리드 열 구성을 선택합니다.
4. 위젯 구성 아래에서 표시할 속성을 선택하고 순서를 바꿉니다.
5. 변경 사항을 저장합니다.
항목이 선택될 때 보기 가능 항목 표시
그리드에서 항목이 선택되면 항목의 보기 가능 항목이 표시되도록 해보겠습니다. 이 동작을 설정하려면 구조 데이터를 Creo View 위젯에 연결한 다음 사용자가 다른 항목을 선택할 때 동적으로 업데이트되도록 위젯을 설정할 수 있습니다.
1. GetCreoViewData 서비스 아래의 반환된 데이터 아래에서 모든 데이터를 확장한 다음 structure를 선택합니다. Creo View 위젯으로 끌어 놓습니다.
2. 바인딩 대상 선택 아래에서 ProductToView를 선택합니다.
3. 동적 업데이트를 구성하려면 ExecuteSavedSearch를 선택합니다. 그런 다음, 왼쪽 창에서 SelectedRowsChanged를 GetCreoViewData 서비스로 끌어 놓습니다.
4. 저장을 클릭합니다.
Creo View에서 항목을 여는 링크 추가
사용자가 3D 보기 가능 항목 파일을 신속하게 열 수 있도록 하기 위해 Creo View에서 파일을 여는 링크를 추가하겠습니다. 이 서비스를 사용하려면 사용자가 Creo View를 설치해야 하거나, Windchill을 통해 Creo View Lite에 액세스할 수 있어야 합니다.
1. GetCreoViewData 아래에서 반환된 데이터 및 모든 데이터를 확장합니다.
2. launchCreoViewUrl을 선택한 다음 링크 위젯으로 끌어 놓습니다.
3. 바인딩 대상 선택 아래에서 SourceURL을 선택합니다.
4. 또한, 항목의 Windchill 객체 ID를 서비스에 연결해야 합니다. GetCreoViewData 아래에서 매개 변수를 확장합니다.
5. 그런 다음, ExecuteSavedSearch 아래에서 반환된 데이터를 확장한 후 선택한 행을 확장합니다.
6. objectId를 선택하고 GetCreoViewData 아래의 oid 매개 변수로 끌어 놓습니다.
7. 마지막으로 링크의 이름을 지정할 것입니다. 링크 위젯을 선택한 다음 텍스트를 선택합니다. View item in Creo View와 같이 링크에 대한 텍스트를 입력합니다.
8. 저장을 클릭합니다.
테이블에서 선택될 때 항목의 속성 표시
검색 결과 테이블에는 항목의 속성 일부가 표시됩니다. 속성의 추가 상세 목록을 추가하기 위해 속성 표시 위젯을 연결한 다음 표시할 속성을 선택해 보겠습니다.
1. ExecuteSavedSearch 아래에서 반환된 데이터를 확장한 다음 선택한 행을 선택합니다.
2. 서비스에서 선택한 행을 속성 표시 위젯으로 끌어 놓습니다.
3. 바인딩 대상 선택 아래에서 데이터를 선택합니다.
4. 이제 표시 위젯이 데이터에 연결되었으므로 표시할 속성을 선택할 수 있습니다. 위젯을 선택한 다음 왼쪽 상단 모서리에 있는 화살표를 클릭합니다.
5. 메뉴에서 위젯 구성을 선택합니다.
6. 위젯 구성 아래에서 표시할 속성을 선택하고 순서를 바꿉니다.
연결 다시 확인
현 시점에서 완료되어 있어야 하는 연결은 다음과 같습니다. 아래의 각 엔티티를 선택하여 연결을 확인합니다.
GetCreoViewData
ExecuteSavedSearch
ListSavedSearch
매쉬업을 저장하고 이름을 지정한 다음 새 작업에서 보기
거의 다 끝났습니다. 마지막 단계에서는 매쉬업의 이름을 지정하고 저장한 다음 사용자 지정 ThingWorx Navigate 작업을 확인할 것입니다.
1. 저장을 클릭합니다.
2. 일반 정보 아래에서 이름 상자에 작업의 이름을 입력합니다.
3. 매쉬업 보기를 클릭합니다. 새 작업이 열립니다. 축하합니다!
이제 ThingWorx Navigate 홈페이지에 사용자의 작업을 추가하고 수정을 추가할 수 있습니다. 다음 도움말 항목인 "홈 페이지에 사용자 지정 작업 추가"를 참조하십시오.
정보가 더 필요하신가요? 다음은 몇 가지 리소스입니다.
