Status bar color when navigating to new screen
I am using following in my build()
method of 1st screen to change status bar color and it works fine.
// 1st screen's build() method
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: Colors.green),
);
However when I navigate to 2nd screen the 1st screen status bar color appears on the 2nd screen too. And in 2nd screen's build()
method, I am using the same code with different color
// 2nd screen's build() method
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: Colors.red),
);
dart flutter
add a comment |
I am using following in my build()
method of 1st screen to change status bar color and it works fine.
// 1st screen's build() method
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: Colors.green),
);
However when I navigate to 2nd screen the 1st screen status bar color appears on the 2nd screen too. And in 2nd screen's build()
method, I am using the same code with different color
// 2nd screen's build() method
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: Colors.red),
);
dart flutter
add a comment |
I am using following in my build()
method of 1st screen to change status bar color and it works fine.
// 1st screen's build() method
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: Colors.green),
);
However when I navigate to 2nd screen the 1st screen status bar color appears on the 2nd screen too. And in 2nd screen's build()
method, I am using the same code with different color
// 2nd screen's build() method
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: Colors.red),
);
dart flutter
I am using following in my build()
method of 1st screen to change status bar color and it works fine.
// 1st screen's build() method
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: Colors.green),
);
However when I navigate to 2nd screen the 1st screen status bar color appears on the 2nd screen too. And in 2nd screen's build()
method, I am using the same code with different color
// 2nd screen's build() method
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: Colors.red),
);
dart flutter
dart flutter
asked Nov 25 '18 at 16:43
VolleyballVolleyball
849318
849318
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
Try setting the 2nd status bar color before doing the Navigator.push
to the second screen. Like this
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: Colors.red),
);
await Navigator.of(context).push(MaterialPageRoute(
builder: (context) => SecondScreen();
));
From Flutter Docs
Call this API in code whose lifecycle matches that of the desired system UI styles. For instance, to change the system UI style on a new page, consider calling when pushing/popping a new PageRoute.
Did you try it? I'm doing it that way and it works
– Sebastian
Nov 28 '18 at 12:57
What if you change it back to green before you do the Navigation pop?
– Sebastian
Nov 28 '18 at 17:18
Great!! I updated the answer with a quote from the docs
– Sebastian
Nov 28 '18 at 17:31
One problem, currently I am having default back button but this way I have to handle everything using WillPopScope. Not a good way to go but had to do. Can you suggest a better way?
– Volleyball
Nov 28 '18 at 17:58
@VolleyBall The appBar contains a "leading" property, Give that property an Icon of arrow back and give it a gesture detector with Navigator.of(context).pop() on pressing that.
– Waleed Arshad
Jan 12 at 20:25
|
show 1 more comment
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53469650%2fstatus-bar-color-when-navigating-to-new-screen%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Try setting the 2nd status bar color before doing the Navigator.push
to the second screen. Like this
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: Colors.red),
);
await Navigator.of(context).push(MaterialPageRoute(
builder: (context) => SecondScreen();
));
From Flutter Docs
Call this API in code whose lifecycle matches that of the desired system UI styles. For instance, to change the system UI style on a new page, consider calling when pushing/popping a new PageRoute.
Did you try it? I'm doing it that way and it works
– Sebastian
Nov 28 '18 at 12:57
What if you change it back to green before you do the Navigation pop?
– Sebastian
Nov 28 '18 at 17:18
Great!! I updated the answer with a quote from the docs
– Sebastian
Nov 28 '18 at 17:31
One problem, currently I am having default back button but this way I have to handle everything using WillPopScope. Not a good way to go but had to do. Can you suggest a better way?
– Volleyball
Nov 28 '18 at 17:58
@VolleyBall The appBar contains a "leading" property, Give that property an Icon of arrow back and give it a gesture detector with Navigator.of(context).pop() on pressing that.
– Waleed Arshad
Jan 12 at 20:25
|
show 1 more comment
Try setting the 2nd status bar color before doing the Navigator.push
to the second screen. Like this
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: Colors.red),
);
await Navigator.of(context).push(MaterialPageRoute(
builder: (context) => SecondScreen();
));
From Flutter Docs
Call this API in code whose lifecycle matches that of the desired system UI styles. For instance, to change the system UI style on a new page, consider calling when pushing/popping a new PageRoute.
Did you try it? I'm doing it that way and it works
– Sebastian
Nov 28 '18 at 12:57
What if you change it back to green before you do the Navigation pop?
– Sebastian
Nov 28 '18 at 17:18
Great!! I updated the answer with a quote from the docs
– Sebastian
Nov 28 '18 at 17:31
One problem, currently I am having default back button but this way I have to handle everything using WillPopScope. Not a good way to go but had to do. Can you suggest a better way?
– Volleyball
Nov 28 '18 at 17:58
@VolleyBall The appBar contains a "leading" property, Give that property an Icon of arrow back and give it a gesture detector with Navigator.of(context).pop() on pressing that.
– Waleed Arshad
Jan 12 at 20:25
|
show 1 more comment
Try setting the 2nd status bar color before doing the Navigator.push
to the second screen. Like this
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: Colors.red),
);
await Navigator.of(context).push(MaterialPageRoute(
builder: (context) => SecondScreen();
));
From Flutter Docs
Call this API in code whose lifecycle matches that of the desired system UI styles. For instance, to change the system UI style on a new page, consider calling when pushing/popping a new PageRoute.
Try setting the 2nd status bar color before doing the Navigator.push
to the second screen. Like this
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(statusBarColor: Colors.red),
);
await Navigator.of(context).push(MaterialPageRoute(
builder: (context) => SecondScreen();
));
From Flutter Docs
Call this API in code whose lifecycle matches that of the desired system UI styles. For instance, to change the system UI style on a new page, consider calling when pushing/popping a new PageRoute.
edited Nov 29 '18 at 4:39
Volleyball
849318
849318
answered Nov 26 '18 at 17:06
SebastianSebastian
495210
495210
Did you try it? I'm doing it that way and it works
– Sebastian
Nov 28 '18 at 12:57
What if you change it back to green before you do the Navigation pop?
– Sebastian
Nov 28 '18 at 17:18
Great!! I updated the answer with a quote from the docs
– Sebastian
Nov 28 '18 at 17:31
One problem, currently I am having default back button but this way I have to handle everything using WillPopScope. Not a good way to go but had to do. Can you suggest a better way?
– Volleyball
Nov 28 '18 at 17:58
@VolleyBall The appBar contains a "leading" property, Give that property an Icon of arrow back and give it a gesture detector with Navigator.of(context).pop() on pressing that.
– Waleed Arshad
Jan 12 at 20:25
|
show 1 more comment
Did you try it? I'm doing it that way and it works
– Sebastian
Nov 28 '18 at 12:57
What if you change it back to green before you do the Navigation pop?
– Sebastian
Nov 28 '18 at 17:18
Great!! I updated the answer with a quote from the docs
– Sebastian
Nov 28 '18 at 17:31
One problem, currently I am having default back button but this way I have to handle everything using WillPopScope. Not a good way to go but had to do. Can you suggest a better way?
– Volleyball
Nov 28 '18 at 17:58
@VolleyBall The appBar contains a "leading" property, Give that property an Icon of arrow back and give it a gesture detector with Navigator.of(context).pop() on pressing that.
– Waleed Arshad
Jan 12 at 20:25
Did you try it? I'm doing it that way and it works
– Sebastian
Nov 28 '18 at 12:57
Did you try it? I'm doing it that way and it works
– Sebastian
Nov 28 '18 at 12:57
What if you change it back to green before you do the Navigation pop?
– Sebastian
Nov 28 '18 at 17:18
What if you change it back to green before you do the Navigation pop?
– Sebastian
Nov 28 '18 at 17:18
Great!! I updated the answer with a quote from the docs
– Sebastian
Nov 28 '18 at 17:31
Great!! I updated the answer with a quote from the docs
– Sebastian
Nov 28 '18 at 17:31
One problem, currently I am having default back button but this way I have to handle everything using WillPopScope. Not a good way to go but had to do. Can you suggest a better way?
– Volleyball
Nov 28 '18 at 17:58
One problem, currently I am having default back button but this way I have to handle everything using WillPopScope. Not a good way to go but had to do. Can you suggest a better way?
– Volleyball
Nov 28 '18 at 17:58
@VolleyBall The appBar contains a "leading" property, Give that property an Icon of arrow back and give it a gesture detector with Navigator.of(context).pop() on pressing that.
– Waleed Arshad
Jan 12 at 20:25
@VolleyBall The appBar contains a "leading" property, Give that property an Icon of arrow back and give it a gesture detector with Navigator.of(context).pop() on pressing that.
– Waleed Arshad
Jan 12 at 20:25
|
show 1 more comment
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53469650%2fstatus-bar-color-when-navigating-to-new-screen%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown