Typescript error for Expo2DContext

[codeReader52]

Hi experts, I was attempting to initialise the Expo2DContext according to the example in README.md (here) and got some typescript errors on both parameters in the constructor. Currently, the type specified in the constructor is: constructor(gl: number, options: Expo2dContextOptions). Specifically:

• The type of options probably should be optional? This code suggests that we can just plug in a null or undefined and it should default correctly.
• The type of gl is probably not number? From the example in the README.md file, it should really be the input of the onContextCreate props of the GLView component? Maybe ExpoWebGLRenderingContext or at least WebGL2RenderingContext would be more appropriate than number?

Thanks for looking at my queries!!! 🙏 🙏

[natemunk]

I am having the same issue. Were you able to get this resolved?

[egordorichev]

I've been researching this issue, looks like the gl object has contextId property, that is used for the constructor. So

var ctx = new Expo2DContext(gl.contextId, {
  ...
})

[Kana00]

var ctx = new Expo2DContext(gl.contextId, {
  ...
})

This solution doesn't work in some cases when the context needs the functions in gl, it doesn't find them if you put a number... I propose an alternative that I am using for the moment, until this issue is solved

import { ExpoWebGLRenderingContext, GLView } from "expo-gl";
import Expo2DContext, { Expo2dContextOptions } from "expo-2d-context";

interface YOUR_PROPS {}

const options: Expo2dContextOptions = {
  fastFillTesselation: true,
  maxGradStops: 128,
  renderWithOffscreenBuffer: false
}

export const YOUR_COMPONENT: React.FC<YOUR_PROPS> = (props) => {

  const onGLContextCreate = (gl: ExpoWebGLRenderingContext) => {
    // @ts-ignore
    var ctx = new Expo2DContext(gl, options);

    // draw shapes
    ctx.beginPath();
    ctx.arc(40, 40, 40, 0, 2 * Math.PI);
    ctx.stroke();
    ctx.flush();
  };

  return (
    <GLView style={{ width: 80, height: 80, backgroundColor: '#00000011' }} onContextCreate={onGLContextCreate} />
  );
};

[tomdoeslinux]

Something with the TypeScript code is off :/