Ennen kuin alamme rullata, meidän on tehtävä yksi asia hyvin selväksi. Flash on hidas. Flash on erittäin hidas. Vieritys tarkoittaa satojen laattojen siirtämistä näytöllä ja sen pitäisi tapahtua 20-30 kertaa sekunnissa. Liian monta vierittävää ruutua tarkoittaa, että Flash ei pysty piirtämään niitä ajoissa ja hidastuu. Pelisi ryömii kuin nukkuva etana.
“Mitä?” saatat ihmetellä, “ei vieritystä? Ja kuinka etana nukahti?”.
Voit tehdä vieriviä laattoja, mutta sinun tulee olla varovainen, ettet tee vieritysalueesta liian suurta ja et vieritä liikaa laattoja. Kuinka suuri on liian iso ja kuinka monta on liikaa, ne vastaukset sinun on selvitettävä itse. Muista, että Flash-pelejä pelataan enimmäkseen selaimella, luultavasti monet ikkunat avataan samaan aikaan, monet ohjelmat ovat käynnissä taustalla ja pelaajilla ei aina ole uusinta tehotietokonetta. Testaa peliäsi vanhoissa surkeissa tietokoneissa ja jos se tuntuu hidastuvan, pienennä sitä.
Teoria
Vasemmassa kuvassa on rullaamaton peli. Sankari liikkuu oikein, kaikki muu pysyy entisellään. Nyt oikeanpuoleisessa kuvassa meillä on rullaava peli. Sankarin oletetaan myös liikkuvan oikealle, mutta jotta se näyttäisi rullaavalta, pidämme sankarin nykyisessä asemassaan ja siirrämme kaiken muun vasemmalle.
Joten teoria on helppoa: kun sankarin oletetaan liikkuvan, siirrä kaikki laatat vastakkaiseen suuntaan. Mutta koska meillä on tapana sijoittaa sankari laattojen sisään elokuvaleikkeen kanssa kaikki taustalaatat, sankari liikkuisi päinvastaiseen suuntaan niiden kanssa. Korjataksemme sen, siirrämme silti kaiken vastakkaiseen suuntaan JA siirrämme sankaria saman verran oikeaan suuntaan.
Aika esimerkiksi. Rullaava peli. Heron oletetaan liikkuvan 10 pikseliä oikealle. Ensin siirrämme kaikki laatat (mukaan lukien sankari) vasemmalle 10 pikselillä ja siirrämme sankaria oikealle 10 pikseliä. Lopulta näyttää siltä, että sankari on pysynyt paikallaan, mutta muut laatat ovat vierineet vasemmalle.
Helpoin tapa vierittää laattoja on sijoittaa kaikki laatat näytölle, mutta näyttää vain pieni osa niistä, sitten siirrämme niitä ympäriinsä. Tämä saattaa hidastaa peliäsi, koska tuhannet laatat näkyvän alueen ulkopuolella tarvitsevat edelleen resursseja. Seuraava idea on poistaa laatat, kun ne irtoavat näkyvältä alueelta, ja kiinnittää laatat, kun ne tulevat taas näkyviin. Se on parempi, mutta Flash viettää liian paljon aikaa elokuvaleikkeiden poistamiseen/liittämiseen.
Viimeinen toivomme on sijoittaa lavalle vain näkyvät laatat ja kun ne sammuvat, siirrämme samat laatat vastakkaiselle puolelle, nimeämme ne uudelleen ja käytämme samoja elokuvapätkiä uudelleen. Sitä kutsutaan “gotoAndStop” vieritysmoottoriksi:
Kuten kuvasta näkyy, kun laatta irtoaa oikealta, siirrämme laatta vasemmalle. Meidän on myös nimettävä elokuvaleike uudelleen, koska kaikilla elokuvaleikkeillämme on nimet, kuten “t_3_4”, mikä tarkoittaa, että se sijoitetaan kohtaan y=3, x=4. Ja laatan uudessa asennossa on luultavasti näytettävä eri kehys (grafiikka), minkä vuoksi meidän on lähetettävä se oikeaan kehykseen oikealla grafiikalla ja siksi tätä menetelmää kutsutaan nimellä “gotoAndStop”.
Valmistaudutaan vieritykseen
Useimmissa vierityspeleissä sankari pysyy aina näytön keskellä.
Voit nähdä, kuinka sankarista jäljellä olevien laattojen määrä on yhtä suuri kuin hänen oikealla puolellaan olevien laattojen määrä. Tämä tarkoittaa, että sarakkeiden määrä on 3,5,7,9,11 jne., mutta ei koskaan 2,4,6,8. Sama pätee myös riveihin.
Ilmoitetaan pelin kohde:
peli = {tileW:30, tileH:30, currentMap:1, visx:7, visy:5, centerx:120, centery:90};
visx-ominaisuus on näkyvien sarakkeiden lukumäärä ja visy on rivien lukumäärä. Tarvitsemme myös ominaisuuksia centerx/centery merkitsemään elokuvamme keskipisteen.
Kun vieritämme laattoja, meidän on ehkä näytettävä laatat, joita ei ole ilmoitettu karttataulukossa. Kuten silloin, kun sankari kävelee onnellisena vasemmalle, kunnes hän seisoo karttataulukolla ilmoitetun vasemmanpuoleisen laatan päällä, meillä on vielä joitain laattoja hänestä näytettävänä. Tällaisia laattoja varten luomme uuden laattatyypin ilman näytettävää grafiikkaa (flashin käytön helpottamiseksi). Tee ruutuihin elokuvaleike uusi tyhjä avainkehys kehykseen 20. Lisää koodi tämän tyyppisen ruudun määrittämiseksi:
peli.Tile4 = funktio () { };
game.Tile4.prototype.walkable = false;
peli.Tile4.prototype.frame = 20;
Voit myös peittää joitain laattoja osittain näkyvän alueen ulkopuolella. Tee tätä tarkoitusta varten uusi elokuvaleike linkin nimellä “frame”, jonka keskellä on reikä, jossa näkyy vain laatat tuon reiän läpi.
Rakenna rullauksen maailma
Aloitetaan buildMap-toiminnolla.
function buildMap (kartta) {
_root.attachMovie(“tyhjä”, “laatat”, 1);
peli.halfvisx=int(peli.visx/2);
peli.halfvisy=int(peli.visy/2);
Laskemme peliobjektille 2 uutta ominaisuutta. halfvisx ja halfvisx sisältävät tietoja sarakkeiden ja rivien määrästä merkkien sijainnista näkyvän alueen reunaan. Kun sarakkeiden kokonaismäärä visx = 5, sitten halfvisx = 2, mikä tarkoittaa, että 2 saraketta on suoraan sankarista, 2 saraketta vasemmalla ja 1 on suoraan keskellä sankarin kanssa.
game.tile4.clip = _root.tiles;
game.clip._x = peli.centerx-(char.xtile*game.tileW)-game.tileW/2;
game.clip._y = peli.keskus-(char.ytile*game.tileH)-game.tileH/2;
Meidän on sijoitettava elokuvaleike, jossa on kaikki laatat ja sankari kahden muuttujan perusteella: pelin keskipiste, joka on ilmoitettu peliobjektissa centerx/centery ja sankarin sijainti char-objektissa xtile/ytile. Kun sankari asetetaan x-koordinaatille (char.xtile*game.tileW)+game.tileW/2, niin laattojen mc on oltava päinvastaisessa suunnassa, siksi vähennämme sen luvun centerx:stä.
for (var y = char.ytile-game.halfvisy; y<=char.ytile+game.halfvisy+1; ++y) {
for (var x = char.xtile-game.halfvisx; x<=char.xtile+game.halfvisx+1; ++x) {
var nimi = “t_”+y+”_”+x;
if(y>=0 ja x>=0 ja y<=kartan pituus-1 ja x<=kartta[0].pituus-1){
peli[nimi] = uusi peli[“Tile”+kartta[y][x]]();
}muu{
peli[nimi] = uusi peli.Tile4();
}
game.clip.attachMovie(“tile”, nimi, 1+y*100+x*2);
peli.leike[nimi]._x = (x*peli.tileW);
peli.leike[nimi]._y = (y*peli.tileH);
peli.leike[nimi].gotoAndStop(peli[nimi].kehys);
}
}
Tämä silmukka luo kaikki näkyvät laattaobjektit ja liittää myös elokuvaleikkeitä laattoja varten. Kuten näette, silmukka ei enää aloita 0:sta, se alkaa ytile-halfvisy:stä. Samalla tavalla se ei toimi karttataulukon loppuun asti, se toimii ytile+halfvisy+1 asti. Jos-ehto tarkistaa sitten, onko luotava laatta karttataulukossa. Jos se jää kartan ulkopuolelle, käytämme tyhjää ruutua tile4-mallista.
Saumattoman vierityksen luomiseksi meidän on käytettävä yhtä ylimääräistä riviä ja yhtä ylimääräistä laattojen saraketta oikeassa ja alareunassa. Nämä laatat varmistavat, että vaikka siirrämme puolet laatasta toiselle puolelle, tyhjää tilaa ei tapahdu.
_root.attachMovie(“kehys”, “kehys”, 100);
Viimeinen rivi liittää kehyksen peittämään elokuvan alueita, joita et halua nähdä.
char.clip = game.clip.char;
char.x = (char.xtile*peli.tileW)+game.tileW/2;
char.y = (char.ytile*game.tileW)+game.tileW/2;
char.width = char.clip._width/2;
char.height = char.clip._height/2;
char.clip._x = char.x;
char.clip._y = char.y;
char.clip.gotoAndStop(char.frame);
char.xstep=char.x;
char.ystep=char.y;
Merkki luodaan täsmälleen samalla tavalla kuin ennenkin. Ainoa ero on 2 uutta ominaisuutta xstep ja ystep, joita käytämme myöhemmin tarkistaaksemme, onko oikea aika siirtää laattojen rivejä tai sarakkeita toiselle puolelle.
Selaa! Selaa!
Nyt kun olemme luoneet maailman, meidän on todella rullattava sitä. MoveChar-funktion lopussa, kun olemme laskeneet heron ob.xtile/ob.ytile-arvon, lisää koodi vieritystä varten:
game.clip._x = peli.centerx-ob.x;
game.clip._y = game.centery-ob.y;
if(ob.xstep<ob.x-game.tileW){
var xtile = Math.floor(ob.xstep/game.tileW) + 1;
var xnew=xtile+game.halfvisx+1;
var xold=xtile-game.halfvisx-1;
for (var i = ob.ytile-game.halfvisy-1; i<=ob.ytile+game.halfvisy+1; ++i) {
changeTile (xold, i, xnew, i, _root[“omakartta”+peli.nykyinen kartta]);
}
ob.xstep=ob.xstep+game.tileW;
} else if(ob.xstep>ob.x){
var xtile = Math.floor(ob.xstep/game.tileW);
var xold=xtile+game.halfvisx+1;
var xnew=xtile-game.halfvisx-1;
for (var i = ob.ytile-game.halfvisy-1; i<=ob.ytile+game.halfvisy+1; ++i) {
changeTile (xold, i, xnew, i, _root[“omakartta”+peli.nykyinen kartta]);
}
ob.xstep=ob.xstep-game.tileW;
}
if(ob.ystep<ob.y-game.tileH){
var ytile = Math.floor(ob.ystep/game.tileH)+1;
var ynew=ytile+game.halfvisy+1;
var yold=ytile-game.halfvisy-1;
for (var i = ob.xtile-game.halfvisx-1; i<=ob.xtile+game.halfvisx+1; ++i) {
changeTile (i, yold, i, ynew, _root[“myMap”+game.currentMap]);
}
ob.ystep=ob.ystep+peli.tileH;
} else if(ob.ystep>ob.y){
var ytile = Math.floor(ob.ystep/game.tileH);
var yold=ytile+game.halfvisy+1;
var ynew=ytile-game.halfvisy-1;
for (var i = ob.xtile-game.halfvisx-1; i<=ob.xtile+game.halfvisx+1; ++i) {
changeTile (i, yold, i, ynew, _root[“myMap”+game.currentMap]);
}
ob.ystep=ob.ystep-game.tileH;
}
palauttaa (tosi);
Ensin siirrämme kaikki laatat ja sankarin pitävän game.clipin uuteen paikkaan sankarin keskipisteen ja koordinaattien perusteella. Sitten meillä on 4 samanlaista koodilohkoa, jokainen yhdelle suunnalle. Kun sankari on liikkunut enemmän kuin laattojen koko, nuo silmukat kutsuvat changeTile-funktiota oikeilla muuttujilla. Kun silmukka on päättynyt ja laattoja on siirretty/nimetty uudelleen/muutettu, päivitämme ystep/xstep-ominaisuudet.
Tehdään nyt tämä ChangeTile-funktio:
function changeTile (xold, yold, xnew, ynew, map) {
var nameold = “t_”+keltainen+”_”+xold;
var namenew = “t_”+ynew+”_”+xnew;
if(ynew>=0 and xnew>=0 and ynew<=map.length-1 and xnew<=map[0].length-1){
peli[nimiuusi] = uusi peli[“Tile”+kartta[ynew][xnew]]();
game.clip[nameold]._name = nimiuusi;
peli.leike[nimiuusi].gotoAndStop(peli[nimiuusi].kehys);
peli.leike[nimiuusi]._x = (xnew*game.tileW);
peli.leike[nimiuusi]._y = (uusi*peli.tileH);
}muu{
peli[nimiuusi] = uusi peli.Tile4();
game.clip[nameold]._name = nimiuusi;
peli.leike[nimiuusi].gotoAndStop(peli[nimiuusi].kehys);
}
}
Joten saamme 2 vanhaa koordinaattia ja 2 uutta laatallemme. Tarkistaaksemme, onko laatta edelleen karttataulukon sisällä, olemme myös läpäisseet kartan. “nameold” on laattojen vanha nimi ja “namenew” on uusi nimi. Kun olemme luoneet uuden laattaobjektin uudella ja tuoreella nimellä, rivi:
game.clip[nameold]._name = nimiuusi;
nimeää laatat uudelleen elokuvaleikkeen. Kun uusi elokuvaleike on tyhjä, meidän ei tarvitse sijoittaa sitä uuteen _x/_y, se voi jäädä vanhaan paikkaansa.
Virheenkorjaus 29/7/2004. Vieritys ei toiminut oikein nopeuksilla, jotka olivat suurempia kuin puolet laatan leveydestä. Kiitos Chrisille, että hän huomasi vian ja tarjosi paremman ratkaisun. MoveChar-funktiossa, jolla tarkistetaan, pitäisikö rivejä/sarakkeita siirtää, tulee olla rivejä paikallismuuttujan xtile/ytile laskemiseksi, ei vanhan ob.xtile/ob.ytile-arvon laskemiseksi.
