首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

PixelRatio

PixelRatio类允许访问设备像素密度。

获取正确大小的图像

如果您使用的是高像素密度设备,则应该获得更高分辨率的图像。一个好的经验法则是将您显示的图像的大小乘以像素比率。

代码语言:javascript
复制
var image = getImage({
  width: PixelRatio.getPixelSizeForLayoutSize(200),
  height: PixelRatio.getPixelSizeForLayoutSize(100),
});
<Image source={image} style={{width: 200, height: 100}} />

像素网格贴紧

在iOS中,您可以为任意精度的元素指定位置和尺寸,例如29.674825。但是,最终物理显示屏只有固定的像素数量,例如iPhone 4的640×960或iPhone 6的750×1334。iOS会尽量忠实于用户的价值,将一个原始像素分散为多个像素欺骗眼睛。这种技术的不足之处在于它使得生成的元素看起来模糊。

在实践中,我们发现开发人员不希望使用此功能,他们必须通过手动舍入来解决此问题,以避免出现模糊元素。在React Native中,我们会自动四舍五入所有像素。

我们必须小心谨慎。你不想在积累舍入误差的同时使用四舍五入的值。即使有一个舍入误差也是致命的,因为一个像素边界可能会消失或是两倍大。

在React Native中,JavaScript中和布局引擎中的所有内容都可以使用任意精度数字。只有当我们在主线程上设置本地元素的位置和尺寸时,此外,舍入是相对于根而不是父亲完成的,以避免累积舍入错误。

Methods

static get()

返回设备像素密度。一些例子:

  • PixelRatio.get() === 1
    • mdpi Android devices (160 dpi)
  • PixelRatio.get() === 1.5
    • hdpi Android devices (240 dpi)
  • PixelRatio.get() === 2
    • iPhone 4, 4S
    • iPhone 5, 5c, 5s
    • iPhone 6
    • xhdpi Android devices (320 dpi)
  • PixelRatio.get() === 3
    • iPhone 6 plus
    • xxhdpi Android devices (480 dpi)
  • PixelRatio.get() === 3.5
    • Nexus 6

static getFontScale()

返回字体大小的缩放因子。这是用来计算绝对字体大小的比率,所以任何严重依赖于它的元素都应该使用它来进行计算。

如果未设置字体比例,则返回设备像素比率。

目前这只在Android上实现,并反映在设置>显示>字体大小中设置的用户偏好,在iOS上它将始终返回默认的像素比例。@platform android

static getPixelSizeForLayoutSize(layoutSize)

将布局大小(dp)转换为像素大小(px)。

保证返回一个整数。

static roundToNearestPixel(layoutSize)

将布局大小(dp)舍入为与整数个像素对应的最近布局大小。例如,在PixelRatio为3的设备上PixelRatio.roundToNearestPixel(8.4) = 8.33,它恰好对应于(8.33 * 3)= 25像素。

static startDetecting()

// iOS没有运行,但在网络上使用。不应该记录。

扫码关注腾讯云开发者

领取腾讯云代金券