Mesh 201 자습서 3장: WebSlate에 로컬 공유 HTML 파일 로드
이 자습서의 이전 챕터에서 WebSlate에 로컬 비공유 HTML 파일을 로드하는 단추를 사용하도록 설정했습니다. 이 챕터에서는 로드할 HTML 페이지도 설정하지만 이번에는 공유되므로 환경의 모든 참석자가 볼 수 있습니다.
단추로 이동
장면 창에서 아래 그림과 같이 스테이션 2를 볼 수 있도록 보기를 변경합니다.
이전 챕터와 마찬가지로 설명이 포함된 텍스트가 있는 GameObject가 이미 있지만 이번에는 로드 1과 로드 2라는 두 개의 단추가 있습니다. WebSlate도 이미 있습니다. 단추 중 하나에 연결된 스크립트 그래프를 업데이트하여 스테이션을 완료합니다. 참석자가 두 단추 중 하나를 클릭하면 웹 페이지가 로드되고 환경의 다른 모든 참석자가 새 페이지를 볼 때 공유할 수 있습니다. 이 스테이션의 각 단추는 약간 다른 유형의 콘텐츠를 로드합니다.
계층 구조에서 1 - LocalWebslate라는 GameObject를 축소합니다.
확장 2 - StaticContentWebslate. WebSlateFramed 개체가 미리 로드되었으며 여기에 있습니다.
ChapterLabel 및 해당 자식 개체 Actions를 확장합니다. LoadButton1 및 LoadButton2로 작업할 단추는 여기에 있습니다.
스크립트 그래프 편집
계층 구조에서 LoadButton1을 선택합니다. 검사기에서 LoadButton1에는 LoadButtonSharedStart라는 스크립트가 연결된 스크립트 컴퓨터 구성 요소가 있습니다. 또한 스크립트 그래프에 사용되는 여러 개체 변수가 연결되어 있습니다.
LoadButton1을 선택하면 스크립트 컴퓨터 구성 요소의 스크립트가 스크립트 그래프 창에 자동으로 로드됩니다. 이전 챕터와 마찬가지로 스크립트 그래프가 이미 시작되었습니다.
메시 상호 작용 가능한 본문 추가: 노드 선택됨
첫 번째 작업은 메시 상호 작용 가능한 본문을 추가하는 것입니다. 선택된 노드입니다. 이전 챕터에서 설명한 대로 두 개의 "메시 상호 작용 가능한 본문" 노드 중에서 선택할 수 있습니다. 로컬로 선택되었거나 선택되어 있습니다. 각 노드 위의 텍스트는 동작을 확인하는 데 도움이 될 수 있습니다.
스테이션 1의 경우 이벤트를 트리거하는 사람만 이 이벤트를 경험하기를 원했기 때문에 스크립트에 "로컬로 선택됨"이라는 노드가 포함되었습니다. 이번에는 모든 참석자가 이벤트를 경험하게 되므로 다른 노드(단순히 "선택됨"이라고 표시됨)를 선택합니다.
게임 개체 노드의 데이터 출력 포트를 클릭한 다음 오른쪽으로 끌어옵니다. 그러면 유사 항목 찾기가 열립니다. 경고: 유사 항목 찾기를 열면 Unity 인터페이스 외부의 아무 곳이나 클릭하지 마세요. 이렇게 하면 유사 항목 찾기가 닫히고 스크립트 그래프에서 예측할 수 없는 동작이 발생합니다.
유사 항목 찾기에서 "메시 상호 작용 가능한 본문: 선택됨"을 검색한 다음 선택합니다.
그러면 그래프에 노드가 추가됩니다.
메시 상호 작용 가능한 본문의 데이터 출력 포트에서 커넥터를 끌어온 다음 선택한 노드인 경우 Microsoft Mesh: On State Changed 노드의 데이터 입력 포트에 연결합니다.
웹 슬레이트 추가: HTML 콘텐츠 로드(HTML 자산) 노드
스크립트 그래프에는 필요한 두 개의 개체 변수 노드가 이미 포함되어 있으므로 앞으로 이동하여 필요한 최종 노드를 추가할 수 있습니다.
If 노드의 제어 출력 포트에서 커넥터를 끌어서 새 웹 슬레이트: HTML 자산(HTML 자산) 노드 로드를 만듭니다. 이전 챕터에서 설명한 것처럼 이름이 매우 유사한 두 개의 노드가 있다는 것을 명심하세요.
"HTML 콘텐츠"가 아니라 "HTML 자산"이라는 것을 원합니다.
값이 "WebSlate"인 개체 변수 가져오기 노드의 데이터 출력 포트에서 커넥터를 끌어서 웹 슬레이트의 첫 번째 데이터 입력 포트인 HTML 콘텐츠 노드 로드에 연결합니다.
로드하려는 웹 페이지는 다른 개체 변수 가져오기 노드에 있습니다. 해당 노드의 데이터 출력 포트에서 커넥터를 끌어 웹 슬레이트의 두 번째 데이터 입력 포트인 HTML 콘텐츠 노드 로드에 연결합니다.
작업 테스트
Unity에서 프로젝트를 저장한 다음 Unity 편집기 재생 단추를 누릅니다.
역 2 앞에 자신을 배치합니다. 이전 장과 마찬가지로 WebSlate 구성 요소의 기본 URL 이 Microsoft 홈페이지로 설정되었기 때문에 WebSlate 에 Microsoft에 대한 일부 정보가 표시됩니다.
로드 1 단추를 클릭합니다. WebSlate는 "전 세계 풍력 에너지"라는 제목의 페이지를 로드하고 표시합니다. WebSlate는 대화형입니다. 스크롤 막대 위와 아래의 화살표를 클릭하거나 스크롤 막대의 빈 공간을 클릭하여 슬라이더를 이동하고 페이지 보기를 변경할 수 있습니다. (슬라이더 자체를 끌 수 없습니다.)
로드 2 단추를 클릭하고 이미지가 WebSlate에 로드됩니다.
이는 로드 2 단추에 대한 전체 스크립트가 이미 설정되어 있고 로드 1 단추에 대한 스크립트와 정확히 동일한 노드 구조를 가지고 있기 때문에 작동합니다. 유일한 차이점은 각 스크립트에 대한 변수입니다. 로드 1 단추의 경우 HTMLAsset 변수의 값은 HTML 파일 "windenergyfacts"입니다.
로드 2 단추의 경우 HTMLAsset 변수의 값은 HTML 파일 "meshimage"입니다.
meshimage.html 파일이 궁금하다면 파일을 열고 살펴보세요. 프로젝트의 Assets>MeshWebSlates>HTMLFiles 폴더에 있습니다.
파일의 유일한 콘텐츠는 로드 2 단추를 클릭할 때 본 이미지에 대한 링크입니다.