2D Scene background

Hello.

I need to draw seamless tiled background bitmap as scrolling background for 2D scene.

It seems like I cannot find suitable example.

You can draw a tiling texture by using TDrawableImage to draw multiple pieces of texture on the screen. I added an example showing this, see https://github.com/castle-engine/castle-engine/blob/master/examples/images_videos/background_tiling.lpr .

(An alternative would be to use a geometry (like IndexedFaceSet) with texture coordinates such that the texture will be repeated multiple times. I tried it, but it seemed like more work and less flexibility for this particular use-case.)

1 Like

Thanks a lot, I will try.
Actually, yesterday I already found similar approach in castle-view-image project. And seems like it covers my needs.

But out of curiosity, can I manipulate texture coordinates on a quad/mesh?

But out of curiosity, can I manipulate texture coordinates on a quad/mesh?

Sure. See the example “Example in Pascal (build a textured rectangle)” on https://castle-engine.io/x3d_implementation_geometry3d.php#section_example_pascal_rect . Using TextureCoordinate.SetPoint this example passes simple texture coordinates (0 or 1), but you could as well pass there coordinates that cause the texture to repeat, and start at an arbitrary offset.

E.g. these texture coordinates would display the texture repeated 10 times, starting in the middle of the texture image:

 TextureCoordinate.SetPoint([
    Vector2(0.5, 0.5),
    Vector2(10.5, 0.5),
    Vector2(10.5, 10.5),
    Vector2(0.5, 10.5)
  ]);

Using this approach, you could also achieve what you need.

P.S. When looking at https://github.com/castle-engine/castle-view-image/blob/master/castle-view-image.lpr , please note that it’s somewhat old code :slight_smile: The approach there to draw tiling image is not optimal, and it’s probably complicated by some specific needs of castle-view-image. The example in https://github.com/castle-engine/castle-engine/blob/master/examples/images_videos/background_tiling.lpr does this in more straightforward fashion, and is more optimal, you can possibly copy-paste the TTilingBackground class into your project and just use it after some adjustments :slight_smile: