[FIXED] How to fix react-native-signature-canvas overflow on Android?

Issue

I'm having a problem that the canvas of react-native-signature-canvas is overflowing the screen.

src="https://i.stack.imgur.com/6UTPE.jpg" width="400">

I tried to use {paddingRight: 50} to SignatureScreen component but the result is white space on the right side of the image.

I tried to modify margin, position, padding, also using a parent View component without success. Any help is much appreciated.

I'm running the app with ExpoGo on a Samsung Galaxy Tab S6 Lite with Android 12.

Solution

i faced the same issue in galaxy tab and fixed it by adding position fixed in m-signature-pad . Add this style to your webStyle in your Signature component - .m-signature-pad{position: fixed;margin:auto; top: 0; width:100%;height:50%}body,html{position:relative;}

Hope this will help for you.

Answered By - Alok Mahanta
Answer Checked By - - Mildred Charles (ReactFix Admin)