Pod mask─à this.add.image tworzy nowy obiekt z grafik─à oraz dodaje go do listy obiekt├│w wy┼øwietlanych na aktualnej scenie. Ta lista stanowi miejsce gdzie ÔÇ×┼╝yj─àÔÇØ wszystkie Twoje obiekty. Obrazek mo┼╝esz wypozycjnowa─ç zasadniczo w dowolnym miejscu. Oczywi┼øcie je┼╝eli umie┼øcisz go poza zaadeklarowanym obszarem od punktu 0x0 do 800x600 to nie b─Ödzie on widoczny. Taka grafika poza ekranem b─Ödzie jednak istnia┼éa na li┼øcie obiekt├│w.

Sama w sobie scena nie posiada ograniczonych wymiar├│w i rozszerza si─Ö w niesko┼äczono┼ø─ç w dowolnym kierunku. Camera System (system kamery) kontroluje wy┼øwietlany obszar, mo┼╝esz za jego pomoc─à przemieszcza─ç i powi─Öksza─ç aktualny widok. Mo┼╝esz r├│wnie┼╝ tworzy─ç dodakowe kamery dla innych widok├│w sceny. Temat ten wykracza poza poziom poradnika, kt├│ry w┼éa┼ønie czytasz. Wystarczy podkre┼øli─ç tu, ┼╝e system kamer w trzeciej wersji Phasera jest o wiele bardziej zaawansowany ni┼╝ w poprzednich wersjach. Pozwala on na tworzenie rzeczy niemo┼╝liwych chocia┼╝by w wersji drugiej.

Zbuduj teraz scenę poprzez dodanie tła oraz kilku platform. Oto nowa wersja funkcji create:

var platforms;

function create ()
{
    this.add.image(400, 300, 'sky');

    platforms = this.physics.add.staticGroup();

    platforms.create(400, 568, 'ground').setScale(2).refreshBody();

    platforms.create(600, 400, 'ground');
    platforms.create(50, 250, 'ground');
    platforms.create(750, 220, 'ground');
}

Przegl─àdaj─àc powy┼╝szy fragment kodu zwr├│─ç uwag─Ö na wywo┼éanie this.physics. Oznacza ono, ┼╝e w tym przyk┼éadzie wykorzystujemy Arcade Physics system (system fizyki zr─Öczno┼øciowej). Zanim jednak go wykorzystamy musimy doda─ç odpowiedni─à opcj─Ö┬ádo konfiguracji. Zaaktualizuj obiekt config w nast─Öpuj─àcy spos├│b:

var config = {
    type: Phaser.AUTO,
    width: 800,
    height: 600,
    physics: {
        default: 'arcade',
        arcade: {
            gravity: { y: 300 },
            debug: false
        }
    },
    scene: {
        preload: preload,
        create: create,
        update: update
    }
};

Nowo┼øcia w powy┼╝szym kodzie jest u┼╝ycie w┼éa┼øciwo┼øci physics. Po wprowadzeniu kodu z tej cz─Ö┼øci poradnika (znajduje si─Ö on w ca┼éo┼øci w pliku part4.html) powiniene┼ø zobaczy─ç co┼ø co przypomina scen─Ö z gry:

image

Mamy ju┼╝ pod┼éo┼╝e i kilka platform ale jak to w┼éa┼øciwie dzia┼éa?