React Native - обертывание контейнера приложения в ScrollView - PullRequest
Новая
       20

React Native - обертывание контейнера приложения в ScrollView

0 голосов
/ 21 мая 2019

Я пытаюсь обернуть всю мою навигацию в прокручиваемый контейнер.

Хотя я и пытался, я не могу найти правильную перестановку гибких свойств, style против contentContainerStyle и т. д., что приводит к ScrollView, окружающему контейнер приложения, фактически прокручиваемому.

Все в порядке со следующим: 

class Asdf extends React.Component {
    render() {
        return (
            <View>
                <Text
                    style={{
                        fontSize: 100
                    }}
                >
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                </Text>
            </View>
        );
    }
};

export default class App extends React.Component {
  render() {
    return (
            <ScrollView
                contentContainerStyle={{
                    flexGrow: 1
                }}
            >
                <Asdf />
            </ScrollView>
    );
  }
};

Отображение навигатора и контейнера приложения, хотямгновенно заставляет его «максимизировать» свои возможности прокрутки и выполнять анимацию рикошета на моем iPhone с помощью любого вида прокрутки: 

class Asdf extends React.Component {
    render() {
        return (
            <View>
                                <Text
                    style={{
                        fontSize: 100
                    }}
                >
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
                </Text>
            </View>
        );
    }
};

const
    Hjkl = createStackNavigator({
        Asdf: Asdf
    }),

    Qwer = createAppContainer(Hjkl);

export default class App extends React.Component {
  render() {
    return (
            <ScrollView
                contentContainerStyle={{
                    flexGrow: 1
                }}
            >
                <Qwer />
            </ScrollView>
    );
  }
};

Большое спасибо тому, кто может предоставить, вероятно, одну строкукода, который заставляет это работать должным образом.

Я пытался определить это, действительно.

...