'ScrollView jump up and down on first click or focus

I am having trouble making this work and I have no Idea why this is happening.

I am using @alentoma/react-native-selectable-text inside a scrollView but when the text get focus or I click on it. The scrollview bounce up and down once.

@alentoma/react-native-selectable-text is using ReactTextView on android.

Here is the code

      <ScrollView
        ref={(c) => {
          if (c) {
            ref.current = c;
            scrollTo();
          }
        }}
        onScrollBeginDrag={() => {

          clearTimeout(onScrollTimeout.current);
          scrollable.current = true;
        }}
        onScrollEndDrag={() => {

          clearTimeout(onScrollTimeout.current);
          onScrollTimeout.current = setTimeout(() => {
            scrollable.current = false;
          }, 1500);
        }}
        onScroll={({ nativeEvent }) => {

          if (!viewPlayer && scrollable.current) {
            onScroll(nativeEvent);
          } else return false
        }}
        contentOffset={{ y: state.content.scrollPos, x: 0 }} contentContainerStyle={!viewPlayer ? { paddingBottom: 400, paddingTop: 150, minHeight: windowHeight } : {}}
      >
        {showAds && !viewPlayer ? (
          <Banner bannerSize="smartBannerPortrait" />
        ) : null}

        <View style={{ minHeight: windowHeight + (!viewPlayer ? 500 : 0), flexDirection: 'row' }} incBackGround={false}>
          <Text
            key={state.content.key + "Text"}
            style={{
              width: windowWidth,
              padding: 0,
              margin: 0,
              minHeight: windowHeight + (!viewPlayer ? 500 : -60),
              paddingTop: (viewPlayer ? 60 : 0),
              flex: 1,
              flexWrap: 'wrap'
            }} onPress={txtClick}>
            <SelectableText
              key={state.content.key}
              highLights={detaliItemSettings.detaliItemSettingsEdit?.filter(x => x.editWith.length > 0 && x.highlightColor && x.highlightColor.length > 1).map(x => { return { text: x.editWith, color: x.highlightColor } })}
              menuItems={globalContext.currentLanguage.novelReaderTextSelectionMenus.map(x => x.text)}
              onSelection={(item) => {
                disableClick.current = false;
                handleContextMenu(item);
              }}
              onLongPress={() => {
                disableClick.current = true
              }}
              onPress={txtClick}
              contentWidth={windowWidth}
              value={state.content} />
          </Text>
        </View>
      </ScrollView>


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source