Dela via


Självstudiekurs om Mesh 201 Kapitel 2: Läs in en lokal html-fil som inte delas till en WebSlate

Nu när du har konfigurerat och har haft möjlighet att prova projektet går vi vidare till skriptning av webbinnehåll i WebSlates! En WebSlate är i princip en stor interaktiv skärm. Du kan använda den för att visa instrumentpaneler, webbsidor, foton och videor eller interagera med kartor, diagram och data. På station 1 läser vi in en lokal html-fil som inte delas till en WebSlate.

Lägg till WebSlate i scenen

  1. Öppna startpunktsscenen.

  2. I fönstret Scen ser du till att du är placerad så att du är framför och tittar på Station 1, på bilden nedan.

    En skärmbild av en datorbeskrivning

    Stationen har redan ett objekt på plats som har en del beskrivande text och knappen Läs in . Vi slutför stationen genom att lägga till en WebSlate under knappen och sedan uppdatera ett skriptdiagram som är kopplat till knappen Läs in så att när användaren klickar på knappen läses en html-fil som inte delas in i WebSlate.

    Alla WebSlates som vi ska lägga till och/eller arbeta med finns i hierarkin för MeshWebSlates GameObject.

    En skärmbild av en datorbeskrivning

  3. I hierarkin döljer du objektet staticSceneObjects om det behövs.

  4. Expandera MeshWebSlates och expandera sedan dess underordnade objekt med namnet 1 – LocalWebslate.

    En skärmbild av en datorbeskrivning

  5. Sök efter prefab för WebSlateFramed i projektfönstret. Se till att du väljer Alla eller I paket för sökfiltret.

    En skärmbild av en datorbeskrivning

  6. Dra WebSlateFramed från projektfönstret och släpp det sedan i hierarkin i utrymmet mellan 2 – LocalWebslate och ChapterLabel så att det är det första underordnade objektet 2 – LocalWebSlate.

    En skärmbild av en datorbeskrivning

    Vår WebSlate är nu i scenen, men den har inte den storlek eller position vi vill ha.

    En skärmbild av en datorbeskrivning

    Vi ändrar på det.

  7. I hierarkin kontrollerar du att WebSlateFramed är markerat och uppdaterar sedan skalningsvärdena i transformeringskomponenten i Inspector till följande:

    Skala: X = 2,5, Y = 1,5, Z = 1

    Det här är mycket bättre!

    En skärmbild av en datorbeskrivning

Ändra URL:en för WebSlate

  1. Expandera prefab webSlateFramed i hierarkin.

  2. Välj det underordnade objektet för WebSlateFramed med namnet WebSlate.

  3. I Inspector navigerar du till WebSlate-komponenten och noterar att egenskapen Aktuell URL (standard-URL:en för WebSlate) är inställd på startsidan för hela Microsoft.

    En skärmbild av en datorbeskrivning

    Nu ska vi ändra URL:en så att den pekar på startsidan för Microsoft Mesh.

  4. Lägg till "mesh" i slutet av URL:en i textrutan Aktuell URL .

    En skärmbild av en datorbeskrivning

Öppna knappskriptet

  1. I hierarkin expanderar du ChapterLabel, expanderar sedan Åtgärder och väljer sedan LoadButton.

    En skärmbild av en datorbeskrivning

    I Inspector kan du se loadbutton med namnet "Load HTML". Komponenten har egenskapen Source inställd på Graph och ansluter till en skripttillgångsfil med namnet "LoadButtonLocalStart". LoadButton GameObject har också variabler som vi ska använda i skriptet.

    En skärmbild av en datorbeskrivning

    Dricks

    Egenskapen Källa för skriptet har två alternativ: Graph och Embed. Var och en har fördelar och nackdelar; Du kan lära dig mer om dem i artikeln Unity Script Machine. Vi använder graph-alternativet här eftersom den här typen av "källa" har större flexibilitet när du ansluter till Mesh Cloud Scripting.

  2. I komponenten Skriptdator klickar du på knappen Redigera diagram .

  3. Parkera fönstret Skriptdiagram bredvid flikarna Projekt och Konsol . Klicka på fliken för att se innehållet.

    En skärmbild av en datorbeskrivning

Tips: Om du vill ha mer utrymme i fönstret Skriptdiagram kan du klicka på dess trepunktsknapp och sedan välja Maximera eller klicka på knappen Helskärm i det övre högra hörnet i fönstret.

