react native tab bars

Instalação

Adicione a dependência:

 npm i react - native - tab - bars 

Dependências de pares

IMPORTANTE! Você precisa instalá -los

 "react" : ">= 16.x.x" ,
"react-native" : ">= 0.55.x" ,
"react-native-androw" : ">= 0.0.34"

Uso

Importar

 import { SolidTabBar } from "react-native-tab-bars" ; 

Uso

 < SolidTabBar
  initial = { 0 }
  onChange = { ( data ) => console . log ( data ) }
  tabs = { [
    { id : 0 , text : "All" } ,
    { id : 1 , text : "Birds" } ,
    { id : 2 , text : "Fishes" } ,
    { id : 3 , text : "Tigers" } ,
  ] }
/> 

Tabs Formato de matriz de objetos

 [
  { id : 0 , text : "All" } ,
  { id : 1 , text : "Birds" } ,
  { id : 2 , text : "Fishes" } ,
  { id : 3 , text : "Tigers" } ,
] ;

Configuração - Props

Propriedade	Tipo	Padrão	Descrição
guias	variedade	Array de objeto	Você tem que definir sua matriz de objetos com exemplo formatado como acima
inicial	número	nulo	Guia Padrão selecionado
OnPress	função	padrão	Defina sua própria lógica quando uma guia for pressionada
OnChange	função	padrão	Defina sua própria lógica quando a guia selecionada é alterada
tabwith	número	60	Altere o valor da largura de cada guia
TabPadding	número	5	Altere o valor do preenchimento de cada guia
ShadowStyle	estilo	sombra	Defina seu próprio estilo de sombra para a guia selecionada
ShadowColor	cor	#757575	Altere a cor da sombra atual
ActiveColor	cor	#fbd000	Altere a cor da guia selecionada
inativeColor	cor	transparente	Altere a cor das guias não selecionadas
ActiveTextColor	cor	#fff	Altere a cor do texto da guia selecionada
inactiveTextColor	cor	#000	Altere a cor do texto das guias não selecionadas
Recipiente	componente	Visualizar	Altere o tipo de componente do contêiner principal
estilo	estilo	padrão	Alterar ou substituir o objeto de estilo do contêiner principal

Planos futuros

• LICENÇA
• Opção de componente de barra de guia pontilhada
• Animação
• Desafio datilografado!
• Escreva um artigo sobre a lib

Créditos

Design inspirado em Sina Amiriyam

Autor

Freakycoder, [email protected]

Licença

O React Native Tab Bars está disponível sob a licença do MIT. Consulte o arquivo de licença para obter mais informações.