首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >响应本地android状态栏

响应本地android状态栏
EN

Stack Overflow用户
提问于 2022-01-21 08:33:50
回答 4查看 1.4K关注 0票数 0

我刚开始对本机做出反应,我正试图把我的文本放到android设备的状态栏下面。在我的ios设备上,“你好世界!”完全就在状态栏下面,但是在android设备上,"Hello!“就在状态栏里。有人能帮我移动文本吗?这样它就可以在状态栏下面。这是我的代码,以及它现在在我的android设备上的样子。

代码语言:javascript
复制
import React from "react";
import { StatusBar } from "expo-status-bar";
import { StyleSheet,Text,SafeAreaView,Platform } from "react-native";

export default function App() {
  return (
    <SafeAreaView style={styles.container}>
      <Text style={styles.textColor}>Hello World!</Text>
      <StatusBar style="auto" />
    </SafeAreaView>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "rgba(0, 0, 0, 0.7)",
    alignItems: "center",
    paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
  },
  textColor: {
    color: "white",
  },
});

当前android视图

EN

回答 4

Stack Overflow用户

发布于 2022-01-21 08:37:21

SafeAreaView不支持paddingTop尝试将其应用于View

代码语言:javascript
复制
<SafeAreaView style={styles.container}>
  <View style={{ paddingTop: StatusBar.currentHeight }}>
    ...
  </View>
</SafeAreaView>
票数 0
EN

Stack Overflow用户

发布于 2022-08-04 17:11:18

我尝试了一些与反应结合起来的东西--自然状态-酒吧高度。

代码语言:javascript
复制
import {Animated, Platform} from "react-native";
import {getStatusBarHeight} from "react-native-status-bar-height";
import React from "react";

const StatusbarAndroid = () => {
    return <Animated.View style={[{
        minHeight:0,
        height: Platform.OS === 'android' ? getStatusBarHeight() : 0}]}/>;
}

export default StatusbarAndroid;
票数 0
EN

Stack Overflow用户

发布于 2022-08-04 18:33:22

使导入从react本机

代码语言:javascript
复制
import React from "react";
import { StyleSheet,Text,SafeAreaView,Platform, StatusBar } from "react-native";

export default function App() {
  console.log(StatusBar.currentHeight)
  return (
    <SafeAreaView style={styles.container}>
      <Text style={styles.textColor}>Hello World!</Text>
      <StatusBar style="auto" />
    </SafeAreaView>
    
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "rgba(0, 0, 0, 0.7)",
    alignItems: "center",
    paddingTop: Platform.OS === "android" ? StatusBar.currentHeight : 0,
  },
  textColor: {
    color: "white",
  },
});

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/70798426

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档