gregory Posted November 11, 2021 at 12:19 PM Report #624552 Posted November 11, 2021 at 12:19 PM estou a seguir o seguinte tutorial: https://www.youtube.com/watch?v=pdFqfOTmd60 na tela do vídeo ele tem tudo alinhado e usando o flex:1 se eu uso flex 1 tudo que esta na tela, fica fora das bordas segue logo abaixo o meu código: import React, { useState, useEffect } from 'react'; import { View, Text, Image, TextInput, TouchableOpacity, StyleSheet, KeyboardAvoidingView, Animated } from 'react-native'; import { StatusBar } from 'react-native'; export default function App() { const [offset] = useState(new Animated.ValueXY({ x: 0, y: 80 })) useEffect(() => { Animated.spring(offset.y, { toValue: 0, speed: 4, bounciness: 30, useNativeDriver: true, }).start(); }, []); return ( <KeyboardAvoidingView style={styles.background}> <StatusBar hidden={true} translucent={false} networkActivityIndicatorVisible={true} /> <View style={styles.containerLogo}> <Image source={require('./images/logo1.png')} /> </View> <Animated.View style={[styles.container, { transform: [{ translateY: offset.y }] }]}> <TextInput style={styles.imput} placeholder="Email" autoCorrect={false} onChangeText={() => { }} /> <TextInput style={styles.imput} placeholder="Senha" autoCorrect={false} onChangeText={() => { }} /> <TouchableOpacity style={styles.btnSubmit}> <Text style={styles.submitText} >Entrar</Text> </TouchableOpacity> <TouchableOpacity style={styles.btnRegister}> <Text style={styles.RegisterText} >Criar Conta</Text> </TouchableOpacity> </Animated.View> </KeyboardAvoidingView> ); } const styles = StyleSheet.create({ background: { backgroundColor: 'black', alignItems: 'center', justifyContent: 'center', backgroundColor: '#191919' }, containerLogo: { justifyContent: 'center', alignItems: 'center', }, container: { paddingBottom: 50, alignItems: 'center', justifyContent: 'center', width: '90%', }, imput: { backgroundColor: '#FFF', width: '90%', marginBottom: 15, color: '#222', fontSize: 17, borderRadius: 7, padding: 10 }, btnSubmit: { color: 'blue', width: '90%', height: 45, alignItems: 'center', justifyContent: 'center', borderRadius: 7, }, submitText: { color: '#FFF', fontSize: 18 }, btnRegister: { marginTop: 10, }, RegisterText: { color: 'white' } }); esqueci de avisar que se eu tirar o flex 1,consigo ver somente metade da tela
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now