ReactNative屏幕适配、获取屏幕分辨率

最新推荐文章于 2025-02-07 15:30:35 发布

皆为序幕

最新推荐文章于 2025-02-07 15:30:35 发布

阅读量1.7k

点赞数

分类专栏： react-native 文章标签：屏幕适配获取屏幕大小 react-native react-native

本文链接：https://blog.youkuaiyun.com/hejiasu/article/details/78967812

版权

react-native 专栏收录该内容

17 篇文章

订阅专栏

本文介绍了一种使用Dimensions包来获取屏幕宽度、高度及分辨率的方法，并通过一个具体的React Native组件实例展示了如何在应用中显示这些信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

获取当前屏幕的宽度、高度、分辨率

导入信息一般都用require 关键字
格式：var XXXX = require('XXXX');

//首先要导入Dimensions包
var Diemnsions = require('Dimensions');


export default class App5 extends Component<{}> {
  render() {
    return (
      <View style={styles.container}>

         <Text >当前屏幕的宽：{Diemnsions.get('window').width} </Text>
         <Text>当前屏幕的高：{Diemnsions.get('window').height} </Text>
         <Text>当前屏幕的分辨率：{Diemnsions.get('window').scale} </Text>

      </View>
    );
  }
}

const styles = StyleSheet.create({
  container:{
    marginTop:20,
    marginLeft:20,
    marginRight:20,
    marginBottom:20,
    flex:1,
    backgroundColor:'red',
    justifyContent:'center',
    alignItems:'center',
  },
});