Как изменить состояние StatefulWidget внутри StatelessWidget?
Просто проверяю трепетание. Пример кода ниже представляет собой очень простое приложение. Проблема в том, что я не знаю, как вызвать функцию setState() внутри класса TestTextState, чтобы изменять текст каждый раз, когда нажимается кнопка изменения.
import 'package:flutter/material.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Test app',
home: new Scaffold(
appBar: new AppBar(
title: new Text("Test"),
),
body: new Test(),
),
);
}
}
class Test extends StatelessWidget {
final TestText testText = new TestText();
void change() {
testText.text == "original" ? testText.set("changed") : testText.set("original");
}
@override
Widget build(BuildContext context) {
return new Column(
children: [
testText,
new RaisedButton(
child: new Text("change"),
onPressed: () => change(),
),
]
);
}
}
class TestText extends StatefulWidget {
String text = "original";
void set(String str) {
this.text = str;
}
@override
TestTextState createState() => new TestTextState();
}
class TestTextState extends State<TestText> {
@override
Widget build(BuildContext context) {
return new Text(this.widget.text);
}
}
3 ответа
Я подошел к этой проблеме, инициализируя _TestTextState как конечное свойство виджета TestText, которое позволяет просто обновлять состояние при нажатии кнопки изменения. Это кажется простым решением, но я не уверен, что это хорошая практика.
import 'package:flutter/material.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Test app',
home: new Scaffold(
appBar: new AppBar(
title: new Text("Test"),
),
body: new Test(),
),
);
}
}
class Test extends StatelessWidget {
final _TestText text = new _TestText();
@override
Widget build(BuildContext context) {
return new Column(
children: [
text,
new RaisedButton(
child: new Text("change"),
onPressed: () => text.update(),
),
]
);
}
}
class TestText extends StatefulWidget {
final _TestTextState state = new _TestTextState();
void update() {
state.change();
}
@override
_TestTextState createState() => state;
}
class _TestTextState extends State<TestText> {
String text = "original";
void change() {
setState(() {
this.text = this.text == "original" ? "changed" : "original";
});
}
@override
Widget build(BuildContext context) {
return new Text(this.text);
}
}
Их нет способа сделать это. любой способ преобразования вашего StatelessWidget в StatefulWidget.
Решение на основе вашего существующего кода
class Test extends StatelessWidget {
final StreamController<String> streamController = StreamController<String>.broadcast();
@override
Widget build(BuildContext context) {
final TestText testText = TestText(streamController.stream);
return new Column(children: [
testText,
new RaisedButton(
child: Text("change"),
onPressed: () {
String text = testText.text == "original" ? "changed" : "original";
streamController.add(text);
},
),
]);
}
}
class TestText extends StatefulWidget {
TestText(this.stream);
final Stream<String> stream;
String text = "original";
@override
TestTextState createState() => new TestTextState();
}
class TestTextState extends State<TestText> {
@override
void initState() {
widget.stream.listen((str) {
setState(() {
widget.text = str;
});
});
super.initState();
}
@override
Widget build(BuildContext context) {
return Text(widget.text);
}
}
Но это не лучшая идея - использовать неконечное поле внутри Stateful Widget
PS Вы также можете использовать это - scoped_model