我很年轻，可以在网上搜索本机搜索可以帮助我解决此问题的教程，但还没有找到任何东西。我知道如何将屏幕上的按钮从 A 点移动到 B 点。问题是我似乎无法将它固定在底部以在我的 ios 模拟器的不同外形尺寸上工作。到目前为止，我已经尝试使用 marginTop 将按钮移到屏幕上，但是一旦我将模拟器更改为不同的屏幕尺寸，按钮就会上升一点。我问我是否可以获得任何指导，以了解如何将其设置为在不同的 ios 屏幕上工作。
submitButton: {
height: 85,
flex: 1,
backgroundColor: "#FFBB34",
borderColor: "#555555",
borderWidth: 0,
borderRadius: 0,
marginTop: 200,
justifyContent: "flex-start"
}
上面的代码是我的按钮。
你可以使用绝对位置把东西放在任何你想要的地方......
submitButton: {
position: 'absolute',
bottom:0,
left:0,
}
将放在屏幕底部，左侧....
这是我将浮动按钮放置在屏幕右下角的方式。
return (
<View style={mainConatinerStyle}>
{this.renderSwiper()}
{this.renderFloatingMenu()}
</View>
);
为容器和按钮使用以下样式：
mainConatinerStyle: {
flexDirection: 'column',
flex: 1
},floatingMenuButtonStyle: {
alignSelf: 'flex-end',
position: 'absolute',
bottom: 35
}
输出：
您可以在https://facebook.github.io/react-native/docs/flexbox.html尝试以下代码，直到该链接不再起作用。
基本上，您将屏幕分成 3 块，顶部可滚动，底部可滚动。为了简单起见，下面的代码只是做了 3 个视图（没有滚动，只需用 ScrollView 替换中间的一个，以获得更有用的东西。
import React, { Component } from 'react';
import { AppRegistry, View } from 'react-native';
export default class JustifyContentBasics extends Component {
render() {
return (
// Try setting `justifyContent` to `center`.
// Try setting `flexDirection` to `row`.
<View style={{
flex: 1,
flexDirection: 'column',
justifyContent: 'space-between',
}}>
<View style={{height: 50, backgroundColor: 'powderblue'}} />
<View style={{flex:1, backgroundColor: 'skyblue'}} />
<View style={{height: 50, backgroundColor: 'steelblue'}} />
</View>
);
}