TextField click rebuilds/reloads widget after routed











up vote
2
down vote

favorite












I am having an issue where the whole screen widget reloads when there is a textfield is used.
This doesn't happen when the the app is loaded with this screen as landing page.



But when the routing happens from another page to this page and when textfield is clicked then the rebuild happens.



I even tried a simple app and this is getting reproduced. Tried many ways but could not get to a solution.



import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';


class Screen1 extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text("Screen 1"), // screen title
),
body: new Center(
child: new Column(
children: <Widget>[
new RaisedButton(
onPressed: () {
button1(context);
},
child: new Text("Go to Screen 2"),
)
],
),
),
);
}
}

class Screen2 extends StatelessWidget {
@override
Widget build(BuildContext context) {
print("Widget rebuilds");
return new Scaffold(
appBar: new AppBar(
title: new Text("Screen 2"),
),
body: new Center(
child: new Column(
children: <Widget>[
new Container(
height: 350.0,
child: TextFormField(
keyboardType: TextInputType.text,
style: TextStyle(fontSize: 16.0, color: Colors.black),
)),

],
),
),
);
}
}

void main() {
runApp(new MaterialApp(
home: new Screen1(),
routes: <String, WidgetBuilder>{
'/screen2': (BuildContext context) => new Screen2()
},
));
}

void button1(BuildContext context) {
print("Button 1");
Navigator.of(context).pushNamed('/screen2');
}


Here the app is loaded with screen 1 and clicking on button Go to screen2 will load the screen 2 with the text field. Clicking on this field will bring the keyboard and clicking the done on keyboard and again focusing on the text field will rebuild the screen. This keeps happening when keyboard appears and when disappears.



But then if Screen2 is set as landing page, then clicking on the text field and doing the same process mentioned above will not reload the widget. The widget build happens only once. Seems the issue is when the Screen2 is navigated from Screen 1



 runApp(new MaterialApp(
home: new Screen2(),
routes: <String, WidgetBuilder>{
'/screen2': (BuildContext context) => new Screen2()
},
));









share|improve this question
























  • why did you import cupertino as well?
    – stt106
    Nov 22 at 9:07















up vote
2
down vote

favorite












I am having an issue where the whole screen widget reloads when there is a textfield is used.
This doesn't happen when the the app is loaded with this screen as landing page.



But when the routing happens from another page to this page and when textfield is clicked then the rebuild happens.



I even tried a simple app and this is getting reproduced. Tried many ways but could not get to a solution.



import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';


class Screen1 extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text("Screen 1"), // screen title
),
body: new Center(
child: new Column(
children: <Widget>[
new RaisedButton(
onPressed: () {
button1(context);
},
child: new Text("Go to Screen 2"),
)
],
),
),
);
}
}

class Screen2 extends StatelessWidget {
@override
Widget build(BuildContext context) {
print("Widget rebuilds");
return new Scaffold(
appBar: new AppBar(
title: new Text("Screen 2"),
),
body: new Center(
child: new Column(
children: <Widget>[
new Container(
height: 350.0,
child: TextFormField(
keyboardType: TextInputType.text,
style: TextStyle(fontSize: 16.0, color: Colors.black),
)),

],
),
),
);
}
}

void main() {
runApp(new MaterialApp(
home: new Screen1(),
routes: <String, WidgetBuilder>{
'/screen2': (BuildContext context) => new Screen2()
},
));
}

void button1(BuildContext context) {
print("Button 1");
Navigator.of(context).pushNamed('/screen2');
}


Here the app is loaded with screen 1 and clicking on button Go to screen2 will load the screen 2 with the text field. Clicking on this field will bring the keyboard and clicking the done on keyboard and again focusing on the text field will rebuild the screen. This keeps happening when keyboard appears and when disappears.



But then if Screen2 is set as landing page, then clicking on the text field and doing the same process mentioned above will not reload the widget. The widget build happens only once. Seems the issue is when the Screen2 is navigated from Screen 1



 runApp(new MaterialApp(
home: new Screen2(),
routes: <String, WidgetBuilder>{
'/screen2': (BuildContext context) => new Screen2()
},
));









share|improve this question
























  • why did you import cupertino as well?
    – stt106
    Nov 22 at 9:07













up vote
2
down vote

favorite









up vote
2
down vote

favorite











I am having an issue where the whole screen widget reloads when there is a textfield is used.
This doesn't happen when the the app is loaded with this screen as landing page.



