Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/three.js/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
React native mediaQuery在react native中不工作_React Native - Fatal编程技术网

React native mediaQuery在react native中不工作

React native mediaQuery在react native中不工作,react-native,React Native,媒体查询在某个点不起作用 我已经写了两次媒体查询,在写第三次时,屏幕大小为“@media(最大设备宽度:360)和(最大设备高度:640)”。它不工作 我刚刚开始编写代码,无法使其正常工作。所以任何帮助对我都是很有价值的 import { MediaQueryStyleSheet } from "react-native-responsive"; ...//code is here. const styles = MediaQueryStyleSheet.cr

媒体查询在某个点不起作用

我已经写了两次媒体查询,在写第三次时,屏幕大小为“@media(最大设备宽度:360)和(最大设备高度:640)”。它不工作

我刚刚开始编写代码,无法使其正常工作。所以任何帮助对我都是很有价值的

    import { MediaQueryStyleSheet } from "react-native-responsive";
      ...//code is here.    
    const styles = MediaQueryStyleSheet.create(
      {
        container: {
          flex: 1
        },
        welcomeImage: {
          width: null,
          height: "83%",
          opacity: 0.5,
          position: "relative",
          resizeMode: "cover",
          alignSelf: "stretch",
          backgroundColor: "#3B3B3B"
        },
        titleContainer: {
          flexDirection: "column",
          alignItems: "center",
          position: "absolute",
        },
        logo: {
          height: 92,
          width: 252,
        },
        tagline: {
          paddingTop: 13,
          alignItems: "center",
          fontSize: 20,
          color: "#FBFBFB",
          textAlign: "center",
          fontFamily: "segoeUI"
        },
      },
      {
        "@media(max-device-width:374) and (max-device-height:811)": {
          welcomeImage: {
            height: "80%"
          },
          logo: {
            width: 226.8,
            height: 82.8,
          },
        }
      },
      {
        "@media(min-device-width:375) and (max-device-height:811)": {
          welcomeImage: {
            height: "80%",
          },
        }
      },
      {
        "@media(max-device-width:360) and (max-device-height:640)": {
          tagline:{
            fontSize:15,
          },    
        }
      },
    );

//它没有显示任何错误。但也不起作用。

你在这方面的问题

@media(max-device-width:360) and (max-device-height:640)
您仅为
最大宽度设置媒体查询

媒体查询模式应为
最小宽度
最大高度

@media (min-device-width : 360) and (max-device-height : 640)
还要确保所有媒体查询的模式都相同


你在这方面的问题

@media(max-device-width:360) and (max-device-height:640)
您仅为
最大宽度设置媒体查询

媒体查询模式应为
最小宽度
最大高度

@media (min-device-width : 360) and (max-device-height : 640)
还要确保所有媒体查询的模式都相同


谢谢您的解决方案,我根据您的建议修改了我的媒体查询。虽然我仍然遇到同样的问题,但可能是设备像素值提取不正确。您必须按照
设备宽度的降序来编写查询。之前我使用的降序宽度没有正确响应我。然后我按升序使用它。谢谢你的解决方案,我根据你的建议修改了我的媒体查询。虽然我仍然遇到同样的问题,但可能是设备像素值提取不正确。您必须按照
设备宽度的降序来编写查询。之前我使用的降序宽度没有正确响应我。然后我按升序使用它。