Skip to content

Instantly share code, notes, and snippets.

@maiquealmeida
Created December 4, 2019 17:40
Show Gist options
  • Save maiquealmeida/030580ca70ecdc18f3760461dae94646 to your computer and use it in GitHub Desktop.
Save maiquealmeida/030580ca70ecdc18f3760461dae94646 to your computer and use it in GitHub Desktop.
React Native: Redução do formulário e movimentação em scroll até o campo selecionado
import React from 'react';
import {ScrollView} from 'react-native';
import { RootContainer, Content, Scroll } from './styles';
export default function ContentAware({rootStyle, contentStyle, children}) {
return (
<RootContainer style={rootStyle}>
<Scroll style={contentStyle}>
{children}
</Scroll>
</RootContainer>
);
}
ContentAware.defaultProps = {
rootyles: {},
contentStyle: {}
}
import styled from 'styled-components/native';
import { Platform, StatusBar } from 'react-native';
const statusBarHeight = StatusBar.currentHeight;
export const RootContainer = styled.KeyboardAvoidingView.attrs({behavior: 'padding'})`
flex: 1;
`
export const Scroll = styled.ScrollView`
flex: 1;
`
export const Content = styled.SafeAreaView`
flex: 1;
background-color: #fff;
padding-top: ${Platform.OS === "android" ? statusBarHeight : 0}px;
`;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment