Skip to content

Instantly share code, notes, and snippets.

@gleydson

gleydson/rn-tranform-percent-to-dp.js

Last active March 1, 2024 06:15
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save gleydson/0e778e834655d1ee177725d8b4b345d7 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save gleydson/0e778e834655d1ee177725d8b4b345d7 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. gleydson revised this gist Mar 8, 2020. 1 changed file with 2 additions and 0 deletions.
    2 changes: 2 additions & 0 deletions rn-tranform-percent-to-dp.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,5 @@
    import { Dimensions } from 'react-native';

    const widthPercentageToDP = widthPercent => {
    const screenWidth = Dimensions.get('window').width;
    const elemWidth = parseFloat(widthPercent);
  2. gleydson revised this gist Oct 29, 2019. No changes.
  3. gleydson renamed this gist Oct 29, 2019. 1 changed file with 0 additions and 0 deletions.
    0 snippets.js → rn-tranform-percent-to-dp.js
    View file
    File renamed without changes.
  4. gleydson created this gist Oct 29, 2019.
    11 changes: 11 additions & 0 deletions snippets.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,11 @@
    const widthPercentageToDP = widthPercent => {
    const screenWidth = Dimensions.get('window').width;
    const elemWidth = parseFloat(widthPercent);
    return PixelRatio.roundToNearestPixel((screenWidth * elemWidth) / 100);
    };

    const heightPercentageToDP = heightPercent => {
    const screenHeight = Dimensions.get('window').height;
    const elemHeight = parseFloat(heightPercent);
    return PixelRatio.roundToNearestPixel((screenHeight * elemHeight) / 100);
    };