Problemas com CSS e Tags do Próprio Ionic | Ionic 1 parte 1: desenvolvimento de aplicações híbridas mobile

2
respostas

por Thiago De Bonis Carvalho Saad Saud

| 227.7k xp | 65 posts

Universitário em Ciência da Computação

Estou utilizando a versão 2.1.13 e verificando a documentação no própio site do Ionic. Logo abaixo citarei minhas dúvidas e problemas.

Problemas:

1) Eu insiro um CSS, do mesmo jeito que se faz com html5, adiciono um background ele da reflesh no Ionic Lab, a cor do background aparece porem ela some em segundos.

2) Estou utilizando tags do próprio ionic para criar Labels, buttons entre outros, porém algumas tags não funcionam, os botões sãem sem estilo e não saem igual ao do site.

3) Instalei o ionic 2.1 ... de acordo com a documentação do site v2, porém ele contém um index totalmente diferente do que aparece no ionic start server, ele não contém nada dos elementos que está lá, não tem como modificar nada, oque é isso?

Dúvidas:

1) Como resolver as questões a cima?

2) No bootstrap temos o container e grid para configurar para mobile como por exemplo col-ms 12, isto existe no Ionic? Como eu posso utilizar isto de maneira correta?

2 respostas

por Wanderson Macêdo

| 3960.2k xp | 8086 posts

Instrutor Desenvolvedor

02/12/2016

Oi Thiago, vamos quebrar esse seu problemão, poderia ser tópicos diferentes, mas tudo bem.

1 - Pode ser questão de sobrescrita de css, um css define uma regra e outro vem e reescreve a regra, da um inspect nos elementos pra ver o que pode estar acontecendo.

2 - Verifica se não teve problemas ao baixar os componentes do Ionic, se der, faz uma instalação isolada em um novo projeto e testa pra ver se o mesmo acontece.

3 - não entendi bem o que quis dizer, manda link do site e explica melhor o que tá acontecendo.

4 - O Ionic tem seu próprio sistema de GRID, que se assemelha um pouco com o bootstrap, mas não é tão grande quanto o Bootstrap por causa dos contextos, o Bootstrap ataca uma variabilidade de telas muito grande, de TV a Mobile, o Ionic entra só no mobile.

Espero ter ajudado, bons estudos!

por Daniel Omnion

| 1014.4k xp | 1150 posts

04/12/2016

Apenas para complementar a explicação do Grid.

Como o Wanderson citou, o grid do Bootstrap tem um contexto muito amplo, já que num mesmo elemento você pode aplicar classes diferentes, para que, de acordo com a resolução, ocorra a alteração.

No caso do Ionic, o grid é mais simples, por padrão, se você usar a classe "col", o tamanho é proporcional a área disponível. Existem opções para fixar um tamanho predefinido.

No link abaixo tem exemplos de como funciona o grid do Ionic

http://ionicframework.com/docs/components/#grid