But when the routing happens from another page to this page and when textfield is clicked then the rebuild happens.



I even tried a simple app and this is getting reproduced. Tried many ways but could not get to a solution.



import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';


class Screen1 extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text("Screen 1"), // screen title
),
body: new Center(
child: new Column(
children: <Widget>[
new RaisedButton(
onPressed: () {
button1(context);
},
child: new Text("Go to Screen 2"),
)
],
),
),
);
}
}

class Screen2 extends StatelessWidget {
@override
Widget build(BuildContext context) {
print("Widget rebuilds");
return new Scaffold(
appBar: new AppBar(
title: new Text("Screen 2"),
),
body: new Center(
child: new Column(
children: <Widget>[
new Container(
height: 350.0,
child: TextFormField(
keyboardType: TextInputType.text,
style: TextStyle(fontSize: 16.0, color: Colors.black),
)),

],
),
),
);
}
}

void main() {
runApp(new MaterialApp(
home: new Screen1(),
routes: <String, WidgetBuilder>{
'/screen2': (BuildContext context) => new Screen2()
},
));
}

void button1(BuildContext context) {
print("Button 1");
Navigator.of(context).pushNamed('/screen2');
}


Here the app is loaded with screen 1 and clicking on button Go to screen2 will load the screen 2 with the text field. Clicking on this field will bring the keyboard and clicking the done on keyboard and again focusing on the text field will rebuild the screen. This keeps happening when keyboard appears and when disappears.



But then if Screen2 is set as landing page, then clicking on the text field and doing the same process mentioned above will not reload the widget. The widget build happens only once. Seems the issue is when the Screen2 is navigated from Screen 1



 runApp(new MaterialApp(
home: new Screen2(),
routes: <String, WidgetBuilder>{
'/screen2': (BuildContext context) => new Screen2()
},
));









share|improve this question















I am having an issue where the whole screen widget reloads when there is a textfield is used.
This doesn't happen when the the app is loaded with this screen as landing page.



But when the routing happens from another page to this page and when textfield is clicked then the rebuild happens.



I even tried a simple app and this is getting reproduced. Tried many ways but could not get to a solution.



import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';


class Screen1 extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text("Screen 1"), // screen title
),
body: new Center(
child: new Column(
children: <Widget>[
new RaisedButton(
onPressed: () {
button1(context);
},
child: new Text("Go to Screen 2"),
)
],
),
),
);
}
}

class Screen2 extends StatelessWidget {
@override
Widget build(BuildContext context) {
print("Widget rebuilds");
return new Scaffold(
appBar: new AppBar(
title: new Text("Screen 2"),
),
body: new Center(
child: new Column(
children: <Widget>[
new Container(
height: 350.0,
child: TextFormField(
keyboardType: TextInputType.text,
style: TextStyle(fontSize: 16.0, color: Colors.black),
)),

],
),
),
);
}
}

void main() {
runApp(new MaterialApp(
home: new Screen1(),
routes: <String, WidgetBuilder>{
'/screen2': (BuildContext context) => new Screen2()
},
));
}

void button1(BuildContext context) {
print("Button 1");
Navigator.of(context).pushNamed('/screen2');
}


Here the app is loaded with screen 1 and clicking on button Go to screen2 will load the screen 2 with the text field. Clicking on this field will bring the keyboard and clicking the done on keyboard and again focusing on the text field will rebuild the screen. This keeps happening when keyboard appears and when disappears.



But then if Screen2 is set as landing page, then clicking on the text field and doing the same process mentioned above will not reload the widget. The widget build happens only once. Seems the issue is when the Screen2 is navigated from Screen 1



 runApp(new MaterialApp(
home: new Screen2(),
routes: <String, WidgetBuilder>{
'/screen2': (BuildContext context) => new Screen2()
},
));






android dart flutter flutter-layout






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 22 at 8:35









Aniruddh Parihar

2,16111027




2,16111027










asked Nov 22 at 8:27









rahulmr

3161214




3161214












  • why did you import cupertino as well?
    – stt106
    Nov 22 at 9:07


















  • why did you import cupertino as well?
    – stt106
    Nov 22 at 9:07
















why did you import cupertino as well?
– stt106
Nov 22 at 9:07




why did you import cupertino as well?
– stt106
Nov 22 at 9:07












1 Answer
1






active

oldest

votes

















up vote
2
down vote













