Having problem while rendering different background image layers using for loop

This is kinda weird problem , I’m trying to create a parallax background for a 2D game,
so ofcourse I would need different layers of background to get the effect, and so I thought of creating a list which contains each of this layer using a for loop (i thought it would be efficient just to create a loop and add all the layers to be in one list) And yes it does load and render the image, but except for the first layer it loads, all the other background layers are of very low quality why so

When i load them each layer without using a for loop, it does give back crips images.

As you can see there is a clear difference in the image quality among them, eventhough they are the same image.
My code is a bit shaby but this is my game file

from direct.showbase.ShowBase import ShowBase
from panda3d.core import loadPrcFileData
from direct.task import Task
from panda3d.core import Texture,TransparencyAttrib

prc_data = """
show-frame-rate-meter 1
win-size 1280 720
window-title Sky

class MyApp(ShowBase):

    def __init__(self):

        def background_layers(): #This function tries to load and render background layers with the help of ApplyTextoModel functio
            self.layers = []
            num = 2 # number of layers

            #Loading backgrounds
            for i in range(num):
                layer = self.ApplyTextoModel('models/plane.egg',f'city/{6+i*-1}.png',True,True,[1280/5,720/5])

            #rendering backgrounds
            for i in range(num):
                obj = self.layers[i]


    def ApplyTextoModel(self,obj_loc,tex_loc,true_size,transparency,obj_res):
        obj = self.loader.loadModel(obj_loc)
        tex = self.loader.loadTexture(tex_loc)

        if transparency:

            if true_size:
                print("Texturing Successfully applied",true_size)

                print("True_size not applied",)

            print("Texturing Failed")


app = MyApp()

If anyone knows how to fix this please guide me through.

If I’m looking at the correct issue, then I’d say that the problem is likely one of render-order and transparency.

Specifically, it looks like your “foreground” layer is being rendered before your “background” layer. This causes semi-transparent regions in the “foreground” layer to be rendered with just the grey clear-colour behind them, producing the grey “outline” that you see. And the “foreground” layer is (as per usual) being rendered also into the depth-buffer. Where it is so rendered, the background is then prevented from rendering–hence the grey “outline” remains.

Now, the exact reason for this order of rendering depends perhaps on some specifics of your models, and thus what culling bin they’re being automatically assigned to.

What I’d suggest, then, is the following:

  • First, place your layers in a culling bin that renders its objects in a fixed drawing-order. Since this is for a background, I’d suggest the “background” bin.
    • Specifically–and if I recall correctly–give layers further back a lower drawing-order, and layers further forward a higher drawing order
    • See this manual page for details
  • And second, put a little bit of space between your layers.
    • This may help to prevent any clashes in the depth-buffer (“z-fighting”) that may occur.

Alternatively, you could just put a little space between layers and then place them into the “transparent” bin. That bin automatically and continuously sorts its contents by distance to the camera.

However, you may want to put other elements into that bin at some stage, and these layers don’t really need constant automatic sorting, so I’d still suggest the “background” bin, myself.

1 Like

Yeah, adjusting the render order did the job. Hope I would be able to showcase my project in upcoming months.

1 Like