Agora há uma coisa que você notará.
Se você inserir uma meta aqui e aqui, eu usarei rapidamente a mesma meta várias vezes,
embora isso me
dê um erro, mas o aplicativo continuará funcionando, então vamos ignorar o aviso na parte inferior.
Se eu inseri isso, muitas vezes o suficiente você vê em algum ponto do tempo, vamos ultrapassar os
limites da tela, mas por padrão, você não pode
rolar e isso é algo que pode ser realmente confuso se você está começando
com o React Native porque, se você
estiver vindo da web, poderá rolar sempre, pois o navegador por padrão tornará sua página rolável se o conteúdo exceder os limites
da página. Aqui, não
é a mesma
coisa, você não consegue rolar apenas porque o conteúdo ultrapassa os limites da tela,
em vez disso, seu conteúdo não está mais acessível.
Agora, obviamente, isso não é uma opção, é uma experiência de usuário horrível,
queremos ter um conteúdo rolável, mas em aplicativos nativos, você precisa ser explícito sobre o fato de que essa página ou parte dessa página
deve ser rolável e é a mesma em Reagir Nativa, portanto.
Então, aqui, o que podemos fazer é usar outro componente chamado React Native e essa é a visualização de
rolagem e, como o nome sugere, essa é uma visualização rolável.
Então, agora podemos substituir essa visão aqui que contém os itens da lista com a visualização de rolagem. Na vista de rolagem, você também tem propriedades que permitem configurá-lo,
basta posicionar o cursor aqui e clicar
no controle de espaço para ter uma ideia do que você pode definir ou verificar os
documentos oficiais, por
exemplo rolar horizontalmente, mas aqui, eu vou deixar o padrão que é rolagem vertical e
apenas adicionando isso, você vai ver que agora se eu adicionar aprender Reagir Native uma dúzia de vezes aqui, então deixe-me
preencher essa
página, agora isso é rolável como você pode ver, agora posso rolar o meu conteúdo e apenas a parte que
é envolvida na exibição de rolagem.
Poderíamos tê-lo colocado em volta de toda a página, então poderíamos ter substituído essa visão aqui por uma
visualização de rolagem ou envolvê-la com uma visualização de rolagem, para que também
funcionasse, também é algo que podemos fazer e toda a página Então, se
eu adicionar agora Aprenda Reagir Nativo aqui, você verá
que agora a página inteira rola, aqui no iOS você pode até rolar sem itens, esse
é o comportamento padrão do iOS, mas é claro que tudo volta, mas depende de você adicione isso e aqui eu só
quero ter uma subseção da tela que é rolável, então eu só envolvo esta seção com a
visão de
rolagem, mas este é, naturalmente, um componente super importante para qualquer conteúdo onde você não pode garantir que
ele se encaixa no tela.
Agora, é claro, você pode pensar que com todos esses tamanhos de dispositivos disponíveis, você
nunca pode garantir isso, mas há certas partes de conteúdo, como uma entrada e um
botão que você sempre será capaz de encaixar na tela e que também pode ser configurado para redimensionar-se para caber na
tela, enquanto há outro conteúdo, geralmente listas de dados como este aqui onde você não pode garantir e
onde você sabe apenas após 10 ou 20 itens, ele definitivamente irá exceder qualquer tela e essa é a conteúdo
que você deseja incluir em uma exibição de rolagem. Outros conteúdos, como botões de entrada, texto estático
codificado, basicamente
qualquer conteúdo em que você saiba quantos itens terá com antecedência pode ser espremido em uma
tela com as ferramentas certas, ou seja, com flexbox, que também será feito durante todo esse curso. conteúdo gerado
dinamicamente como este, você definitivamente quer uma exibição de rolagem.