Skip to content

Commit 51cfb6b

Browse files
Mazhar Morshednirsky
authored andcommitted
Set scaling based on smallest dimension (#15)
This allows it so that scaling is done based on the smallest dimention being the width. This fixes the issue that makes it so that rendering isn't overly large when rendering on landscape and changing to portrait or overly small on the inverse orientation change.
1 parent 10bf38d commit 51cfb6b

File tree

1 file changed

+3
-2
lines changed

1 file changed

+3
-2
lines changed

lib/scalingUtils.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
import { Dimensions } from 'react-native';
22
const { width, height } = Dimensions.get('window');
3+
const [w, h] = width > height ? [height, width] : [width, height];
34

45
//Guideline sizes are based on standard ~5" screen mobile device
56
const guidelineBaseWidth = 350;
67
const guidelineBaseHeight = 680;
78

8-
const scale = size => width / guidelineBaseWidth * size;
9-
const verticalScale = size => height / guidelineBaseHeight * size;
9+
const scale = size => w / guidelineBaseWidth * size;
10+
const verticalScale = size => h / guidelineBaseHeight * size;
1011
const moderateScale = (size, factor = 0.5) => size + ( scale(size) - size ) * factor;
1112

1213
export {scale, verticalScale, moderateScale};

0 commit comments

Comments
 (0)