PixelRatio
PixelRatio类提供了访问设备的像素密度的方法。
方法
PixelRatio.get():返回设备的像素密度
- PixelRatio.get() === 1
- mdpi Android 设备 (160 dpi)
- PixelRatio.get() === 1.5
- hdpi Android 设备 (240 dpi)
- PixelRatio.get() === 2
- iPhone 4, 4S
- iPhone 5, 5c, 5s
- iPhone 6
- xhdpi Android 设备 (320 dpi)
- PixelRatio.get() === 3
- iPhone 6 plus
- xxhdpi Android 设备 (480 dpi)
- PixelRatio.get() === 3.5
- Nexus 6
PixelRatio.getFontScale():返回字体大小缩放比例
用于计算绝对的字体大小,所以很多深度依赖字体大小的组件需要用此函数的结果进行计算。
如果没有设置字体大小,它会直接返回设备的像素密度。
目前这个函数仅仅在Android设备上实现了,它会体现用户选项里的“设置 > 显示 > 字体大小”。
在iOS设备上它会直接返回默认的像素密度。
以乐视720为例:
PixelRatio.get() = 2.625
字体大小
- 标准
- PixelRatio.getFontScale() = 2.625 (默认)
- 中
- PixelRatio.getFontScale() = 2.887500047683716
- 大
- PixelRatio.getFontScale() = 3.1500000953674316
- 超大
- PixelRatio.getFontScale() = 3.674999952316284
PixelRatio.getPixelSizeForLayoutSize(dp)
将一个布局尺寸(dp)转换为像素尺寸(px)。
一定会返回一个整数数值。
PixelRatio.getPixelSizeForLayoutSize(dp) = Math.round(PixelRatio.get() * dp)
App.js
import React, { Component } from 'react'; import { View, Text, PixelRatio } from 'react-native'; class App extends Component { constructor(props) { super(props); } componentWillMount() { var pixelRatio = PixelRatio.get(); var fontScale = PixelRatio.getFontScale(); var _dp = 5; var pixelSizeForLayoutSize = PixelRatio.getPixelSizeForLayoutSize(_dp); console.log("pixelRatio",pixelRatio) console.log("fontScale",fontScale) console.log("pixelRatio _dp",pixelRatio _dp ) console.log("Math.round(pixelRatio _dp)",Math.round(pixelRatio _dp) ) console.log("pixelSizeForLayoutSize",pixelSizeForLayoutSize) } render() { return (
'pixelRatio', 2.625 'fontScale', 2.625 'pixelRatio _dp', 13.125 'Math.round(pixelRatio _dp)', 13 'pixelSizeForLayoutSize', 13