brianzinn / react-babylonjs

React for Babylon 3D engine
https://brianzinn.github.io/react-babylonjs/
809 stars 102 forks source link

how to inject my own derived scene class? #316

Open Chargeuk opened 2 months ago

Chargeuk commented 2 months ago

Hi, Can you tell me the way I can inject my own derived scene class?

Currently, I know that the TSX to create a scene is as follows:

<Engine canvasId="sample-canvas" antialias >
      <Scene onSceneMount={onSceneMount}>
        (other things)
      </Scene>
    </Engine>

is there a way I can push my own derived scene class or instance into the TSX? Thanks

brianzinn commented 2 months ago

You mean like you inherited your own class from babylon.js Scene? Then I would need to add something like a createScene prop that would be passed the canvas. Or the class could be a prop and I could call 'new' on it.

Chargeuk commented 2 months ago

Thanks for answering so quickly 👍 Yes, that is what I mean. A createScene prop would be preferable as there would be more control for the user. I guess the same functionality would be great for Engine too if possible?

Chargeuk commented 2 months ago

Actually, looking at your code, it would be great if the createScene prop method was provided with the engine too

brianzinn commented 1 month ago

hi @Chargeuk - Sorry for dropping this. Been quite hectic lately and I'm trying to cleanup the state of issues.

Do you have time to do a PR? The babylon playground TS works similarly. It would be a new prop maybe like:

 createScene: (engine: Engine | WebGPUEngine, sceneOptions: SceneOptions) => Engine

Then to call that instead of new Scene(...) in Scene.tsx?

It's good to add more extension options like this - out of curiosity - why do you need to make your own derived Scene class?

brianzinn commented 4 weeks ago

I merged in the <WebGPUEngine ... /> code and it is published now, so ready to add this if you have time to see if above will work for your use case. The signature above actually would return a Scene object though - it was a typo.