brentvatne / signature-example

OUTDATED - this repo is not maintained and will not work as-is if you clone it. The underlying technique should still work but you will have to read the code to understand
7 stars 9 forks source link

Outdated #1

Open dangnelson opened 7 years ago

dangnelson commented 7 years ago

Having a hard time getting this to run in the latest version of Expo. I tried updating the packages, but am getting an "unsupported version of Expo (SDK 10.0.0) error.

chongdog83 commented 6 years ago

This example works great by itself but when I try to bring the code into my expo app, the signature is off by about 100px vertically, I sign but it draws about 100px below my finger. And then the paths don't save. Any chance it could be updated to use the latest version of expo?

chongdog83 commented 6 years ago

The signature being off by 100px had to do with a compatibility issue with React Navigation. Still trying to figure out why the paths don't save. Is there some HOC involved in this that would make that not work?

chongdog83 commented 6 years ago

@brentvatne Any chance you know why this example seems to only work using the expo @expo/ex-navigation? This is the only signature pad example I can find that doesn't require using a native library (aka the only example that will work with expo), and it works fantastic, until you try to use it with React Navigation or React Router Native.

brentvatne commented 6 years ago

Hi @chongdog83 - I don't have time to maintain this and I'm no longer familiar with the code. I updated the repo description accordingly:

OUTDATED - this repo is not maintained and will not work as-is if you clone it. The underlying technique should still work but you will have to read the code to understand

If you come up with a solution that works in all environments I'd be happy to redirect people to your repo/post/whatever with that information!

chongdog83 commented 6 years ago

Figured it out, in SignatureView.js, line 96, change it to this and it will work with newer versions of Expo

        { this.state.donePaths.map((donePaths, index) => {
            return (
              <Svg.Path
                key={donePaths.key}
                d={donePaths.props.d}
                stroke="#000000"
                strokeWidth={4}
                fill="none"
              />
            );
        })
      }