Programiranje igre barv v Hype

• April 18, 2024

V prejšnji vadnici smo uvozili slike za igro barvanja za iBooks Author^R ki jih izdelujemo v Hype Pro. Zdaj bomo v igro dodali interaktivne elemente.

Odprite svoj Hype dokument in začnimo.

Naš prvi korak je, da dodamo identiteto vsaki plasti, ki mora ob kliku izginiti. Sem spadajo likovne plasti za telo race, krilo in kljun. Z dodelitvijo vsake od teh plasti edinstven element elementa lahko nato programiramo vidnost teh plasti z JavaScript.

1. Odprite inšpektor za identiteto.
   
   
2. Izberite plast duck_body_line v glavni časovni premici.
   
   
3. V Inšpektorju identitete dodajte enoličen ID elementa. Izkoristimo ID Telo.
   
   
4. Izberite plast duck_wing_line in dodajte Krila kot edinstven ID elementa.
   
   
5. Izberite plast duck_beak_line in dodajte Kljun kot edinstven ID elementa.
   
   

Zdaj, ko imajo plasti edinstvene ID-je elementov, lahko temu slojem dodamo dejanje. Za nadzor vidnosti teh plasti bomo uporabili JavaScript in lastnost Display. Privzeta vrednost prikaza slike je v vrsti, kar pomeni, da se slika prikaže v ostalem HTML-ju in se ne začne v novi vrstici.

Za skrivanje slik bomo s spreminjanjem vrednosti lastnosti prikaza prikazali JavaScript v vrsti do noben za vsak sloj umetniških linij. To bo razkrilo plasti zapolnjevanja barv spodaj.

object.style.display = "nič"

1. Odprite inšpektor za dejanja.
   
   
2. Izberite plast duck_body_line.
   
   
3. V razdelku Kliknite na miško (Tapnite) kliknite ikono Plus.
   
   
4. V spustnem meniju Dejanje izberite Zaženi JavaScript.
   
   
5. Ker bo to po meri JavaScript, v spustnem meniju Funkcija nastavite na Novo funkcijo. Odprlo se bo novo okno z zavihki s privzeto kodo JavaScript in funkcijo z imenom untitledFunction.
   
   
6. Spremenite ime funkcije iz untitledFunction do BodyFunction. Videlo se bo, da se ime zavihka spremeni v BodyFunction ().
   
   Nato bomo dodali kodo za nastavitev lastnosti zaslona noben za Telo element. V prazno vrstico 5 dodajte naslednjo kodo.
   
   hypeDocument.getElementById ("Body"). style.display = "noben";
   
   
7. Vrnite se do okna z jezikom Untitled Scene in izberite plast duck_wing_line.
   
   
8. Ponovite prejšnji korak, če želite spremeniti ime funkcije WingFunction in dodajte naslednji JavaScript.
   
   hypeDocument.getElementById ("krilo"). style.display = "noben";
   
   
9. Izberite plast duck_beak_line, spremenite ime funkcije v BeakFunction in dodajte naslednji JavaScript.
   
   hypeDocument.getElementById ("kljun"). style.display = "noben";
   
   To je to. Preizkusimo v brskalniku. Če gre vse v redu, projekt izvozite kot pripomoček iBooks Author.
   
   
10. V meniju kliknite Datoteka - Izvozi kot HTML5 - Nadzorna plošča / iBooks Author Widget.
    
    

Navodila Video: Age of Deceit (2) - Hive Mind Reptile Eyes Hypnotism Cults World Stage - Multi - Language (April 2024).