Canvas not updating

[Shahrukh0396]

Hi i am passing the props to canvas for rendering the images but canvas is not updating it self so the first image is showing where as props are usually updated. So Can anyone tell me how to reload the canvas?? so i can able to change the canvas images.

[Kwonkunkun]

same problem :'(

[YanYuanFE]

Can you provide a demo to reproduce the problem?

[Kwonkunkun]

@YanYuanFE Hi! This problem occur only android :'(

In my opinion webView don't reload properly, when props changed. so, I added code in bottom and it is solved

path: node-modules/react-native-signature-canvas/index.js useEffect(()=> { if(webViewRef.current){ webViewRef.current.reload(); } }, [source])

[medmo7]

I put SignatureScreen in state and set it when I need to reload:

const renderDrawer = async (width: number, height: number, question: QuestionData = currentQuestion, bgImgToCanvasRatio = 1, androidHardwareAccelerationDisabled = false) => {
    const ratioSize = await getRatioImageSize(width, height, currentQuestion.question_image)

    const style = `
    .m-signature-pad {box-shadow: none; border: 0px; margin-left: 0px;  margin-top: 0px;} 
    .m-signature-pad--body {
      border: none
    }
    .m-signature-pad--body
    canvas {
    box-shadow: none;
    }
    .m-signature-pad--footer {display: none; margin: 0px;}
    body,html {
      max-width: ${width * bgImgToCanvasRatio}px; height: ${height * bgImgToCanvasRatio}px;}
    `;

    setCanvas(null)
    setTimeout(() => {
      setCanvas(
        <SignatureScreen
          androidHardwareAccelerationDisabled={androidHardwareAccelerationDisabled}
          penColor={penColor}
          ref={ref}
          bgSrc={question.question_image}
          bgWidth={ratioSize.imageWidth}
          bgHeight={ratioSize.imageHeight}
          webStyle={style}
        />
      )
    }, 1000);
  }

[lidiaCirrone]

@Kwonkunkun I had the same issue and solved it by installing [email protected] (if you install the latest one it gives you an error saying that that's the one it expects to find), might be worth a try!