Skip to main content

​
What is Normalization?

Normalization is a process of making the components look consistent and beautiful.

​
How to use Normalization?

1
Go to @/constants/appConstants.tsx file.
2
You’ll see normalize function. For example:
3
    export const ScreenHeight: number = SCREEN_HEIGHT;
    export const ScreenWidth: number = SCREEN_WIDTH;

    export const PADDING: Record<PaddingSize, number> = {
        xxxs: scale(1),
        xxs: scale(2),
        xs: scale(4),
        sm: scale(8),
        md: scale(16),
        lg: scale(24),
        xl: scale(32),
        xxl: scale(40),
        xxxl: scale(48),
    };
4
You can use this constants to make your components look consistent. For Example:
5
    <View style={{ padding: PADDING.md }}>
        <Text style={{ fontSize: FONT_SIZE.lg }}>Hello</Text>
    </View>