UNPKG

@nexara/nativeflow

Version:

Beautiful, responsive, and customizable UI components for React Native – built for performance and seamless experiences.

103 lines (98 loc) 3.74 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.verticalScale = exports.responsiveFontSize = exports.moderateVerticalScale = exports.moderateScale = exports.horizontalScale = void 0; var _reactNative = require("react-native"); var _ContextManager = require("../components/Provider/ContextManager.js"); const { width: SCREEN_WIDTH, height: SCREEN_HEIGHT } = _reactNative.Dimensions.get('window'); // const GetScalingMode = () => getGlobalContext(); // const scalingMode = useScalingMode(); const isResponsive = true; const guidelineBaseWidth = 350; const guidelineBaseHeight = 680; const [shortDimension, longDimension] = SCREEN_WIDTH < SCREEN_HEIGHT ? [SCREEN_WIDTH, SCREEN_HEIGHT] : [SCREEN_HEIGHT, SCREEN_WIDTH]; const scalingCache = new Map(); // export const fun = () => { // return scalingCache // } const checkIsPhone = size => { if (SCREEN_WIDTH <= 430 && SCREEN_WIDTH >= 375) { return size; } return 0; }; const scale = (size, cacheKey, mode) => { if (checkIsPhone(size)) { return size; } const cacheScaleValue = scalingCache.get(cacheKey) || {}; let finalSize; if (cacheScaleValue?.[size]) { return cacheScaleValue?.[size]; } if (mode === 'partial') { const slowDownRate = SCREEN_WIDTH < 375 ? 2 : 0.40; let scale = (cacheKey === 'hScale' ? shortDimension : longDimension) / guidelineBaseHeight; scale = 1 + (scale - 1) * slowDownRate; let adjustedSize = size * Math.max(scale, 0.80); finalSize = Math.floor(_reactNative.PixelRatio.roundToNearestPixel(adjustedSize)); } else { const baseScaleFactor = cacheKey === 'hScale' ? shortDimension / guidelineBaseWidth : longDimension / guidelineBaseHeight; const clampedScaleFactor = Math.max(0.9, Math.min(baseScaleFactor, 1.2)); finalSize = Math.round(_reactNative.PixelRatio.roundToNearestPixel(size * clampedScaleFactor)); } cacheScaleValue[size] = finalSize; scalingCache.set(cacheKey, cacheScaleValue); return finalSize; }; const horizontalScale = size => { const scalingMode = (0, _ContextManager.getGlobalContext)().scaling.mode; return scale(size, 'hScale', scalingMode); }; exports.horizontalScale = horizontalScale; const verticalScale = size => { const scalingMode = (0, _ContextManager.getGlobalContext)().scaling.mode; return scale(size, 'vScale', scalingMode); }; exports.verticalScale = verticalScale; const moderateScale = (size, factor = 0.5) => { if (isResponsive) { return size + (shortDimension / guidelineBaseWidth * size - size) * factor; } else { return size + factor + 1; } }; exports.moderateScale = moderateScale; const moderateVerticalScale = (size, factor = 0.5) => { if (isResponsive) { return size + longDimension / guidelineBaseHeight * size * factor; } else { return size + factor + 5; } }; exports.moderateVerticalScale = moderateVerticalScale; const responsiveFontSize = fontSize => { if (checkIsPhone(fontSize)) { return fontSize; } const fsCache = scalingCache.get('fs') || {}; if (fsCache?.[fontSize]) { return fsCache?.[fontSize]; } const slowDownRate = SCREEN_WIDTH < 375 ? 2 : 0.20; const screenDiagonal = Math.sqrt(SCREEN_WIDTH ** 2 + SCREEN_HEIGHT ** 2); const baseScreenDiagonal = Math.sqrt(360 ** 2 + 640 ** 2); let scale = screenDiagonal / baseScreenDiagonal; scale = 1 + (scale - 1) * slowDownRate; let adjustedFontSize = fontSize * Math.max(scale, 0.85); const finalSize = Math.floor(_reactNative.PixelRatio.roundToNearestPixel(adjustedFontSize)); fsCache[fontSize] = finalSize; scalingCache.set('vScale', fsCache); return finalSize; }; exports.responsiveFontSize = responsiveFontSize; //# sourceMappingURL=ResponsiveCalculations.js.map