React Native Metrics

Lib para normalizar medidas em aplicativos react native.

A lib exporta 2 funções

• w
• ww

E dois valores que correspondem a largura e altura do dispositivo.

• width
• height

w - Função

Recebe até 4 parametros e retorna uma string, essa função é boa para ser usada com styled components pois já retorna o número normalizado concatenado com 'px'.

w(n1: number, n2?: number, n3?: number, n4?: number): string
w(16) > 16px

Essa função pode ser usada de maneira semelhante ao uso do css padrão no styled components.

/* css default - top | right | bottom | left */
padding: 2px 2px 0 1px;

Styled Components

padding: ${w(8)}; // 8px - top | right | bottom | left
padding: ${w(8, 16)}; // 8px - top and bottom | 16px - left and right

ww - Função

Recebe dois paramêtros, sendo o segundo opcional e retorna um número normalizado baseado na largura ou altura do dispositivo. Se o segundo paramêtro não for passado a função irá usar a largura como base.

w(size: number, based?: 'width' | 'height'): number

width - valor

Contém a largura do dispositivo

height - valor

Contém a altura do dispositivo