| Tartalomjegyzék |
|
| A Game Loop létrehozása | A HTML kiterjesztése |
Rugalmas elrendezés
Ebben a tutorial bemutatja, hogyan szövegedbe érzékeny JavaScript. Két doboz hozzáadni a dokumentumtárhoz. Hogy egy piros és egy zöld. Ezek a dobozok csak példák. Olyan alakzatokat vagy objektumokat lehetne használni.
Vegye fel a dobozokat a szerkesztő.
Gondoskodik a dobozok, így töltik meg a bal és jobb oldalán. Hagy egy határ körül őket.
Ez most egy példa egy weblap tartalmat a bal és jobb oldalán. Ez akarat megjelenés finom-egy desktop pókháló legel vagy egy telefon a tájkép módban. Sajnos ez az elrendezés nem működik, portré módban is. Vagy, a két doboz kell zsugorodott, kis, hogy illeszkedjen, vagy kiterjesztett kitölti a képernyőt, és a dobozok oldalán vágva.
Ebben a helyzetben, ahol érzékeny elrendezés van szükség. Portré módban egy doboz kell mozgatni a másik felett. Ehhez, meg kell mozgatni a dobozokat, JavaScript segítségével. Ez azt jelenti, fordult ki 'Használja, idővonal' mind a dobozok, és a beállítás a 'Parancsfájl-azonosító'.
Ahhoz, hogy mozgatni a dobozokat kívül esik, a film, van szükségünk, hogy kapcsolja ki a klip a film tulajdonságok.
A legjobb hely, hogy gondoskodjon a doboz a 'Átméretezés' esemény film.
A függvény van szükségünk, GetLeft, GetTop, GetWidth és GetHeight. Ezeket a funkciókat, hogy a határokat a web böngésző vagy eszköz segítségével a koordinátákat a film. Clip be van kapcsolva, amikor ezek az értékek vissza a határait-a film. Ha ön használ a 'nincs' film skála, GetLeft és GetTop mindig vissza fog térni a 0, és figyelmen kívül hagyható.
Először is lehetővé teszi, hogy gondoskodjon a két dobozok, így töltse ki a bal oldalon, és a másik tölti ki, a jobb oldali.
BoxB.SetBounds(GetLeft()+(GetWidth()/2),GetTop(),GetWidth()/2,GetHeight());
Ezután hozzátesszük a határ a mérete 10. Ez az érték 10 nem feltétlenül képpontban, az ugyanaz a skála, a film. Használja a film skála 'Egyik sem' mindent, hogy képpontban.
BoxA.SetBounds(GetLeft()+Border,GetTop()+Border,(GetWidth()/2)-Border-(Border/2),GetHeight()-Border-Border);
BoxB.SetBounds(GetLeft()+(GetWidth()/2)+(Border/2),GetTop()+Border,(GetWidth()/2)-Border-(Border/2),GetHeight()-Border-Border);
Végül akarat teszt, hogy ha a web böngésző vagy eszköz szélességének kevesebb, mint a magasság. Amikor ez megtörténik, átrendezheti a dobozok függőlegesen.
if(GetWidth()<GetHeight()){
BoxA.SetBounds(GetLeft()+Border,GetTop()+Border,(GetWidth())-Border-Border,(GetHeight()/2)-Border-(Border/2));
BoxB.SetBounds(GetLeft()+Border,GetTop()+(GetHeight()/2)+(Border/2),GetWidth()-Border-Border,(GetHeight()/2)-Border-(Border/2));
}else{
BoxA.SetBounds(GetLeft()+Border,GetTop()+Border,(GetWidth()/2)-Border-(Border/2),GetHeight()-Border-Border);
BoxB.SetBounds(GetLeft()+(GetWidth()/2)+(Border/2),GetTop()+Border,(GetWidth()/2)-Border-(Border/2),GetHeight()-Border-Border);
}
Most már láthatod, ha átméretezi a játékos, a két doboz megszervezi magát automatikusan. E két doboz könnyen helyébe más alakzatok és objektumok. Ez a példa lehet kiterjed-hoz fogantyú a komplexebb formák, amik.
| A Game Loop létrehozása | A HTML kiterjesztése |