React native React Native-背景图像应与文本一起滚动
我有背景透明图像(截图中的浅蓝色)。问题是,当我在文本框中键入内容时,会出现一个垂直滚动条,表单会向上移动一点。背景是否也可能随着滚动而移动React native React Native-背景图像应与文本一起滚动,react-native,React Native,我有背景透明图像(截图中的浅蓝色)。问题是,当我在文本框中键入内容时,会出现一个垂直滚动条,表单会向上移动一点。背景是否也可能随着滚动而移动 #1-屏幕截图中是移动的表单 #2-是背景图像 这是代码 <Container style={styles.container}> <ImageBackground source={loginbackground} style={{width: '100%',height:'100%' }}>
#1-屏幕截图中是移动的表单
#2-是背景图像 这是代码
<Container style={styles.container}>
<ImageBackground source={loginbackground} style={{width: '100%',height:'100%' }}>
<Content>
<View style={{marginTop:margint,paddingLeft:30,paddingRight:30}}>
<View style={{marginTop:10}}>
<Item style={{backgroundColor:'rgb(149,197,69)',borderRadius:8,borderWidth:1,borderColor:'rgb(117,170,70)'}}>
<Image source={emailicon} style={{height:20,width:20,marginLeft:10,marginRight:10}}/>
<Input placeholder="Email" value={this.state.username} onChangeText={ (text) => this.setState({ username: text }) } placeholderTextColor="rgb(240,240,240)" />
</Item>
</View>
<View style={{marginTop:15}}>
<Item style={{backgroundColor:'rgb(149,197,69)',borderRadius:8,borderWidth:1,borderColor:'rgb(117,170,70)'}}>
<Image source={passwordicon} style={{height:20,width:20,marginLeft:10,marginRight:10}}/>
<Input placeholder="Password" secureTextEntry={true} value={this.state.Password} onChangeText={ (text) => this.setState({ Password: text }) } placeholderTextColor="rgb(240,240,240)" />
</Item>
</View>
{this.state.Loading==true?
<ActivityIndicator
animating={true}
style={styles.indicator} />
:
<View>
<View style={{flexDirection:'row',justifyContent:'center',marginTop:15}}>
<View style={{width:'13%',justifyContent:'center'}}>
<TouchableOpacity onPress={() => this._toggleRememberme()}>
<Image source={this.state.isrememberme?checkboxcheck:checkboxuncheck} style={{width:28,height:28}}/>
</TouchableOpacity>
</View>
<View style={{width:'41%',justifyContent:'center'}}>
<Text onPress={() => this._toggleRememberme()} style={{fontSize:17,color:'rgb(56,56,56)'}} >Remember me</Text>
</View>
<View style={{width:'46%',justifyContent:'center'}}>
<Text onPress={() => this.props.navigation.navigate("forgotpass")} style={{textAlign:'right', fontSize:17,color:'rgb(56,56,56)'}} >Forgot password?</Text>
</View>
</View>
<Text onPress={() => this.props.navigation.navigate("signup")} style={{textAlign:'center', textDecorationLine:'underline', fontSize:17,color:'rgb(56,56,56)',marginTop:15}} >Create an Account</Text>
<Button onPress={() => this.signin()} block style={{backgroundColor:'rgb(107,29,43)', marginTop:15,height:50, borderRadius:8,borderWidth:1,borderColor:'rgb(117,170,70)'}}>
<Text style={{color:'#fff',fontSize:19}}>Login</Text>
</Button>
</View>
}
</View>
</Content>
</ImageBackground>
</Container>
this.setState({username:text})占位符textcolor=“rgb(240240)”/>
this.setState({Password:text})占位符textcolor=“rgb(240240)”/>
{this.state.Loading==true?
为了澄清,您希望窗体在图像背景上方显示为固定,并且窗体和图像背景在滚动时一起移动。因此,当前您的背景是固定的,但窗体在图像背景上方并独立于背景滚动
我只是想确定你的问题是否正确:)
我认为当你使用ImageBackground时,它总是以这种方式运行,因此就是“背景”。如果你想让窗体随图像移动,你可以尝试用“绝对”来定位窗体放置在常规图像组件的顶部。您可能希望尝试使用react-native元素或react-native纸张,因为它们具有卡片和表面组件,这有助于实现此行为
我意识到这不是一个非常明确的答案,但我希望它在某种程度上有所帮助。此外,您可能只想检查您所使用的组件的任何样式道具,以及查看ImageBackground上的文档
很抱歉,我不能给你一个更好的答案。图像和文本应该一起滚动,所以不确定如果不是ImageBackground,我应该使用什么?