Dimension的简单使用

这个api主要提供给用户来获取关于设备屏幕的一些信息,咱们可以用这个数值来对咱们的布局进行一些适配的设置。

不多说,先来看一下源码和官方文档是怎么写的:
源码地址
英文官方文档
中文官方文档

static set(dims: {[key:string]: any}) [](http://reactnative.cn/docs/0.22/dimensions.html#set)
这个函数只应该被原生代码调用。.
@param {object} dims 一个简单的字符串作为key的对象,包含了需要设置的尺寸信息。

static get(dim: string) [](http://reactnative.cn/docs/0.22/dimensions.html#get)
初始的尺寸信息应该在runApplication
之后被执行,所以它可以在任何其他的require被执行之前就可用。不过在稍后可能还会更新。
注意:尽管尺寸信息立即就可用,但它可能会在将来被修改(譬如设备的方向改变),所以基于这些常量的渲染逻辑和样式应当每次render之后都调用此函数,而不是将对应的值保存下来。(举例来说,你可能需要使用内联的样式而不是在StyleSheet
中保存相应的尺寸)。
例子:var {height, width} = Dimensions.get('window');

@param {string} dim 想要获取的尺寸信息的字段名。
@returns {Object?} 返回的尺寸信息值。

根据中文的官方文档,可以看到咱们可以通过这个API来获取到屏幕的宽和高,这样可以满足了咱们的大部分的适配需求,但是有时候可能还会考虑到图片的适配,及字体的字体,获取屏幕的宽、高就不够了。不过facebook还是考虑的很周到的,咱们可以来看一下下面这段源码:

dims.window = {

width: windowPhysicalPixels.width / windowPhysicalPixels.scale,

height: windowPhysicalPixels.height / windowPhysicalPixels.scale,

scale: windowPhysicalPixels.scale,

fontScale: windowPhysicalPixels.fontScale,

};

这虽然是set方法里面的一段代码,但是这个方法很清晰的告诉我们,通过window这个key,咱们不止可以获取到width,height的属性,还有scale以及fontScale这两个属性,如果有一定移动端开发经验的工程师来说已经可以猜到这两个属性分别代表的是什么含义。
scale提供的是这个机型的屏幕模式,ios现在提供两种模式分别是2及3,分别是普通机型及plus机型。相应的fontscale就是这个机型的字体模式。
现在咱们可以通过这两种属性去对更多机型的适配。

你可能感兴趣的:(Dimension的简单使用)