首页 > 解决方案 > React Native滚动视图在android中不起作用

问题描述

ScrollView在我的 react-native 应用程序中使用 a 。该应用程序在我的 iOS 模拟器中运行良好,但是当我在我的 Android 模拟器中测试时,ScrollView它不起作用。

这是我的 React 组件返回的内容

  <SafeAreaView style={styles.container}>
    <Image
      source={require('../assets/images/logo.png')}
      style={styles.logo}
    />
    <Androw style={styles.shadow}>
      <Text style={[styles.logoText, styles.shadow]}>{NAME}</Text>
    </Androw>
    <Text style={styles.title}>Welcome Back</Text>
    <View style={styles.subContainer}>
      <ScrollView showsVerticalScrollIndicator={false}>
        <Text style={styles.loginText}>Login</Text>

        <View style={styles.textBox}>
          <Input
            // icon="email"
            placeholder="Email or username"
            autoCapitalize="none"
            autoCompleteType="email"
            value={this.state.email}
            onChangeText={(txt) => this.setState({email: txt})}
          />
          <View style={styles.textInput}>
            <Input
              // icon="pass"
              placeholder="Password"
              autoCapitalize="none"
              autoCompleteType="password"
              value={this.state.password}
              onChangeText={(txt) => this.setState({password: txt})}
            />
          </View>
        </View>
        <TouchableOpacity>
          <Text style={styles.forgotPasswordText}>
            Don't remember your password?
          </Text>
        </TouchableOpacity>
        <TouchableOpacity
          style={styles.button}
          onPress={() => console.log(this.state)}>
          <Button text="Login" />
        </TouchableOpacity>

        <Text style={styles.noAccountText}>
          Don't have an account?{' '}
          <Text style={styles.signupText}>Signup</Text>
        </Text>
      </ScrollView>
    </View>
  </SafeAreaView>

标签: react-native

解决方案


你应该把你的子视图包裹在里面

<ScrollView>
  <View>
   .....
  </View>
</ScrollView>

上衣<View>必须有格调flex:1。交替尝试这样做

<ScrollView contentContainerStyle={{ flexGrow: 1 }}>
    ...
</ScrollView>

推荐阅读