iway1 / react-native-keyboard-avoider

MIT License
42 stars 2 forks source link

Can you expose ref property? #13

Open borisjwork opened 4 months ago

borisjwork commented 4 months ago

Hello,

I am migrating one project and I find this library very useful. I need to use scrollTo function from native ScrollView. Because of that, I need the possibility to set ref and use scrollTo function. Can you do this?

Bialson commented 3 weeks ago

You can expose ref by yourself in your local package files.

Inside package files in KeyboardAvoiderScrollView.tsx add the following line in props type definition:

// * node_modules/@good-react-native/keyboard-avoider/src/components/KeyboardAvoiderScrollView.tsx

type Props = ScrollViewProps & CommonProps & {
    /**
     * What to do when the keyboard hides on iOS.
     * @option 'stay' - *Default* scroll view will not move when the keyboard hides (it will stay where it is.)
     * @option 'revert' - Scroll view will return to its original position when the keyboard hides. 
     */
    iosHideBehavior?: 'stay' | 'revert',
    scrollViewRef?: AnimatedRef<AnimatedScrollView>; //<- this line
}

Then change the ref to be passed prop in line 39:

const scrollviewRef = props.scrollViewRef;

To create ref in parent component write the code as below and then pass it to KeyboardAvoiderScrollView component:

const scrollViewRef = useAnimatedRef<ScrollView>();