erksch / react-native-wheely

An all JavaScript wheel picker for react-native without any native code.
413 stars 59 forks source link

[Bug] Degrees/Radians are being mixed up #73

Open Jeffdude opened 3 months ago

Jeffdude commented 3 months ago

Hi there! Thank you for your work on this project. I noticed one issue that I'm having to patch for my purposes, where the rotationFunction's output is being treated like radians here: https://github.com/erksch/react-native-wheely/blob/4a13bfbfded7a3041372098fc519bc19cca91e86/src/WheelPickerItem.tsx#L44-L48 While simultaneously being treated like degress here: https://github.com/erksch/react-native-wheely/blob/4a13bfbfded7a3041372098fc519bc19cca91e86/src/WheelPickerItem.tsx#L108-L111

My fix for this is simply to rename deg to rad on L109,L110. Full diff is here:

diff --git a/node_modules/react-native-wheely/lib/WheelPickerItem.js b/node_modules/react-native-wheely/lib/WheelPickerItem.js
index 48e7962..b3d1278 100644
--- a/node_modules/react-native-wheely/lib/WheelPickerItem.js
+++ b/node_modules/react-native-wheely/lib/WheelPickerItem.js
@@ -78,11 +78,11 @@ const WheelPickerItem = ({ textStyle, style, height, option, index, visibleRest,
             return range;
         })(),
         outputRange: (() => {
-            const range = ['0deg'];
+            const range = ['0rad'];
             for (let x = 1; x <= visibleRest + 1; x++) {
                 const y = rotationFunction(x);
-                range.unshift(`${y}deg`);
-                range.push(`${y}deg`);
+                range.unshift(`${y}rad`);
+                range.push(`${y}rad`);
             }
             return range;
         })(),

Now I am able to specify rotationFunction={(x) => x*(Math.PI/6)} with visibleRest = 2 meaning that each step is 30 degrees, and the last visible item is rotated 90 degrees, giving my wheel the impression of a true wheel.

If you'd like, I can put up a PR for this fix, as well as adjusting the default of the rotation function to be... (x) => x*(Math.PI/(2*visibleRest)).

Let me know if you have any further questions, or need any more information from me.