-
Notifications
You must be signed in to change notification settings - Fork 24.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Modal-StatusBar-Android] Statusbar shows up with setHidden(true) #7474
Comments
Looks like a bug, I never tested StatusBar + Modal, I'll take a look at it when I get some time. |
Any idea about this? I lose background color and translucent properties as well. It looks pretty bad. |
I have the same problem, iOS works fine indeed |
check my comments on #8627 if have any help |
Any updates on this? |
I have the same problem.
|
Idem, same problem. RN: 0.34 |
+1. RN: 0.34 Component 01 (showBar Hide):
TO Component 02:
result: ShowBar SHOW But Component 01 (showBar Hide):
TO Component 02:
result: ShowBar HIDE |
It's amazing that this issue was opened the May 9th and nobody still figured out why it has this behaviour! |
@nihgwu honestly i don't know, and the fact that you explained the cause of this problem in an other issue it's even stranger. |
There are still cases where the statusbar is not updated properly because the activity was null at the time it was updated, I think this happens mostly when moving the app from the background to foreground. I haven't really hit this issue yet since I'm not changing the statusbar much in my apps so I don't have a repro case to try to fix it. If someone wants to spend some time looking into why it happens and possible fixes it would be great. A quick fix I can think of would be to subscribe to AppState and force an update of the statusbar native values at that time when we are sure the activity is available. Edit: confused some issues not sure about this one :) |
I don't have much time to look into this at the moment, I suspect we'd want to change the dialog window flags to match the current statusbar config. We already set some flags here https://github.com/facebook/react-native/blob/master/ReactAndroid/src/main/java/com/facebook/react/views/modal/ReactModalHostView.java#L199 To do that we could try to read flags from the main app window and use the same for the modal. |
+1 RNv: 0.40 |
@janicduplessis I already checked this issue. The reason it doesn't work is because |
Any news about this issue? Still getting it with RN 0.4.2 |
I was able to work around this issue by going into my app's Here's my full styles.xml file for reference:
|
@Traviskn This solution also has a issue, in some time, at bottom of the Modal has a transparent bar , and height equal to StartBar height. |
Still happens at 0.43 version. Any updates? |
Mark! |
Any updates on this? |
I confirm @Traviskn 's way too. this workaround may produce some issue at a particular scene(such as you need status bar shows more frequently than hidden), but it still may be the best way to solve modal status bar problem once for all. |
can use origin android to resolve it ? |
It's resolved,thank you!
魅璃儿
邮箱:beevivo6@gmail.com
签名由 网易邮箱大师 定制
On 07/17/2018 20:32, 板栗17 wrote: can use origin android to resolve it ?
—You are receiving this because you commented.Reply to this email directly, view it on GitHub, or mute the thread.
{"api_version":"1.0","publisher":{"api_key":"05dde50f1d1a384dd78767c55493e4bb","name":"GitHub"},"entity":{"external_key":"github/facebook/react-native","title":"facebook/react-native","subtitle":"GitHub repository","main_image_url":"https://assets-cdn.github.com/images/email/message_cards/header.png","avatar_image_url":"https://assets-cdn.github.com/images/email/message_cards/avatar.png","action":{"name":"Open in GitHub","url":"https://github.com/facebook/react-native"}},"updates":{"snippets":[{"icon":"PERSON","message":"@banli17 in #7474: can use origin android to resolve it ?"}],"action":{"name":"View Issue","url":"#7474 (comment)"}}}
[
{
"@context": "http://schema.org",
"@type": "EmailMessage",
"potentialAction": {
"@type": "ViewAction",
"target": "#7474 (comment)",
"url": "#7474 (comment)",
"name": "View Issue"
},
"description": "View this Issue on GitHub",
"publisher": {
"@type": "Organization",
"name": "GitHub",
"url": "https://github.com"
}
},
{
"@type": "MessageCard",
"@context": "http://schema.org/extensions",
"hideOriginalBody": "false",
"originator": "AF6C5A86-E920-430C-9C59-A73278B5EFEB",
"title": "Re: [facebook/react-native] [Modal-StatusBar-Android] Statusbar shows up with setHidden(true) (#7474)",
"sections": [
{
"text": "",
"activityTitle": "**板栗17**",
"activityImage": "https://assets-cdn.github.com/images/email/message_cards/avatar.png",
"activitySubtitle": "@banli17",
"facts": [
]
}
],
"potentialAction": [
{
"name": "Add a comment",
"@type": "ActionCard",
"inputs": [
{
"isMultiLine": true,
"@type": "TextInput",
"id": "IssueComment",
"isRequired": false
}
],
"actions": [
{
"name": "Comment",
"@type": "HttpPOST",
"target": "https://api.github.com",
"body": "{\n\"commandName\": \"IssueComment\",\n\"repositoryFullName\": \"facebook/react-native\",\n\"issueId\": 7474,\n\"IssueComment\": \"{{IssueComment.value}}\"\n}"
}
]
},
{
"targets": [
{
"os": "default",
"uri": "#7474 (comment)"
}
],
"@type": "OpenUri",
"name": "View on GitHub"
},
{
"name": "Unsubscribe",
"@type": "HttpPOST",
"target": "https://api.github.com",
"body": "{\n\"commandName\": \"MuteNotification\",\n\"threadId\": 141108329\n}"
}
],
"themeColor": "26292E"
}
]
|
@t4deu I can see the issue with react-native |
Ok, fixed by using |
still an issue, using expo so cant change android specific xml files etc |
When will you fixed this issue ? |
The better solution is to not use the native React Modal. Use this library instead: https://github.com/maxs15/react-native-modalbox |
There is still a problem with devices that have a soft menu bar like the Samsung Galaxy S8 and no solution solves the problem with the soft menu bar region not being drawn over by the Modal. |
ok,fixed by using If the theme color is white, fixed by using |
I used https://github.com/listenzz/react-native-modal-translucent, and worked like a charm.
|
@pablobrodt Can you explain to me how did you make it work? I'm getting an error using the package. I've opened there a new issue. |
@Jelomite I just linked this https://github.com/listenzz/react-native-modal-translucent manually, like i said above, then used the react-native Modal with |
I see, thanks 😄 |
I changed the default Modal implementation of react-native and solved this problem. What I do is to replace the official Modal package with one a-little-modified Modal package which shows Modal in full screen with status bar above, you can refer to https://www.cnblogs.com/wkmcyz/articles/10277436.html for details. |
This fixes the longstanding issue highlighted at this issue: facebook#7474 A janky postinstall fix making this exact change is quite popular on NPM, demonstrating that there's a clear need for this (see https://www.npmjs.com/package/react-native-modal-translucent)
I need to hide the iOS status bar of my app in some screens and not for all screens. Any solution for this. I tried this but it did not work for me.
|
Still happening in RN 0.60.5. |
react-native-modal-translucent solved my problem https://github.com/listenzz/react-native-modal-translucent |
+1 |
2 similar comments
+1 |
+1 |
While the modal component is open on an android device with StatusBar.setHidden(true) the StatusBar still shows up.
Is this intended? If yes, is there any workaround?
Edit: On iOS the StatusBar remains hidden when a modal component is open.
The text was updated successfully, but these errors were encountered: