Я поместил Rows
внутри Grid
с соответствующим размером, но когда я изменяю ориентацию устройства на горизонтальную, у него нет прокрутки, и пользователь не может получить доступ к нижним элементам управления. Когда я добавляю Content
или ScrollView
, Rows
теряет свои размеры. Это работает только когда я добавляю ScrollView
вокруг Container
, но тогда Header
тоже можно прокручивать, и я этого не хочу. Как сделать Grid
тег прокручиваемым по горизонтали?
Вот код:
const LoginScreen = props => {
console.log(props);
return (
<Container>
<Header>
<Left>
<Button transparent onPress={() => props.navigation.goBack()}>
<Icon name="arrow-back" />
</Button>
</Left>
<Body>
<Title>Login</Title>
</Body>
<Right />
</Header>
<Grid>
<Row size={1} />
<Row size={2}>
<Col>
<Button full iconLeft primary style={{margin: 15}}>
<Icon name="logo-google" />
<Text> Login with Google </Text>
</Button>
</Col>
</Row>
<Row size={3}>
<Col>
<Form>
<Item floatingLabel>
<Label>Email</Label>
<Input />
</Item>
<Item floatingLabel last>
<Label>Password</Label>
<Input secureTextEntry={true} />
</Item>
<Button full primary style={{margin: 15, marginTop: 50}}>
<Text> Login </Text>
</Button>
{/* <Button full light primary>
<Text>Register</Text>
</Button> */}
</Form>
</Col>
</Row>
<Row size={3} />
</Grid>
</Container>
);
};