Author Topic: z-depth on sprites in a group  (Read 2447 times)

photonstorm

  • Administrator
  • Key Contributor
  • *****
  • Posts: 1502
  • Karma: +1/-0
    • View Profile
    • Photon Storm
z-depth on sprites in a group
« on: Sat, May 15, 2010 »
Hi,

I'm curious but has anyone found a nice way to do z-depthing on FlxSprites within an FlxGroup?

At the moment the order in which you add() the sprites in the group determines the draw order. But there seems to be no way to move them around once you've added them, or add them in a specific place (like addChildAt()).

I really need to be able to have sprites change depth appearance if they are below (on the Y axis) each other.

Suggestions? :)

Cheers,

Rich
http://www.photonstorm.com



"Tell me and I will forget, show me and I might remember, involve me and I will understand" - Confucius

L_O_J

  • Member
  • **
  • Posts: 88
  • Karma: +0/-0
    • View Profile
Re: z-depth on sprites in a group
« Reply #1 on: Sat, May 15, 2010 »
Well my way of doing it (it so happen my next game involves depth-sort :D), is overriding the update() and add members.sortOn() after the super.update(). I know this maybe not the best way, but it works and my game, hopefully, will not have like 1000 object on the screen that needed to be sorted. Well if you want to use my way, you could probably add a "dirty" flag, so you don't have to sort all the time.

hima

  • Member
  • **
  • Posts: 96
  • Karma: +0/-0
    • View Profile
    • My Dev Blog
Re: z-depth on sprites in a group
« Reply #2 on: Sat, May 15, 2010 »
I did something similar to L_O_J idea too, but it's difficult when the object can move to different z-axis. So I made a group of FlxGroup instead, something like a group of layers.

cai

  • Contributor
  • ****
  • Posts: 465
  • Karma: +0/-0
  • the illest of villains
    • View Profile
    • Brandon Cash
Re: z-depth on sprites in a group
« Reply #3 on: Sat, May 15, 2010 »
What happens if you just put it in the middle of the FlxGroup's members?

Code: [Select]
function addChildAt(Child:FlxObject, Position:int)
{
    var begginning:Array = members.slice(0, Position);
    var end:Array = members.slice(Position);
    members = beginning.concat(Child, end);
}

Note that I just wrote this all in here, so it probably won't work very first try.. but shouldn't be too hard to get working.  Provided, of course, that my first statement in this post has any bearing on z-order.
Follow me on Twitter | Come join us at #flixel on irc.freenode.net!

Beppo5

  • Member
  • **
  • Posts: 37
  • Karma: +0/-0
    • View Profile
Re: z-depth on sprites in a group
« Reply #4 on: Sun, May 16, 2010 »
I got this from some other forum post.  It was for an older version of flixel.  It works like a charm.   
Code: [Select]
package com.Utils
{
import org.flixel.FlxGroup;
import org.flixel.FlxObject;


public class FlxZLayer extends FlxGroup
{

public function order (a:FlxObject,b:FlxObject):int{
if (a.y + a.height > b.y + b.height)
return 1;
else return -1;
}

override public function render():void
{
members.sort(order);
var cl:uint = members.length;
for(var i:uint = 0; i < cl; i++)
if((members[i] != null) && members[i].exists && members[i].visible) members[i].render();
}

}
}

Then just add your sprites to this group. 

Neph

  • New Member
  • *
  • Posts: 1
  • Karma: +0/-0
    • View Profile
Re: z-depth on sprites in a group
« Reply #5 on: Fri, Jul 2, 2010 »
This is exactly what I was looking for (thanks Beppo5!).

Unfortunately, I was using the (x,y) of a sprite to mark its "ground" location, using the offset to move the sprite upwards, and Beppo5's code doesn't consider the offset.  So for those who are doing the same thing, here's a modified version of Beppo5's code that honors the offset value:

Code: [Select]
package utils
{
import org.flixel.FlxGroup;
import org.flixel.FlxObject;
import org.flixel.FlxSprite;


public class FlxZLayer extends FlxGroup
{

public function order (a:FlxObject,b:FlxObject):int {
var ah = a.y + a.height;
var bh = b.y + b.height;
if (a is FlxSprite) ah -= (a as FlxSprite).offset.y;
if (b is FlxSprite) bh -= (b as FlxSprite).offset.y;
if (ah > bh) return 1;
else return -1;
}

override public function render():void
{
members.sort(order);
var cl:uint = members.length;
for(var i:uint = 0; i < cl; i++)
if((members[i] != null) && members[i].exists && members[i].visible) members[i].render();
}

}
}

ywp

  • Member
  • **
  • Posts: 38
  • Karma: +0/-0
    • View Profile
Re: z-depth on sprites in a group
« Reply #6 on: Fri, Jul 2, 2010 »
I saw this over at the dojo:

Code: [Select]
override public function update():void
{
super.update();
 
//Ascending "y" sort is a useful way to get Zelda-like visuals,
// where objects lower on the screen are drawn in front of objects higher on the screen.
this.defaultGroup.sort("y",FlxGroup.ASCENDING);
}