React Native 响应式布局
# 案例
import { Dimensions, PixelRatio } from "react-native";
const { width, height } = Dimensions.get("window");
const standardWidth = 1080;
const standardHeight = 1920; // 添加标准高度
const scaleWidth = width / standardWidth;
const scaleHeight = height / standardHeight;
const scale = Math.min(scaleWidth, scaleHeight);
export function rWidth(px: number) {
return PixelRatio.roundToNearestPixel(px * scale);
}
export function rHeight(px: number) {
return PixelRatio.roundToNearestPixel(px * scale);
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
上次更新: 2024/08/14, 04:14:33