나는 하나가 StatefulWidget다른 저를 탐색 버튼과 떨림에 StatefulWidget사용 Navigator.push(). 두 번째 위젯에서는 전역 상태 (일부 사용자 기본 설정)를 변경하고 있습니다. 두 번째 위젯에서 첫 번째 위젯으로 돌아 오면 첫 번째 위젯을 사용 Navigator.pop()하는 것은 이전 상태이지만 강제로 다시로드하고 싶습니다. 이 작업을 수행하는 방법을 아십니까? 한 가지 아이디어가 있지만 추악 해 보입니다.
답변:
여기서 할 수있는 일이 몇 가지 있습니다. @Mahi의 대답은 정확하지만 조금 더 간결 할 수 있으며 실제로 OP가 묻는 것처럼 showDialog보다 푸시를 사용합니다. 다음을 사용하는 예입니다 Navigator.push.
import 'package:flutter/material.dart';
class SecondPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Container(
color: Colors.green,
child: new Column(
children: <Widget>[
new RaisedButton(
onPressed: () => Navigator.pop(context),
child: new Text("back"),
),
],
),
);
}
}
class FirstPage extends StatefulWidget {
@override
State<StatefulWidget> createState() => new FirstPageState();
}
class FirstPageState extends State<FirstPage> {
Color color = Colors.white;
@override
Widget build(BuildContext context) {
return new Container(
color: color,
child: new Column(
children: <Widget>[
new RaisedButton(
child: new Text("next"),
onPressed: () {
Navigator
.push(
context,
new MaterialPageRoute(builder: (context) => new SecondPage()),
)
.then((value) {
setState(() {
color = color == Colors.white ? Colors.grey : Colors.white;
});
});
}),
],
),
);
}
}
void main() => runApp(
new MaterialApp(
builder: (context, child) => new SafeArea(child: child),
home: new FirstPage(),
),
);
그러나 사용 사례에 잘 맞는 다른 방법이 있습니다. 을 global첫 페이지의 빌드에 영향을주는 것으로 사용하는 경우 InheritedWidget 을 사용하여 전역 사용자 환경 설정을 정의 할 수 있으며 변경 될 때마다 FirstPage가 다시 빌드됩니다. 이는 아래에 표시된 것처럼 상태 비 저장 위젯에서도 작동합니다 (그러나 상태 저장 위젯에서도 작동해야 함).
flutter에서 inheritedWidget의 예는 앱의 테마입니다.하지만 여기 에서처럼 직접 빌드하는 대신 위젯 내에서 정의합니다.
import 'package:flutter/material.dart';
import 'package:meta/meta.dart';
class SecondPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Container(
color: Colors.green,
child: new Column(
children: <Widget>[
new RaisedButton(
onPressed: () {
ColorDefinition.of(context).toggleColor();
Navigator.pop(context);
},
child: new Text("back"),
),
],
),
);
}
}
class ColorDefinition extends InheritedWidget {
ColorDefinition({
Key key,
@required Widget child,
}): super(key: key, child: child);
Color color = Colors.white;
static ColorDefinition of(BuildContext context) {
return context.inheritFromWidgetOfExactType(ColorDefinition);
}
void toggleColor() {
color = color == Colors.white ? Colors.grey : Colors.white;
print("color set to $color");
}
@override
bool updateShouldNotify(ColorDefinition oldWidget) =>
color != oldWidget.color;
}
class FirstPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
var color = ColorDefinition.of(context).color;
return new Container(
color: color,
child: new Column(
children: <Widget>[
new RaisedButton(
child: new Text("next"),
onPressed: () {
Navigator.push(
context,
new MaterialPageRoute(builder: (context) => new SecondPage()),
);
}),
],
),
);
}
}
void main() => runApp(
new MaterialApp(
builder: (context, child) => new SafeArea(
child: new ColorDefinition(child: child),
),
home: new FirstPage(),
),
);
상속 된 위젯을 사용하는 경우 푸시 한 페이지의 팝업을 지켜 보는 것에 대해 걱정할 필요가 없습니다. 기본 사용 사례에서는 작동하지만 더 복잡한 시나리오에서는 문제가 발생할 수 있습니다.
데이터를 전달하는 두 가지가 있습니다.
첫 페이지에서 사용
// sending "Foo" from 1st
Navigator.push(context, MaterialPageRoute(builder: (_) => Page2("Foo")));
두 번째 페이지에서 사용하십시오.
class Page2 extends StatelessWidget {
final String string;
Page2(this.string); // receiving "Foo" in 2nd
...
}
두 번째 페이지에서 사용
// sending "Bar" from 2nd
Navigator.pop(context, "Bar");
첫 페이지에서 사용하십시오. 이전에 사용했던 것과 동일하지만 약간의 수정이 있습니다.
// receiving "Bar" in 1st
String received = await Navigator.push(context, MaterialPageRoute(builder: (_) => Page2("Foo")));
쉬운 트릭을 사용하는 것입니다 Navigator.pushReplacement을 방법을
페이지 1
Navigator.pushReplacement(
context,
MaterialPageRoute(
builder: (context) => Page2(),
),
);
2 쪽
Navigator.pushReplacement(
context,
MaterialPageRoute(
builder: (context) => Page1(),
),
);
이 작업은 정말 좋았습니다. 저는 flutter 페이지에서이 문서를 받았습니다 : flutter doc
첫 페이지에서 탐색을 제어하는 방법을 정의했습니다.
_navigateAndDisplaySelection(BuildContext context) async {
final result = await Navigator.push(
context,
MaterialPageRoute(builder: (context) => AddDirectionPage()),
);
//below you can get your result and update the view with setState
//changing the value if you want, i just wanted know if i have to
//update, and if is true, reload state
if (result) {
setState(() {});
}
}
따라서 잉크 병의 작업 메서드에서 호출하지만 버튼에서도 호출 할 수 있습니다.
onTap: () {
_navigateAndDisplaySelection(context);
},
마지막으로 두 번째 페이지에서 무언가를 반환합니다 (부울을 반환했습니다. 원하는 것을 반환 할 수 있습니다).
onTap: () {
Navigator.pop(context, true);
}
await Navigator....pop에서 결과 값을 생략 할 수도 있습니다 .
두 번째 화면 (비동기 기능 내부)으로 밀고있는 곳에 이것을 놓으십시오.
Function f;
f= await Navigator.pushNamed(context, 'ScreenName');
f();
당신이 터지는 곳에 이것을 두십시오
Navigator.pop(context, () {
setState(() {});
});
는 setState내에서 호출되는 pop데이터를 업데이트하기 위해 폐쇄.
setState인수로 정확히 어디에 전달 합니까? 기본적으로 setState클로저 내부를 호출 합니다. 인수로 전달하지 않습니다.
Navigator.pop.
내 솔루션은 SecondPage에 함수 매개 변수를 추가 한 다음 FirstPage에서 수행중인 다시로드 함수를받은 다음 Navigator.pop (context) 줄 이전에 함수를 실행했습니다.
첫 페이지
refresh() {
setState(() {
//all the reload processes
});
}
그런 다음 다음 페이지로 이동합니다 ...
Navigator.push(context, new MaterialPageRoute(builder: (context) => new SecondPage(refresh)),);
SecondPage
final Function refresh;
SecondPage(this.refresh); //constructor
네비게이터 팝 라인 앞에서
widget.refresh(); // just refresh() if its statelesswidget
Navigator.pop(context);
이전 페이지에서 다시로드해야하는 모든 항목은 팝업 후에 업데이트되어야합니다.
dynamic result컨텍스트를 팝할 때 a를 다시 전달한 다음 setState((){})값이true 하여 상태를 그대로 둘 수 있습니다.
참조 용으로 코드 스 니펫을 붙여 넣었습니다.
handleClear() async {
try {
var delete = await deleteLoanWarning(
context,
'Clear Notifications?',
'Are you sure you want to clear notifications. This action cannot be undone',
);
if (delete.toString() == 'true') {
//call setState here to rebuild your state.
}
} catch (error) {
print('error clearing notifications' + error.toString());
}
}
Future<bool> deleteLoanWarning(BuildContext context, String title, String msg) async {
return await showDialog<bool>(
context: context,
child: new AlertDialog(
title: new Text(
title,
style: new TextStyle(fontWeight: fontWeight, color: CustomColors.continueButton),
textAlign: TextAlign.center,
),
content: new Text(
msg,
textAlign: TextAlign.justify,
),
actions: <Widget>[
new Container(
decoration: boxDecoration(),
child: new MaterialButton(
child: new Text('NO',),
onPressed: () {
Navigator.of(context).pop(false);
},
),
),
new Container(
decoration: boxDecoration(),
child: new MaterialButton(
child: new Text('YES', ),
onPressed: () {
Navigator.of(context).pop(true);
},
),
),
],
),
) ??
false;
}
감사합니다, Mahi
Navigator.pop(context, true), 맞습니까? 하지만이 true값을 어떻게 얻을 수 있습니까? 사용 BuildContext?
setState() called after dispose(): This error happens if you call setState() on a State object for a widget that no longer appears in the widget tree (e.g., whose parent widget no longer includes the widget in its build). This error can occur when code calls setState() from a timer or an animation callback. The preferred solution is to cancel the timer or stop listening to the animation in the dispose() callback. ....
if(!mounted) return;호출 할 때마다 사용했던 것이 흥미 롭습니다 setState((){});.
내 상태 비 저장 위젯 중 하나를 강제로 다시 빌드해야합니다. 상태 저장을 사용하고 싶지 않았습니다. 이 솔루션을 찾았습니다.
await Navigator.of(context).pushNamed(...);
ModalRoute.of(enclosingWidgetContext);
컨텍스트 및 enclosingWidgetContext는 동일하거나 다른 컨텍스트 일 수 있습니다. 예를 들어 StreamBuilder 내부에서 푸시하면 달라집니다.
여기서는 ModalRoute로 아무것도하지 않습니다. 구독하는 행위만으로도 강제로 재 구축 할 수 있습니다.
오늘 나는 같은 상황에 직면했지만 훨씬 더 쉽게 해결할 수 있었고 첫 번째 상태 저장 클래스에서 사용 된 전역 변수를 정의했고 두 번째 상태 저장 위젯으로 이동할 때 전역 값을 업데이트하도록했습니다. 첫 번째 위젯을 자동으로 업데이트하는 변수입니다. 여기에 예가 있습니다.
import 'package:flutter/material.dart';
int count = 0 ;
class FirstPage extends StatefulWidget {
FirstPage({Key key}) : super(key: key);
@override
_FirstPageState createState() => _FirstPageState();
}
class _FirstPageState extends State<FirstPage> {
@override
Widget build(BuildContext context) {
return InkWell(
onTap(){
Navigator.of(context).push(MaterialPageRoute(builder: (context) =>
new SecondPage());
},
child: Text('First', style : TextStyle(fontSize: count == 0 ? 20.0 : 12.0)),
),
}
class SecondPage extends StatefulWidget {
SecondPage({Key key}) : super(key: key);
@override
_SecondPageState createState() => _SecondPageState();
}
class _SecondPageState extends State<SecondPage> {
@override
Widget build(BuildContext context) {
return IconButton(
icon: new Icon(Icons.add),
color: Colors.amber,
iconSize: 15.0,
onPressed: (){
count++ ;
},
),
}
Navigator.pop()상태를 유지 한 후에 는이 코드에서 발생하지 않습니다. 내가 뭔가를 놓치고 있습니까? Navigator.push()setState
이 간단한 코드는 루트로 이동하여 상태를 다시로드하는 데 도움이되었습니다.
...
onPressed: () {
Navigator.of(context).pushNamedAndRemoveUntil('/', ModalRoute.withName('/'));
},
...
간단히 말해서 위젯이 상태를 감시하도록해야합니다. 이를 위해서는 상태 관리가 필요합니다.
내 방법은 Flutter Architecture Samples 및 Flutter Docs에 설명 된 Provider를 기반으로 합니다. 더 간결한 설명을 위해 그들을 참조하십시오 그러나 단계는 어느 정도 다음과 같습니다.
일부 API 프로세스를 기다리기 위해 data및 라고하는 여러 상태를 가질 수 있습니다 isLoading. 모델 자체가 ChangeNotifier.
Consumer또는 일 수 있습니다 Selector.
상태 모델의 경우 클래스는 다음과 같이 다소 보일 것입니다. notifyListeners변경 사항을 브로드 캐스트하는 것에주의 하십시오.
class DataState extends ChangeNotifier{
bool isLoading;
Data data;
Future loadData(){
isLoading = true;
notifyListeners();
service.get().then((newData){
isLoading = false;
data = newData;
notifyListeners();
});
}
}
이제 위젯입니다. 이것은 매우 스켈레톤 코드가 될 것입니다.
return ChangeNotifierProvider(
create: (_) => DataState()..loadData(),
child: ...{
Selector<DataState, bool>(
selector: (context, model) => model.isLoading,
builder: (context, isLoading, _) {
if (isLoading) {
return ProgressBar;
}
return Container(
child: Consumer<DataState>(builder: (context, dataState, child) {
return WidgetData(...);
}
));
},
),
}
);
상태 모델의 인스턴스는 ChangeNotifierProvider에서 제공합니다. 선택자와 소비자는 각각 isLoading및 data각각에 대한 상태를 감시합니다 . 이 그들 사이에 큰 차이는 없습니다 만 개인적으로 당신이 그들의 건축업자가 제공하는 무엇에 따라 달라을 사용하는 방법. 소비자는 상태 모델에 대한 액세스를 제공하므로 loadData바로 아래에있는 모든 위젯에 대한 호출 이 더 간단합니다.
그렇지 않은 경우 Provider.of. 두 번째 화면에서 돌아올 때 페이지를 새로 고치려면 다음과 같이 할 수 있습니다.
await Navigator.push(context,
MaterialPageRoute(
builder: (_) {
return Screen2();
));
Provider.of<DataState>(context, listen: false).loadData();
나를 위해 일했습니다.
...
onPressed: (){pushUpdate('/somePageName');}
...
pushUpdate (string pageName) async { //in the same class
await pushPage(context, pageName);
setState(() {});
}
//---------------------------------------------
//general sub
pushPage (context, namePage) async {
await Navigator.pushNamed(context, namePage);
}
이 경우 (UI의 버튼 또는 Android의 "뒤로") 팝업 방식은 중요하지 않습니다. 업데이트가 완료됩니다.