如何将窗体垂直居中

Question

我想在表格上垂直对齐。

从'React'导入React，{Component}；从“原生基”导入{Container，Header，Content，Form，Item，Input，Button，Text}；从“react native”导入{StyleSheet}；

export default class FormExample extends Component {
    render() {
        return (
            <Container>
                <Content>
                    <Form style={styles.container}>
                        <Item>
                            <Input placeholder="Email" />
                        </Item>
                        <Item last>
                            <Input placeholder="Password" />
                        </Item>
                        <Button block>
                            <Text>Submit</Text>
                        </Button>
                    </Form>
                </Content>
            </Container>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        margin: 25,
        alignItems: "center"
    }

});

我的应用程序看起来像这样。

Answer 1

这是你需要添加到内容道具中的一行

ContentContainerStyle={{flexGrow： 1，验证Content：'center'}}

<Container>
                <Content
contentContainerStyle={{flexGrow : 1, justifyContent : 'center'}}>
                    <Form style={styles.container}>
                        <Item>
                            <Input placeholder="Email" />
                        </Item>
                        <Item last>
                            <Input placeholder="Password" />
                        </Item>
                        <Button block>
                            <Text>Submit</Text>
                        </Button>
                    </Form>
                </Content>
            </Container>
        );