Você está aqui: React Native ::: React Native - Componentes de Layout ::: Flexbox |
|
Como usar a propriedade flexDirection do React Native para controlar o alinhamento de componentes em uma ViewQuantidade de visualizações: 3721 vezes |
|
Em algumas situações nós precisamos controlar como os componentes que compõem as Views de nossas telas do React Native serão alinhados. Para isso nós podemos usar a propriedade flexDirection do Flexbox, ou seja, do algorítmo Flexbox do CSS3. A propriedade flexDirection permite os seguintes valores: column - Este é o valor padrão e alinha os elementos filhos de uma View começando da parte superior do container e indo em direção à parte inferior (from top to bottom). row - Alinha os elementos filhos de um View da esquerda para a direita (from left to right). Se a quebra de linha estiver habilitada, então uma nova linha de componentes será criada logo abaixo da linha anterior, recomeçando da esquerda para a direita. column-reverse - Faz o inverso do valor column, ou seja, os componentes filhos serão alinhados começando na parte inferior e indo em direção superior (from bottom to top). row-reverse - Faz o inverso do valor row, ou seja, os componentes filhos da View serão alinhados da direita para a esquerda (from right to left). Se a quebra de linha estiver habilitada, então uma nova linha de componentes será criada logo abaixo da linha anterior, recomeçando da direita para a esquerda. Veja uma aplicação React Native completa na qual temos um container View com três botões Button. Note o uso do valor row para a propriedade flexDirection da View:
|
|
![]() |
|
Veja mais Dicas e truques de React Native |
Dicas e truques de outras linguagens |
E-Books em PDF |
||||
|
||||
|
||||
Linguagens Mais Populares |
||||
1º lugar: Java |