1、获取设备宽、高、像素比
import Dimensions from 'Dimensions';
import PixelRatio from 'PixelRatio';
let totalWidth = Dimensions.get('window').width; // 宽度
let totalHeight = Dimensions.get('window').height; // 高度
let pixelRatio = PixelRation.get(); //像素比
2、安卓下Image组件source属性使用uri无法设置本地图片
<Image source={{uri: 'logo.png'}}/>
这样无法设置图片,就按设置了宽高也不行。按照官网上的设置,这样是可以的。我的RN版本是0.44.0,这种方式加载网络图片也是可以的。因为图片uri是变量,所以不可以使用require()来加载图片。
最终采取的方法是将图片放在app中。即将图片文件放在项目目录\\android\app\src\main\res\drawable-xxx
文件夹下。如图。
针对不同分辨率的屏幕建立不同的文件夹。将图片放到其中。然后再项目中引用的时候,直接使用图片的名字,不需要加后缀。比如在drawable-xxhdpi
中我有一个图片名字为zalm.png
,那么再项目中,写法如下:
<Image source={{uri: 'zalm'}} style={{width: 100, height: 100}}/>
3、ScrollView分页时用到的属性(官网上未列出)
<ScrollView
ref="scrollView"
horizontal={true}
showsHorizontalScrollIndicator={false}
pagingEnabled={true}
onMomentumScrollEnd={this.onMomentumScrollEnd}
onScrollBeginDrag={this.onScrollBeginDrag}
onScrollEndDrag={this.onScrollEndDrag}
>
{this.renderImage()}
</ScrollView>
onMomentumScrollEnd
:滚动趋势结束的时候,得到当前的偏移量,除以屏幕宽度,可以得知目前处于第几张图片。
onMomentumScrollEnd = (e) => {
let offsetX = e.nativeEvent.contentOffset.x;
let currentPage = offsetX / totalWidth;
this.setState({
currentPage
})
}
onScrollBeginDrag
:手动滑动的时候,这个时候清除定时器。
onScrollEndDrag
:手指离开页面的时候。重新开始定时器。
ref="scrollView"
:在定时器中,调用ScrollView组件的scrollTo
方法让该组件滑动到相应偏移量。
scrollView.scrollTo({x:offsetX ,y:0, animated: true})