This is the normal behavior, there is no problem with it. It is in fact within the specs of build method :
It can be called an arbitrary number of time and you should expect it to be so.



If this causes a problem to do so, it is very likely that your build function is not pure. Meaning that it contains side effects such as http calls or similar.



These should not be done within the build method. More details here : How to deal with unwanted widget build?





About the "What triggers the build", there are a few common situations:




  • Route pop/push, for in/out animations

  • Screen resize, usually due to keyboard appearance or orientation change

  • Parent widget recreated its child

  • An InheritedWidget the widget depends on (Class.of(context) pattern) change






share|improve this answer























  • What's the side effect in this case?
    – stt106
    Nov 22 at 9:08










  • You basically want to initialise any interactive widgets like TextFormField within the initState method otherwise they are being rebuilt every time the widget's build method is called.
    – SnakeyHips
    Nov 22 at 9:15










  • His example doesn't have any side-effect besides print. But he likely has some in his application or else it wouldn't cause an issue
    – Rémi Rousselet
    Nov 22 at 9:28










  • He said he can reproduce the problem with the sample code posted.
    – stt106
    Nov 22 at 9:28










  • Yeah, he reproduces the fact that the widget tree rebuilds. It happens on route change for animation purpose or on keyboard appear due to screen resize
    – Rémi Rousselet
    Nov 22 at 9:31











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',
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
});


}
});














draft saved

draft discarded


















StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53426678%2ftextfield-click-rebuilds-reloads-widget-after-routed%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








up vote
2
down vote













This is the normal behavior, there is no problem with it. It is in fact within the specs of build method :
It can be called an arbitrary number of time and you should expect it to be so.



If this causes a problem to do so, it is very likely that your build function is not pure. Meaning that it contains side effects such as http calls or similar.



These should not be done within the build method. More details here : How to deal with unwanted widget build?





About the "What triggers the build", there are a few common situations:




  • Route pop/push, for in/out animations

  • Screen resize, usually due to keyboard appearance or orientation change

  • Parent widget recreated its child

  • An InheritedWidget the widget depends on (Class.of(context) pattern) change






share|improve this answer























  • What's the side effect in this case?
    – stt106
    Nov 22 at 9:08










  • You basically want to initialise any interactive widgets like TextFormField within the initState method otherwise they are being rebuilt every time the widget's build method is called.
    – SnakeyHips
    Nov 22 at 9:15










  • His example doesn't have any side-effect besides print. But he likely has some in his application or else it wouldn't cause an issue
    – Rémi Rousselet
    Nov 22 at 9:28










  • He said he can reproduce the problem with the sample code posted.
    – stt106
    Nov 22 at 9:28










  • Yeah, he reproduces the fact that the widget tree rebuilds. It happens on route change for animation purpose or on keyboard appear due to screen resize
    – Rémi Rousselet
    Nov 22 at 9:31















up vote
2
down vote













This is the normal behavior, there is no problem with it. It is in fact within the specs of build method :
It can be called an arbitrary number of time and you should expect it to be so.



If this causes a problem to do so, it is very likely that your build function is not pure. Meaning that it contains side effects such as http calls or similar.



These should not be done within the build method. More details here : How to deal with unwanted widget build?





About the "What triggers the build", there are a few common situations:




  • Route pop/push, for in/out animations

  • Screen resize, usually due to keyboard appearance or orientation change

  • Parent widget recreated its child

  • An InheritedWidget the widget depends on (Class.of(context) pattern) change






share|improve this answer























  • What's the side effect in this case?
    – stt106
    Nov 22 at 9:08










  • You basically want to initialise any interactive widgets like TextFormField within the initState method otherwise they are being rebuilt every time the widget's build method is called.
    – SnakeyHips
    Nov 22 at 9:15










  • His example doesn't have any side-effect besides print. But he likely has some in his application or else it wouldn't cause an issue
    – Rémi Rousselet
    Nov 22 at 9:28










  • He said he can reproduce the problem with the sample code posted.
    – stt106
    Nov 22 at 9:28










  • Yeah, he reproduces the fact that the widget tree rebuilds. It happens on route change for animation purpose or on keyboard appear due to screen resize
    – Rémi Rousselet
    Nov 22 at 9:31













up vote
2
down vote










up vote
2
down vote









This is the normal behavior, there is no problem with it. It is in fact within the specs of build method :
It can be called an arbitrary number of time and you should expect it to be so.



If this causes a problem to do so, it is very likely that your build function is not pure. Meaning that it contains side effects such as http calls or similar.



