RPG przy użyciu Phasera(canvas) i TIlerditor
Forum MMO - Tworzenie gier via www i MMO
Strona 1 z 3 123 OstatniOstatni
Pokaż wyniki od 1 do 10 z 24

Wątek: RPG przy użyciu Phasera(canvas) i TIlerditor

  1. Zarejestrowany
    Dołączył: Dec 2014
    Posty: 12
    Pobieralnia
    0
    Dodane pliki
    0
    Thumbs Up/W dół
    Otrzymane: 0/0
    Dane: 1/0
    Siła reputacji: 0

    RPG przy użyciu Phasera(canvas) i TIlerditor

    #1
    Witam!

    W mojej przygodzie w programowaniem bawiłem się już trochę z php oraz ostatnio liznąłem java scriptu oraz czytałem sporo o canvasie (zakupiłem i przeanalizowałem książkę HTML5. Tworzenie gier).
    W moim projekcie chciałbym zrobić grę o grywalności podobnej do RPG. Tzn gracz miał by swoje podwórko na którym mógłby oddziaływać na tekstury otoczenia, siać trawę co zmieniałoby tekturę, ścinać drzewo, kupować i stawiać przedmioty jak np łózko na którym później mógłby spać co dodawałoby mu przypuścimy energii.

    I tak jak o canvasie jest w internecie dośc sporo, o phaserze już mniej, nie mówiąc już że na polskich forach praktycznie nic. Przejrzałem angielskie fora i jest troche materiałów do phasera, ale część nie oparta o TIleeditor lub są to zwykłe gry klikane na smartphony jak np podróbki POU.

    Może zacznę od tego co znalazłem i przeanalizowałem, poniżej zamieszczam link to tutorialu prostej gry, która mniej więcej daje początek do moich zmagań :
    http://www.gamedevacademy.org/html5-...es-with-tiled/

    a grywalność możecie sprawdzić na mojej stronie bo testowałem tam pliki: www.lifetime.cba.pl.

    Tak więc pierwszy element od którego zacząłem to zmiana mapy po wejściu w drzwi. W funkcji wywołanej po wejściu w drzwi próbowałem już różnych sposobów od usunięcia starej mapy poprzez aktualizację jej na różne sposoby oraz tworzenie całkiem nowej i albo robię to źle albo nie tędy droga. Myślałem też by zrobi dla map osobny State, ale również nie wiem czy to dobre rozwiązanie.

    Myślę, że to ciekawy temat dla polskiego forum ponieważ mało jest na nim o bibliotece Phaser która od niedawna wchodzi na rynek programistyczny. Tak więc jeśli jet ktoś kto chce się zainteresować tą technologią, skosztować jej lub po prostu pomóc z dobrego serca mi wdrożyć się tą technologię to proszę o wyrażanie swoich opinii i podpowiedzi Click here to enlarge Nie proszę tu o napisanie za mnie gry, myślę że gdy załapie początki, później pójdzie już łatwiej samemu drążyć temat Click here to enlarge Bardzo przepraszam jeśli zdubluję post, ale dodałem go wczoraj i nie wiem czy coś poszło nie tak czy czeka na akceptację. Pozdrawiam.

    0 Nie wolno! Nie wolno!

  2. Zarejestrowany
    Dołączył: Dec 2014
    Posty: 12
    Pobieralnia
    0
    Dodane pliki
    0
    Thumbs Up/W dół
    Otrzymane: 0/0
    Dane: 1/0
    Siła reputacji: 0

    Odp: RPG przy użyciu Phasera(canvas) i TIlerditor

    #2
    Spróbowałem stworzy nowy state dla osobnej mapy do której wrzuciłem ten sam kod co w we wcześniejszej z tym, że z mniejsza ilością filiżanek, jest postęp ponieważ po wejściu w drzwi przenosi mnie, jednak wraca spowrotem do początkowego stanu gry, czyli tak jakby na nowo wczytało mapę. Kombinuję i kombinuję i nie mogę tego rozgryźć. Obecny stan można zobaczy na stronie. Jeśli ktoś ma jakiś pomysł proszę o podpowiedź. Click here to enlarge

    0 Nie wolno! Nie wolno!

  3. Zarejestrowany
    Dołączył: May 2009
    Posty: 300
    Pobieralnia
    0
    Dodane pliki
    0
    Thumbs Up/W dół
    Otrzymane: 0/0
    Dane: 3/0
    Siła reputacji: 41

    Odp: RPG przy użyciu Phasera(canvas) i TIlerditor

    #3
    Karer kiedyś siedział dużo w canvasie, a przynajmniej jakiś tam projekt tworzył. Może on Ci pomoże.

    0 Nie wolno! Nie wolno!

  4. Zarejestrowany
    Dołączył: Jan 2009
    Posty: 624
    Pobieralnia
    5
    Dodane pliki
    0
    Thumbs Up/W dół
    Otrzymane: 6/2
    Dane: 1/0
    Siła reputacji: 73

    Odp: RPG przy użyciu Phasera(canvas) i TIlerditor

    #4
    Ja powiem tak.. złap Writen'a. Myślę że z chęcią pomoże, phasera to on zna dobrze Click here to enlarge

    0 Nie wolno! Nie wolno!

  5. Zarejestrowany
    Dołączył: Dec 2014
    Posty: 12
    Pobieralnia
    0
    Dodane pliki
    0
    Thumbs Up/W dół
    Otrzymane: 0/0
    Dane: 1/0
    Siła reputacji: 0

    Odp: RPG przy użyciu Phasera(canvas) i TIlerditor

    #5
    Oo dziękuje za podpowiedzi Click here to enlarge poczekam troszkę, może ktoś zajrzy do mojego tematu.. Kilka ładnych wieczorów kombinuje i nie mogę ruszyć, najważniejsze tą zmianę mapy żeby dobrze zrobić a później się możne jakoś będzie brnęło Click here to enlarge

    0 Nie wolno! Nie wolno!
    Ostatnio edytowane przez P4nch0 ; 22-12-2014 o 18:08

  6. Zarejestrowany
    Dołączył: May 2010
    Posty: 139
    Pobieralnia
    0
    Dodane pliki
    0
    Thumbs Up/W dół
    Otrzymane: 15/3
    Dane: 20/10
    Siła reputacji: 23

    Odp: RPG przy użyciu Phasera(canvas) i TIlerditor

    #6
    No cześć.
    Najpierw postaram się zrozumieć co chcesz osiągnąć.
    Po przejściu przez drzwi chcesz zmienić mapę na inną. Mapy masz stworzone w programie Tiled.
    To co obecnie masz wczytuje tą samą mapę, bo w pliku Game.js masz linię:
    Kod html:
    this.map = this.game.add.tilemap('level1');
    To właśnie to level1 określa identyfikator mapy, który nadajesz podczas ładowania pliku .json. Ale żeby wczytać inną mapę nie musisz tworzyć nowego state'a. Proponuję żebyś stworzył właściwość, w której zapiszesz nazwę mapy, która ma się załadować. O tak:
    Kod html:
    TopDownGame.level = 'level1';
    Następnie lekko zmień linijkę wczytującą mapę w taki sposób:
    Kod html:
    this.map = this.game.add.tilemap(TopDownGame.level);
    Będzie to oznaczało to samo. Po włączeniu gry załaduje się mapa o id level1.

    W zdarzeniu przechodzenia przez drzwi enterDoor wystarczy, że ponownie odpalisz ten sam state Game. Ale wcześniej zmieniając właściwość TopDownGame.level:

    Kod html:
    TopDownGame.level = 'level2';
    TopDownGame.game.state.start('Game');
    I w ten sposób ukarze się nam nowa mapa.

    Ale jeszcze. Każda mapa powinna mieć unikalny identyfikator.
    Czyli w pliku preload.js, w funkcji ładującej plik mapy musisz zmienić też pierwszy argument:
    Kod html:
    (...)
     //load game assets
        this.load.tilemap('level1', 'assets/tilemaps/level1.json', null, Phaser.Tilemap.TILED_JSON);
        this.load.tilemap('level2', 'assets/tilemaps/level3.json', null, Phaser.Tilemap.TILED_JSON);
    (...)

    --------------------------------------------------------

    Aha. Zapewne chciałbyś mieć więcej poziomów i map w grze. To jest jeszcze takie rozwiązanie.
    Do zmiennej TopDownGame.level zapisujesz po prostu numer poziomu.
    Domyślnie to będzie
    Kod html:
    TopDownGame.level = 1;
    Po przejściu przez drzwi najzwyczajniej zwiększasz tą zmienną o jeden.
    Kod html:
    TopDownGame.level++;
    No i przy wczytywaniu mapy musiałoby to wyglądać tak:
    Kod html:
    this.map = this.game.add.tilemap('level'+TopDownGame.level);
    A identyfikatory map musiały by mieć nazwy level1, level2, level3, itd.

    ----------------------------------------

    Nie testowałem tych rozwiązań, które ci tu przedstawiłem. No, ale pokombinuj. Na logikę powinno działa, prawda?

    0 Nie wolno! Nie wolno!
    Ostatnio edytowane przez writen ; 22-12-2014 o 21:00

  7. Zarejestrowany
    Dołączył: Dec 2014
    Posty: 12
    Pobieralnia
    0
    Dodane pliki
    0
    Thumbs Up/W dół
    Otrzymane: 0/0
    Dane: 1/0
    Siła reputacji: 0

    Odp: RPG przy użyciu Phasera(canvas) i TIlerditor

    #7
    O kurcze, przeraża mnie Twoja wiedza na ten temat, oczywiście w dobrym tego słowa znaczeniu Click here to enlarge Na wstępie dziękuję za zainteresowanie, może też inni się nauczą czegoś bo to rzadki temat na forum Click here to enlarge

    To do rzeczy:

    Zmiana Game.js
    Kod html:
    var TopDownGame = TopDownGame || {};
    TopDownGame.level = 'level1';
     TopDownGame.Game = function(){};
    
    TopDownGame.Game.prototype = {
      create: function() {
    
        this.map = this.game.add.tilemap(TopDownGame.level);
    ....
    Kod html:
      enterDoor: function(player, door) {
        console.log('entering door that will take you to '+door.targetTilemap+' on x:'+door.targetX+' and y:'+door.targetY);
        TopDownGame.level = 'level3';
        TopDownGame.game.state.start('Game');
    Zmiana Preload.js

    Kod html:
        this.load.tilemap('level1', 'assets/tilemaps/level1.json', null, Phaser.Tilemap.TILED_JSON);
        this.load.tilemap('level3', 'assets/tilemaps/level3.json', null, Phaser.Tilemap.TILED_JSON);
    I działa! Po prostu mnie zszokowałeś, teraz tylko do przodu Click here to enlarge
    Tylko mam pytanie, ponieważ teraz level3 jest ta samą mapą co level1, tylko po prostu ma mniej filiżanek. A jeśli wprowadzę zupełnie inną mapę, to tu gdzie miałem zapisane wartości jak np wczytanie tiles, czy zapisanie praw panujących na mapie, zapisuję w tych samych miejscach co do mapy level1 i one dotrą gdzie muszą?

    Będę pisał tutaj jak przebiega praca, myślę że nowe osoby na polskich forach mogą zainteresować się tą technologią Click here to enlarge
    Czy w razie problemów, mogę napisać i zajrzysz tu jeszcze czasem? Click here to enlarge
    Jeszcze raz ogromnie dziękuję za pomoc! Pozdrawiam. Click here to enlarge

    PS.
    Pliki na stronie już zupdatowane jeśli ktoś chce zobaczy Click here to enlarge
    I oczywiście daje zupełnie zasłużony Like!

    0 Nie wolno! Nie wolno!
    Ostatnio edytowane przez P4nch0 ; 22-12-2014 o 22:11

  8. Zarejestrowany
    Dołączył: May 2010
    Posty: 139
    Pobieralnia
    0
    Dodane pliki
    0
    Thumbs Up/W dół
    Otrzymane: 15/3
    Dane: 20/10
    Siła reputacji: 23

    Odp: RPG przy użyciu Phasera(canvas) i TIlerditor

    #8
    Cieszy mnie to ze coraz wiecej osob interesuje sie tą biblioteką. W razie problemów wystarczy napisać na forum, ja chętnie pomogę.

    0 Nie wolno! Nie wolno!

  9. Zarejestrowany
    Dołączył: Dec 2014
    Posty: 12
    Pobieralnia
    0
    Dodane pliki
    0
    Thumbs Up/W dół
    Otrzymane: 0/0
    Dane: 1/0
    Siła reputacji: 0

    Odp: RPG przy użyciu Phasera(canvas) i TIlerditor

    #9
    Interesuje interesuje, jak zacząłem wczoraj brać to się położyłem przed 4tą rano.. Click here to enlarge

    Stworzyłem dwie nowe mapki i pobawiłem się trochę z obiektami. I mam takie małe pytanie.
    Tworząc mapę użyłem dwóch plików graficznych i niebardzo rozumiem działanie o tego:
    Kod html:
        //collision on blockedLayer
        this.map.setCollisionBetween(1, 2000, true, 'blockedLayer');
    Gdy mam to ustawione na 2000, player koliduje z obiektami z jednego pliku graficznego, a z drugiego nie, gdy dałem na 10000 koliduje już ładnie ze wszystkimi. Twórca tutorialu tłumaczy to tam, ale nie bardzo mogę rozkminić o co chodzi. Pozdrawiam Click here to enlarge

    0 Nie wolno! Nie wolno!

  10. Zarejestrowany
    Dołączył: May 2010
    Posty: 139
    Pobieralnia
    0
    Dodane pliki
    0
    Thumbs Up/W dół
    Otrzymane: 15/3
    Dane: 20/10
    Siła reputacji: 23

    Odp: RPG przy użyciu Phasera(canvas) i TIlerditor

    #10
    Pierwszy i drugi parametr tej funkcji oznaczają początkowy i końcowy index kafelków, z którymi ma nastąpić kolizja. Kafelki (tiled) to pojedyncze elementy pliku graficznego mapy. Twój drugi plik graficzny ma tych kafelków bardzo dużo.
    Jeśli chcesz ustawić kolizje tylko z niektórymi kafelkami możesz użyć funkcji setCollision. http://docs.phaser.io/Phaser.Tilemap.html#setCollision
    Wystarczy, że w pierwszym parametrze podasz tylko tablicę z indeksami poszczególnych kafelków.

    Tutaj znajdziesz masę przykładów: http://examples.phaser.io/
    A tutaj całą dokumentację: http://docs.phaser.io/

    0 Nie wolno! Nie wolno!

Strona 1 z 3 123 OstatniOstatni

Informacje o wątku

Użytkownicy przeglądający ten wątek

Aktualnie 1 użytkownik(ów) przegląda ten wątek. (0 zarejestrowany(ch) oraz 1 gości)

Podobne wątki

  1. pomocy, noobowy błąd przy rysowaniu na canvas (html5, js)
    Przez tehanu w dziale Problemy przy tworzeniu własnej gry
    Odpowiedzi: 5
    Ostatni post / autor: 15-09-2014, 09:35
  2. Canvas zapisanie rysowanego obrazku
    Przez adacho26 w dziale Problemy przy tworzeniu własnej gry
    Odpowiedzi: 3
    Ostatni post / autor: 10-09-2013, 17:03
  3. Canvas rotacyjnie wśród pikseli
    Przez Azides w dziale JavaScript/AJAX
    Odpowiedzi: 2
    Ostatni post / autor: 30-07-2013, 18:19
  4. WebGL&Canvas
    Przez Azides w dziale JavaScript/AJAX
    Odpowiedzi: 1
    Ostatni post / autor: 10-02-2013, 22:05

Osoby które odwiedziły tą stronę znalazły ją szukając:

Tagi dla tego wątku

Zakładki

Uprawnienia umieszczania postów

  • Nie możesz zakładać nowych tematów
  • Nie możesz pisać wiadomości
  • Nie możesz dodawać załączników
  • Nie możesz edytować swoich postów
  •  

Partnerzy

ViaWWWGamers - portal od graczy dla graczy Yggdrasil – portal o grach

Toplisty

TOP50 Gry Internetowe RPG - gry MMO i MMORPG online Gry w przeglądarce Top Granie
facebook
G