enpu

Panda Engine 2 development

300 posts in this topic

Ah that's because you are tweening ninja.y property, you should be tweening ninja.position.y property (ninja.y is just a reference to ninja.position.y and i have not yet added those, will do that asap)

 

edit: Just pushed changes, container.x property should be now same as container.position.x

Share this post


Link to post
Share on other sites

What do you exactly mean by overriding default hires functionality?

nevermind it was a pointless thought. Since you said objects will be automatically scaled by game.scale I was asking myself if for any reason I didn't want to scale a specific object by game.scale but then you would just divide by game.scale so it doesn't really matter. it's certainly better this way.

Share this post


Link to post
Share on other sites

Yeah actually it does not scale any objects, just place them on correct positions.

Share this post


Link to post
Share on other sites

Unfortunately it is currently on hold, but i'm hoping to have time for it after Panda Engine v2 and Panda Editor.

Would be great if i could integrate it into Panda Editor.

ThanosS likes this

Share this post


Link to post
Share on other sites

Few major things still in progress:

 

- TilingSprite

- Graphics rendering on WebGL

- Masking

Share this post


Link to post
Share on other sites

Hi @enpu

 

Just tested the dev version and its looking awesome ... retina and hires + scaling work now :)

 

One problem I have tho, is that when I enable 'resize', the game shows more of the area to the right instead of centrering the content/game window.

 

Is this how it's supposed to work?

 

I realize that I can centre a container horisontaly, this way ...

 

bg.position.set(game.system.width/game.scale/2 - game.system.originalWidth/2, 0);

 

The problem is that, if you resize the browser window, the position does not update and it's no longer centred.

 

Thank you!!!

 

PS. How do you set the background colour in this new version? :) (Thanks again!)

Share this post


Link to post
Share on other sites

PS. How do you set the background colour in this new version? :) (Thanks again!)

 

I assume that this should work :

game.createScene('Main',{    backgroundColor: 0xffffff,    init: function() {        // Your awesome stuff ! :3    }}
--------------

 

I'm glad to see how this project is going faster each day ! Very nice work enpu ! :)

Share this post


Link to post
Share on other sites

Hi @ThanosS - Thanks for the reply. I've tried that but it doesn't seem to work anymore (it did for Panda 1.XX)

 

@enpu - I found that this works ...

var centerContainers = function() {   bg.position.set(game.system.width/game.scale/2 - game.system.originalWidth/2, game.system.height/game.scale/2 - game.system.originalHeight/2);   mg.position.set(game.system.width/game.scale/2 - game.system.originalWidth/2, game.system.height/game.scale/2 - game.system.originalHeight/2);   fg.position.set(game.system.width/game.scale/2 - game.system.originalWidth/2, game.system.height/game.scale/2 - game.system.originalHeight/2);   ui.position.set(game.system.width/game.scale/2 - game.system.originalWidth/2, game.system.height/game.scale/2 - game.system.originalHeight/2);}centerContainers();window.addEventListener('resize', centerContainers);

Is there a way for the engine to do this automatically?

 

Thank you heaps for your help guys!

Share this post


Link to post
Share on other sites

There is no backgroundColor property on Scene anymore, i find it to be used very rarely, usually i have background images on games.

But if you need background color you can always do this:

var bg = new game.Graphics();bg.beginFill('#ffffff');bg.drawRect(0, 0, game.system.width, game.system.height);bg.addTo(this.stage);

About resize, it does not center anything automatically, position 0,0 is always left top corner.

I usually use resize only on mobile, to make my games work fullscreen on every aspect ratio.

 

And do you really want to use resize on full desktop browser window?

I don't think that is a good idea, but if you really need that, and want to center everything on resize, there is onResize method on Scene.

Also you should not need to use game.scale or originalWidth / originalHeight on positioning anymore.

 

Example:

game.createScene('Main', {    init: function() {        this.sprite = new game.Sprite('panda.png');        this.sprite.anchorCenter();        this.sprite.position.set(game.system.width / 2, game.system.height / 2);        this.sprite.addTo(this.stage);    },    onResize: function() {        this.sprite.position.set(game.system.width / 2, game.system.height / 2);    }});

Share this post


Link to post
Share on other sites

Hi @enpu

 

Thanks for the explanation!

 

What you said makes sense! I want to use 'resize' (on desktop), because I design my backgrounds wider then they need to be and I find it gives it it nice 'full screen effect'.

 

I always put the important stuff inside the game dimensions, and only unimportant visual stuff gets shown on the left and right if the screen is wider then the base game width (for example extra trees or buildings).

 

This is mainly for games where each level is different and there are a lot of cartoon visuals + backgrounds (e.g. Clickplaytime)

 

I find that this is a lot nicer then having bars on either side of the screen :)

 

Thank you again for your suggestions!

 

PS. Any major reason why you don't think it's a good idea?

 

I also found that ...

 

mg.anchorCenter();

mg.position.set(game.system.width / 2, game.system.height / 2);

 

doesn't seem to work and It appears off screen.

 

I have a feeling that mg.position.set is trying to multiply it by game.scale (unless I'm wrong and containers don't have anchors ... but I was pretty sure that in 2.0, they do).

Share this post


Link to post
Share on other sites

I have a feeling that mg.position.set is trying to multiply it by game.scale (unless I'm wrong and containers don't have anchors ... but I was pretty sure that in 2.0, they do).

Enpu said that every object in the Panda Engin 2.0 should have anchor ;)

Share this post


Link to post
Share on other sites

Sorry i might have been a bit unclear, what i meant, was that i would not use 'resize' on desktop without 'scale' enabled.

That would make the canvas really big on users with high resolution monitors. But with 'scale' enabled it is a good idea,

because 'scale' first scales the canvas as big as possible with CSS, and then 'resize' fills the empty space to make the game fill the whole window.

 

And yes, every object should have anchor.

 

@Ninjadoodle that code looks fine to me, and it should work, can you make me a test case so i can take a closer look and see if it is a bug or not?

Share this post


Link to post
Share on other sites

Hi @enpu

 

I've just emailed you a file, where I commented out the code you suggested (which doesn't seem to work).

 

The code above it using game.scale does.

 

Let me know if you need anything else :)

Share this post


Link to post
Share on other sites

Thanks for the file, there seems to be still some issues with 'resize' and 'hires' combination, will fix that asap.

Share this post


Link to post
Share on other sites

Hi @enpu

 

Does  ...

 

sprite.gotoAndStop(1);

 

still work ?

 

I seem to be getting an error.

 

Thank you for your help!

 

PS. I just found the (new?) gotoFrame(); function in animation.js. I still doesn't seem to be working tho :(

Share this post


Link to post
Share on other sites

@Ninjadoodle

 

Animation has changed to new multi-animation format:

var anim = new game.Animation([	'player1.png',	'player2.png',	'player3.png']);anim.addAnim('jump', [0, 1, 2, 1]);anim.addTo(this.stage);anim.play('jump');

But i have just pushed changes, so that it automatically creates new animation named 'default' (and sets it as current animation) that is from the first frame to the last frame, so this should work now:

var anim = new game.Animation([	'player1.png',	'player2.png',	'player3.png']);anim.addTo(this.stage);anim.play();

If you then want to add new animation, and switch back to 'default', do it like this:

var anim = new game.Animation([	'player1.png',	'player2.png',	'player3.png']);anim.addAnim('jump', [0, 1, 0, 2, 1]);anim.addTo(this.stage);anim.play('jump');...anim.play('default'); // Play default animation

Does that sound clear?

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.