Sample: Flowing Water with Xenko


#1

I’ve recently been enjoying this engine and I am excited with the move to open source. Something that I’ve been working on recently is figuring out how to implement a water shader. Water is one of those things that really stands out and I was not happy with just a simple flat texture and basic displacement effect.

I went into the process without knowledge of shaders. I had also just started really playing with Xenko. It was a bit of a fight to figure this out but I think I have the basics for a larger feature. With the lack of documentation and examples available for this engine, I thought I would share what I’ve got so far even if it’s rough around the edges. So here it is: https://github.com/TomGroner/XenkoFlowingWater

This is by no means an elaborate example and I have a suspicion that how I’ve done things might not be the best strategy. However it shows all of the pieces needed to render flowing water. I will probably keep working on this example as I discover further improvement. Some of the things that I will be playing with:

  1. I am using a SyncScript to coordinate all of this. It feels like something I should be able to do with a material alone, but I struggled to figure out how to get all of the textures into the shader through interface.
  2. I implemented this as a material that applies to a single procedural plane. This is fine for a simple example but for a larger environment with a lot of water, I am not sure this is the way to go. I will be reviewing adding a custom effect to be added to the rendering pipeline.
  3. The textures used have a dramatic effect on how it looks. I played with a lot of them, and was starting to spend more on finding textures than I was on the code for the sample. I will keep looking for better ones and hopefully give a really nice effect. The sky in particular I want to replace, it’s too green. The sky is what gives most of the color to the water surface.
  4. The sample does not implement varying water height and associated transparency. The example is a simple plane and a depth map sort of setup didn’t make much sense. I might put together a larger scene, perhaps a river or beach, with a shoreline and gradually decreasing transparency on the shore. I think that will look really nice.
  5. The shader compiler has given me some problems at times and I am not sure if it’s how I’ve written something, or if there is a problem with the asset builder. When you get a compile error that mentions a shader, I have found killing the process Xenko.Core.Assets.CompilerApp_ExecServer.exe will resolve the problem for one compile, but I have to keep killing it for additional compiles. I will see if this is something that I am doing and update the sample if I find out it was the code/shader. I’ve found running it from Visual Studio (after at least trying to run it once from Xenko Studio) works the best.

I hope this is helpful!


#2

I am in the middle of working on a larger update that will show a river and a beach with dynamic transparency. A smaller updated I’ve just pushed loades up 4 different sky textures to display how much of a variety the water surface can have based on sky texture being reflected.


#3

This is really cool, keep up the effort.


#4

Doesn’t work for me. It shows a flat normal map texture. I’m on Xenko 3.0.0.3.