These should not be done within the build method. More details here : How to deal with unwanted widget build?





About the "What triggers the build", there are a few common situations:




  • Route pop/push, for in/out animations

  • Screen resize, usually due to keyboard appearance or orientation change

  • Parent widget recreated its child

  • An InheritedWidget the widget depends on (Class.of(context) pattern) change






share|improve this answer














This is the normal behavior, there is no problem with it. It is in fact within the specs of build method :
It can be called an arbitrary number of time and you should expect it to be so.



If this causes a problem to do so, it is very likely that your build function is not pure. Meaning that it contains side effects such as http calls or similar.



These should not be done within the build method. More details here : How to deal with unwanted widget build?





About the "What triggers the build", there are a few common situations:




  • Route pop/push, for in/out animations

  • Screen resize, usually due to keyboard appearance or orientation change

  • Parent widget recreated its child

  • An InheritedWidget the widget depends on (Class.of(context) pattern) change







share|improve this answer














share|improve this answer



share|improve this answer








edited Nov 22 at 9:37

























answered Nov 22 at 9:06









Rémi Rousselet

22.5k23875




22.5k23875












  • What's the side effect in this case?
    – stt106
    Nov 22 at 9:08










  • You basically want to initialise any interactive widgets like TextFormField within the initState method otherwise they are being rebuilt every time the widget's build method is called.
    – SnakeyHips
    Nov 22 at 9:15










  • His example doesn't have any side-effect besides print. But he likely has some in his application or else it wouldn't cause an issue
    – Rémi Rousselet
    Nov 22 at 9:28










  • He said he can reproduce the problem with the sample code posted.
    – stt106
    Nov 22 at 9:28










  • Yeah, he reproduces the fact that the widget tree rebuilds. It happens on route change for animation purpose or on keyboard appear due to screen resize
    – Rémi Rousselet
    Nov 22 at 9:31


















  • What's the side effect in this case?
    – stt106
    Nov 22 at 9:08










  • You basically want to initialise any interactive widgets like TextFormField within the initState method otherwise they are being rebuilt every time the widget's build method is called.
    – SnakeyHips
    Nov 22 at 9:15










  • His example doesn't have any side-effect besides print. But he likely has some in his application or else it wouldn't cause an issue
    – Rémi Rousselet
    Nov 22 at 9:28










  • He said he can reproduce the problem with the sample code posted.
    – stt106
    Nov 22 at 9:28










  • Yeah, he reproduces the fact that the widget tree rebuilds. It happens on route change for animation purpose or on keyboard appear due to screen resize
    – Rémi Rousselet
    Nov 22 at 9:31
















What's the side effect in this case?
– stt106
Nov 22 at 9:08




What's the side effect in this case?
– stt106
Nov 22 at 9:08












You basically want to initialise any interactive widgets like TextFormField within the initState method otherwise they are being rebuilt every time the widget's build method is called.
– SnakeyHips
Nov 22 at 9:15




You basically want to initialise any interactive widgets like TextFormField within the initState method otherwise they are being rebuilt every time the widget's build method is called.
– SnakeyHips
Nov 22 at 9:15












His example doesn't have any side-effect besides print. But he likely has some in his application or else it wouldn't cause an issue
– Rémi Rousselet
Nov 22 at 9:28




His example doesn't have any side-effect besides print. But he likely has some in his application or else it wouldn't cause an issue
– Rémi Rousselet
Nov 22 at 9:28












He said he can reproduce the problem with the sample code posted.
– stt106
Nov 22 at 9:28




He said he can reproduce the problem with the sample code posted.
– stt106
Nov 22 at 9:28












Yeah, he reproduces the fact that the widget tree rebuilds. It happens on route change for animation purpose or on keyboard appear due to screen resize
– Rémi Rousselet
Nov 22 at 9:31




Yeah, he reproduces the fact that the widget tree rebuilds. It happens on route change for animation purpose or on keyboard appear due to screen resize
– Rémi Rousselet
Nov 22 at 9:31


















draft saved

draft discarded




















































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.





Some of your past answers have not been well-received, and you're in danger of being blocked from answering.


Please pay close attention to the following guidance:


  • 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.




draft saved


draft discarded














StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53426678%2ftextfield-click-rebuilds-reloads-widget-after-routed%23new-answer', 'question_page');
}
);

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







Popular posts from this blog

Futebolista

F# list compare

Jornalista