React-Native Dynamic Texture context.strokeText(... not working

Bugs
,
1

Hello, Dynamic Texture context.strokeText(**** not working

image

2

cc @BabylonNative but be patient as we are on vacation days.

3

Hey @Suman , how are you doing?

When using Dynamic Textures with text in native there is one little difference when compared with Babylon.js. We don’t actually load any font data by default in native, so before using your text commands you need to make sure your fonts are loaded into Babylon Native. Your can do that by doing the following:

//Get access to the native runtime.
BABYLON.AcquireNativeObjectAsync().then((native) => {

//Load .tiff font file
BABYLON.Tools.LoadFileAsync("https://raw.githubusercontent.com/CedricGuillemet/dump/master/droidsans.ttf", true).then(
            (data) => {
                // Requires data to be ArrayBuffer
                if (data instanceof ArrayBuffer) {
                    
                    //Send font data to be available in native canvas. 
                    native.Canvas.loadTTFAsync("droidsans", data);

                    //Playground example from https://playground.babylonjs.com/#5ZCGRM#2
                    var groundWidth = 20;
                    var groundHeight = 10;

                    var ground = BABYLON.MeshBuilder.CreateGround("ground1", { width: groundWidth, height: groundHeight, subdivisions: 25 }, scene);

                    //Create dynamic texture
                    var textureResolution = 512;
                    var textureGround = new BABYLON.DynamicTexture("dynamic texture", { width: 512, height: 256 }, scene);
                    var textureContext = textureGround.getContext();

                    var materialGround = new BABYLON.StandardMaterial("Mat", scene);
                    materialGround.diffuseTexture = textureGround;
                    ground.material = materialGround;

                    //Add text to dynamic texture
                    var font = "bold 44px droidsans";
                    textureGround.drawText("Grass", 75, 135, font, "green", "white", true, true);
                }
            });
    });

Please let me know if this helps you.

1 Like
4

This is working as expected. But I’m asking for:

textureContext.strokeText('Grass', 75, 135), textureContext.fillText('Grass', 75, 135);

I want to add Stroke on the ‘Grass’ text. That is not working.

Thanks.

5

Thanks for the clarifications @Suman ! I will investigate this.

1 Like
6

Sorry for the long time to reply @Suman .

The situation with context.strokeText( **** is similat to the one with context.createPattern, it is a missing feature because we don’t currently have a native implementation for it. This feature is currently been tracked under Babylon Native’s backlog. We won’t be addressing it immediately since features are dependent on how the Babylon Native team prioritizes things.

Once this feature get implemented I will ping this thread.

5 Likes