Densidades de tela
Densidade de pixel é o cálculo de quantos pixels por polegadas uma tela possui. Quanto maior a densidade, maiores resoluções as telas terão e automaticamente uma melhor qualidade de imagem.
Sobre a densidade de tela
A maior densidade de pixels nas telas nos trouxe uma visualização de imagens e fotos muito mais detalhada como também uma melhor experiência de leitura de textos, principalmente nas línguas baseada em caracteres, como a japonesa e chinesa.
Quanto maior a densidade, significa que cabem mais pixels no mesmo espaço físico de uma tela de resolução comum.
Densidade de tela nos celulares e tablets Android
Com a evolução das tecnologias das telas junto à necessidade de qualidade das imagens apresentadas, a densidade das telas dos celulares precisou aumentar. E no caso dos celulares android, as densidades ficaram altíssimas.
Escalas
As densidades de tela dos celulares e tablets Android possuem um nome técnico que o sistema se baseia em qual assets utilizar em cada resolução.
0.75x = ldpi = 120dpi
1x = mdpi = 160dpi
1.5x = hdpi = 240dpi
2x = xhdpi = 320dpi
3x = xxhdpi = 480dpi
4x = xxxhdpi = 640dpi
As siglas são referentes aos nomes medium density-independent pixels, high density-independent pixels, extra high density-independent pixels, etc.
Ponto de atenção: não confundir a escala DP com a escala SP do sistema do Android. O nome Scale-independent Pixels é utilizado apenas para os tamanhos das fontes. Por exemplo: o texto com tamanho de 16sp.
Densidade de tela dos iPhones e iPads
Com o nome comercial de tela Retina, as telas dos dispositivos da Apple também ganharam altas densidades para exibir fotos e textos com muito mais detalhes ao olho nu.
Escalas
Assim como no Android temos um nome técnico para cada densidade de tela, os iPhones e iPads também possuem um nome, que é o @1x, @2x ou @3x.
O nome comercial dessas densidades de tela é o Retina Display, Super Retina Display e Super Retina XDR.
Densidades dos iPhones:
1x = @1x = ~163dpi
2x = @2x = ~326dpi
3x = @3x = ~460dpi
Densidades dos iPads:
1x = @1x = ~132dpi
2x = @2x = ~264dpi
Desenhe sempre na resolução base
Para facilitar o desenvolvimento e principalmente o desenho das interfaces, sempre desenhamos na resolução base.
Desenhar como antigamente
Imagina ter que desenhar as telas para cada resolução diferente. Isso seria uma loucura diante a quantidade enorme de resoluções que temos hoje.
Para isso, desenhamos e projetamos as interfaces igual a época de quando não tínhamos várias densidades diferentes.
Falar a mesma língua do desenvolvimento
Ao desenhar os objetos da interface com a mesma medida e os mesmos valores que o desenvolvedor irá adicionar no código, isso acaba facilitando muito o desenvolvimento.
E esses elementos ficarão com o mesmo tamanho do que foi projetado, sem nenhuma surpresa ou problema.
Continue lendo…
