Tilemap floor NOT display before background picture

Question

I am having a little trouble doing something that is supposed to be very simple. I cannot get the floor of my tiles to display above a background picture. However I can get all my other game objects to show from my control pad, to my HUD to even coins and monsters set up in the same tile map. Basically everything appears in front the background like I expect the floor of my tilemap so it looks like im walking on air. I have tried many things like changing which layer i add the background picture or the tilemap floor too, or even tried setting it the same way i set my characters but same results. Tilemap floor is always at the back. Adding my Set up code, Hope it is helpful too solving the problem.

I created this BG sprite since, I wanted my tilemap to scroll vertically or horzi. automatically. So the easiest way I found to do that was to make the tilemap the child of the "bg" and scroll the "bg" hence scrolling the tile map. However, I have tried setting the background as the child of the bg and setting the Z for both of them but that didnt seem to help. Thanks in advance for any help in solving this

@implementation GameLevelScene
{
   SKNode *_worldNode;
  SKSpriteNode *bg;
    SKSpriteNode *bkg;
}

Init

    -(id)initWithSize:(CGSize)size level:(int)level {
      if (self = [super initWithSize:size]) {

     //   [self showBackground];


        NSDictionary *levelData = config[@"levels"][level];


//[show background];
        if (levelData[@"tmxFile"]) {
         [self showBackground];
          _tileMap = [ JSTileMap mapNamed:levelData[@"tmxFile"]];
        }

     //self.backgroundColor = [SKColor colorWithRed:.4 green:.4 blue:.95 alpha:1.0];
//  UIImage *bkgb  =[UIImage imageNamed:@"land.jpg"];
  //  self.position=CGPointZero;
 //   self.anchorPoint=CGPointZero;
 //     self.backgroundColor=[UIColor colorWithPatternImage:bkgb];
        //Above code shows no picture but it changes the color
        [self setUpWorld];
        [self createChar];
        [self controlPadNode];  


   //[show background];
             }
          return self;
        }

setUpWorld

 - (void)setUpWorld

{
          bg =   [SKSpriteNode spriteNodeWithImageNamed:@"bg3"];
 bg.userInteractionEnabled=NO;
  bg.anchorPoint = CGPointZero;
  bg.zPosition=0;
  bg.position = CGPointZero;

  bg.name = @"bg";

   [self addChild:bg];


  _worldNode = [SKNode node];
  if (_tileMap) {
       [bg addChild:_tileMap];
      }
   [bg addChild:_worldNode];  

  self.physicsWorld.contactDelegate = self;

}

create char

- (void)createChar
 {
   _Layer = [[TmxTileMapLayer alloc]
                initWithTmxObjectGroup:[_tileMap
                                        groupNamed:@"LevelOneObjects"]
                tileSize:_tileMap.tileSize
                gridSize:_bgLayer.gridSize];
   [self addChild:_Layer];



}

Create Control

- (SKSpriteNode *)controlPadNode
//-(void)controlPad
{  
  SKSpriteNode *controlPadNode = [SKSpriteNode spriteNodeWithImageNamed:@"controller.png"];
  controlPadNode.position = CGPointMake(100,50);
  controlPadNode.name = @"controlPadNode";
  controlPadNode.zPosition = 1.0;
  [self addChild:controlPadNode];
}

background

-(void)showBackground
{

    bkg =   [SKSpriteNode spriteNodeWithImageNamed:@"desert_land.jpg"];
    bkg.userInteractionEnabled=NO;
   bkg.anchorPoint = CGPointZero;
    bkg.position = CGPointZero;
 bkg.zPosition=-1;
    bkg.name = @"bkg";
//   [self addChild:bkg];
  //[_tileMap addChild:bkg];
  // [_worldNode addChild:bkg];
   [bg addChild:bkg];
}

sangony · Accepted Answer · 2014-05-21T15:52:56.370

1

Set your bkg.zposition to 1 and set your bg.zPosition to 2.

Also, the whole point of having a tile map is NOT to use a gigantic background picture but to instead use tiles.

** Update **

I just tested your code and ran a sample project myself. I assume you are using the Tiled app for your tiles. I ran variations on parents (self, worldNode, etc...) and zPositions. The bottom line is you cannot do it. Tiled does not have an alpha channel for its background color options. So either the background image is covered by the tile map or, in your case, the background image covers the tile map.

Your possible solutions are to either not use Tiled and place your tiles manually or to look for another tile app which has an alpha channel.

edited May 21 '14 at 15:52

answered May 19 '14 at 23:26

sangony

11,636
4
39
55

na, I tried z positions doesnt solve the problem.(nor what you suggested). Secondly. I have not tried it as yet but, since my whole tilemap is scrolling wont is scroll my bk ground as well? – Sleep Paralysis May 20 '14 at 01:09
@SleepParalysis - I have not tried your code so I cannot comment specifically on it. Having read what you are trying to do, I do not think it is the best thing to do. Let me explain, your tiled map is much bigger than your view. Your player will move around your tile map while the view is centered on your player as he moves around. The only way you can keep the background in place is to keep it moving with the player so it always stays centered in your view. This means the background would be a child of your player while the tile map is standalone. – sangony May 20 '14 at 22:10
Ok, thanks for the advise as a result I have changed a few things in my game. However the thing is my tilemap is scrolling along with the player. Say I have something like a cloud. I dont specifically want it too scroll. I may want it's location to be static through the entire level. – Sleep Paralysis May 21 '14 at 01:17
*kick rocks* . Thanks for the second opinion. I was combing thru my code wondering what was going on – Sleep Paralysis May 21 '14 at 17:01

score 0 · Answer 2 · answered May 21 '14 at 17:14

I noticed that where you define the wall properties of the tile if you say

 SKSpriteNode* wall =
    [SKSpriteNode spriteNodeWithColor:[SKColor greenColor]
                                 size:CGSizeMake(w, h)];

the green color will be uptop of the background. Bit of a dirty fix than an answer

Tilemap floor NOT display before background picture

2 Answers2