Isometrinen näkymä

Home » Blogi » Isometrinen näkymä

Isometrinen näkymä lisää syvyyttä peliisi. Monet kuuluisat pelit käyttävät tätä vie, koska se on yksinkertainen tehdä, mutta näyttää hyvältä. Ja parasta isometrisessa näkymässä on, kuinka helppoa on luoda perustuva sama vanha laattapohjainen lähestymistapa. näin:

Teoria

Ensin sinun pitäisi tietää, että varsinainen isometrinen näkymä (matematiikan perusteella) on hieman monimutkaisempi eikä sitä koskaan käytetä peleissä. Nyt kun tiedät sen, unohda se. Tästä eteenpäin puhumme vain yksinkertaisista isometrioista. Ehkä paras tapa kuvitella isometrinen on katsoa, ​​mitä tapahtuu normaalille neliölle, kun se muunnetaan isometriseksi näkymäksi:

Ensin käännetään neliötä 45 astetta ja sitten tehdään sen korkeus puolet leveydestä. Se oli yksinkertaista. Luodaan nyt laatat ja sankarimme:

On tärkeää sijoittaa grafiikka rekisteröintipisteeseen (pieni risti, josta Flash alkaa laskea koordinaatteja) kuvan osoittamalla tavalla. Seinälaatan voit vetää niin korkealle kuin haluat. Sankarille olen jättänyt laatan kuvaan, jotta toivottavasti ymmärrät sen sijainnin paremmin, älä sijoita sitä suorakulmiota sankarin lopulliseen grafiikkaan. Se vain näyttäisi oudolta, jos sankari kävelee ympäriinsä, suorakulmio hänen ympärillään.

Muutoksia koodiin

Ensimmäinen muuttuva asia on laattojen koko ja sankarin koko. Mutta odota, minkä kokoinen? Toistaiseksi se oli selkeä, elokuvaleikkeen leveys ja korkeus, mutta isometrisessä näkymässä elokuvaleikkeen korkeus voi olla melkein mikä tahansa.

TileW-muuttujan arvo on siis puolet todellisen laattagrafiikan leveydestä. Sankarille sen leveys- ja korkeusominaisuudet ovat yhtä suuret ja puolet sen grafiikan todellisesta leveydestä. Kirjoita se ylös:

peli={tileW:30};
char={xtile:2, ytile:1, nopeus:4, leveys:16, korkeus:16};


Suurin muutos koodissa tulee olemaan elokuvaleikkeiden todellinen sijoittaminen ruudulle. Normaalinäkymässä käytimme clip._x=x ja clip._y=y, jotta sama x/y näkyy isometrisessä näkymässä, käytämme:

clip._x=x-y;
clip._y=(x+y)/2;
Muuta laattojen sijaintia buildMap-funktiossa:

clip[nimi]._x = (j-i)peli.tileW; leike[nimi]._y = (j+i)peli.tiiliW/2;


Laattojen syvyys lasketaan samalla tavalla kuin ennenkin, mutta emme käytä x/y:tä, vaan käytämme laattojen uusia koordinaatteja isometrisessä näkymässä:

peli[nimi].depth=(j+i)peli.tiiliW/2300+(j-i)*peli.tiiliW+1;
Ja sama asia sankarille:

var ob=char;
ob.x = ob.xtilepeli.tileW; ob.y = ob.ytilegame.tileW;
ob.xiso = ob.x-ob.y;
ob.yiso = (ob.x+ob.y)/2;
ob.depthshift=(game.tileW-ob.height)/2;
ob.depth=(ob.yiso-ob.depthshift)*300+ob.xiso+1;
game.clip.attachMovie(“char”, “char”, ob.depth);
ob.clip=game.clip.char;
ob.clip._x = ob.xiso;
ob.clip._y = ob.yiso;


Kuten näet, uudet ominaisuudet xiso ja yiso sisältävät charin koordinaatit isometrinäkymässä, mutta meillä on edelleen ominaisuuksia x/y. Muuttuva syvyyssiirtymä on tarpeen, koska meidän char ei piirretä keskelle laatta (katso kuvaa char), se on siirtynyt ylöspäin.

Kaikki törmäykset ja liikkeet lasketaan normaalisti, mutta loppuasennossa elokuvaleike muunnetaan isometriseksi näkymäksi. MoveChar-funktion lopussa muuta merkin sijoittelua samalla tavalla:

ob.xiso = ob.x-ob.y;
ob.yiso = (ob.x+ob.y)/2;
ob.clip._x = ob.xiso;
ob.clip._y = ob.yiso;
ob.clip.gotoAndStop(dirx+diry2+3); ob.xtile = Math.floor(ob.x/peli.tileW); ob.ytile = Math.floor(ob.y/peli.tileW); ob.depth=(ob.yiso-ob.depthshift)300+(ob.xiso)+1;
ob.clip.swapDepths(ob.depth);


Kun olemme siirtäneet hiiltä, ​​havainneet törmäykset seiniin ja luultavasti sijoittaneet hiilen lähelle seinää, ominaisuudet x ja y pysyvät oikeassa paikassa ei-isometrisessa näkymässä. Nyt laskemme vain uudet arvot isometriselle näkymälle.

Voit ladata lähdekoodin ja kaikki koodit ja elokuvat täältä.

© Copyright 2025 Rahapelit netissä
Powered by WordPress | Mercury Theme