[英]How to make an admob ad not go up with the keyboard in react native (Expo)?
I have implemented admob ads using the react-native-google-mobile-ads
package and I have a few inputs(like in the login screen) where the user types in thier credentials.我已经使用react-native-google-mobile-ads
package 实现了 admob 广告,并且我有一些输入(比如在登录屏幕中),用户可以在其中输入他们的凭据。
When I click on the input, the ad sticks on top of the keyboard and goes up with it.当我点击输入时,广告会粘在键盘顶部并随之上升。 Is it possible so that I can stick the ad to the bottom of the screen always?是否可以让我始终将广告贴在屏幕底部?
Here is an image showing what is currently happening:这是一张显示当前正在发生的事情的图像:
Current code:当前代码:
render() {
return (
<View style={styles.container}>
{this.showModal()}
<ScrollView>
<BTex style={styles.title}>Login</BTex>
<Tex style={styles.sub}>Please sign in to continue</Tex>
<Tex style={styles.label}>Email</Tex>
<TextInput
style={styles.input}
placeholder="example@email.com"
placeholderTextColor={"#BBBBBB"}
onChangeText={(text) => {
this.setState({ email: text });
}}
keyboardType={"email-address"}
keyboardAppearance={"dark"}
autoCapitalize={"none"}
/>
<Tex style={[styles.label, { marginTop: RFValue(25) }]}>Password</Tex>
<TextInput
style={styles.input}
placeholder="VerySecurePassword123"
placeholderTextColor={"#BBBBBB"}
onChangeText={(text) => {
this.setState({ password: text });
}}
keyboardType={"default"}
keyboardAppearance={"dark"}
secureTextEntry={true}
autoCapitalize={"none"}
/>
<TouchableOpacity
style={styles.loginCTA}
onPress={() => this.login()}
>
<Tex style={styles.buttonText}>Login</Tex>
</TouchableOpacity>
<TouchableOpacity
style={{
alignSelf: "center",
marginTop: RFValue(15),
marginBottom: RFValue(7),
}}
onPress={() => this.setState({ isModalVisible: true })}
>
<Tex style={{ fontSize: RFValue(15) }}>
Create an account instead
</Tex>
</TouchableOpacity>
</ScrollView>
<Advert /> // The ad component
</View>
Thanks in advance!提前致谢!
So the answer to your question is relatively simple, just move the Advert
Component into the ScrollView like so:所以你的问题的答案相对简单,只需将Advert
Component 移动到 ScrollView 中,如下所示:
<ScrollView>
...
</TouchableOpacity>
<Advert />
</ScrollView>
</View>
That should cause the ad to stay at the bottom of the page regardless of the keyboard's position.无论键盘输入 position,这应该会导致广告停留在页面底部。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.