marudy / react-native-responsive-screen

Make React Native views responsive for all devices with the use of 2 simple methods
MIT License
1.55k stars 140 forks source link

Feature Request: Able to provide viewport sizes #149

Open quicksilverr opened 1 year ago

quicksilverr commented 1 year ago

Hey, a slight suggestion @marudy

If we could give the option, to provide the sizes that we get from our designs directly to the functions that would be better.

I have written like a code snippet, which would explain better.

import _ from 'lodash';
import {
  widthPercentageToDP,
  heightPercentageToDP
} from 'react-native-responsive-screen';

const VIEWPORT_HEIGHT = 828;
const VIEWPORT_WIDTH = 414;
export const wp = (width: number): number => {
  const widthPercentage = (width / VIEWPORT_WIDTH) * 100;
  return _.ceil(widthPercentage);
};

export const hp = (height: number): number => {
  const heightPercentage = (height / VIEWPORT_HEIGHT) * 100;
  return _.ceil(heightPercentage);
};