Viktigt: Observera att den andra noden i skriptet heter Mesh Interactable Body: Is Selected Locally (Interaktionsbar mesh-brödtext): Väljs lokalt. Det finns två tillgängliga "Mesh Interactable Body"-noder. Med dessa noder kan du använda Mesh-interaktionsbara objekt med visualiseringsskript, till exempel med interaktionshändelser eller för att ändra den manipulerbara måltransformeringen via det visuella skriptet. Om du bara vill att den person som utlöser en händelse ska uppleva den använder du noden som säger "Är vald lokalt". Om du vill att alla deltagare i evenemanget ska uppleva det väljer du noden som helt enkelt säger "Är vald". Se skillnaderna i bilden nedan. Texten ovanför varje nod kan hjälpa dig att bekräfta beteendet.

En skärmbild av en datorbeskrivning .

I vårt aktuella skript använder vi noden med "Väljs lokalt". Det innebär att när deltagaren klickar på knappen Läs in visas bara den nya HTML-sidan som läses in i den anslutna WebSlate.

Skapa en WebSlate-objektvariabel

Skriptdiagrammet har redan startats åt dig. Vi slutför de uppgifter som behövs för att aktivera knappen Läs in på Station 1 för att läsa in HTML-sidan.

Det första vi behöver göra är att skapa en objektvariabel som har värdet för WebSlate GameObject som är underordnad WebSlateFramed GameObject.

  1. I fältet Nytt variabelnamn skriver du in namnet "WebSlate" och trycker sedan på Retur.

____________.

  1. Klicka på listrutan Typ och sök sedan och välj "WebSlate".

____________.

  1. Dra WebSlate GameObject från hierarkin och släpp den sedan i fältet Värde för den nya variabeln.

____________.

Hämta HTML-sidan

  1. Klicka på kontrollutdataporten för noden If och dra sedan till höger. Då öppnas Fuzzy Finder. VARNING! När du har öppnat Fuzzy Finder klickar du inte någonstans utanför Unity-gränssnittet. Detta stänger Fuzzy Finder och orsakar oförutsägbart beteende i skriptdiagrammet.

  2. I Fuzzy Finder söker du efter "Web Slate: Load HTML Content (Html Asset)" (Webbskiffer: Läs in HTML-innehåll (Html-tillgång)" och väljer det sedan. Observera att det finns två noder med mycket liknande namn.

    En skärmbild av en datorbeskrivning

    Du vill ha den som säger HTML-tillgång, inte HTML-innehåll.

    __________________

  3. Dra den nyligen skapade WebSlate-objektvariabeln och placera sedan den nod som genereras ovan och till vänster om noden Läs in HTML-innehåll .

  4. Anslut datautdataporten för noden Hämta objektvariabel till den första dataindataporten för noden Läs in HTML-innehåll .

    ____________

  5. Vi har redan den webbsida som vi vill läsa in i en Get Variable-nod i skriptdiagrammet. Dra en anslutningsapp från datautdataporten för noden Hämta variabel och anslut den sedan till dataindataporten för noden Läs in HTML-innehåll .

    ____________

Testa ditt arbete

  1. Spara projektet i Unity.

    VARNING! Det finns för närvarande en bugg i projektet där sparandet kan leda till att texten i textrutorna för information försvinner.

    En skärmbild av en datorbeskrivning

    Texten visas igen när du anger Uppspelningsläge. Tänk på detta när du arbetar genom de andra stationerna.

  2. Tryck på uppspelningsknappen för Unity-redigeraren.

  3. Placera dig framför Station 1 och observera att WebSlate visar Startsidan för Microsoft Mesh.

    En skärmbild av en datorbeskrivning

  4. Klicka på knappen Läs in . WebSlate läser in och visar en sida från variabeln du anslöt i skriptdiagrammet med texten "Hello World".

    En skärmbild av en datorbeskrivning

    Den här sidan kommer från HTMLAsset-variabeln i knappens skriptdiagram.

    En skärmbild av en datorbeskrivning

    TIPS: Om du vill få lite extra insikter om hur skriptet fungerar kan du titta på det i skriptdiagrammet när du klickar på knappen Läs in. Anslutningsapparna mellan noderna visar informationstips och animeringar.

  5. När du är klar klickar du på knappen Spela upp i Unity-redigeraren för att avsluta uppspelningsläget.

Nästa steg