英文:
creating a widget that returns two widget but have delayed/timer
问题
如何创建一个小部件，首先显示"正在上传，请稍候..."，然后在延迟后显示"上传成功"，目前还没有数据库，所以我只想添加一些延迟，如果可能的话，最好可以重复使用。
Widget staticMessageGenerator(delayedMessage, currentMessage) {
// 这里是文本
Future.delayed(
const Duration(seconds: 2),
() {
// 在Future.delayed之后添加文本小部件
// Text(delayedMessage);
},
);
return Text(currentMessage);
}
英文:
How do I create a Widget that first show like Uploading please wait... and after a delayed it would say Successfully Uploaded there are no databases yet, so I just want to add some delay into it and if possible would be great if it would be reusable.
Widget staticMessageGenerator(delayedMessage, currentMessage) {
// Text here
Future.delayed(
const Duration(seconds: 2),
() {
// remove the return below and add Text Widget after the Future.delayed like
// Text(delayedMessage);
},
);
return Text(currentMessage);
}
答案1
得分: 1
首先，我不建议在只返回FutureBuilder的情况下创建方法，并且主要问题是它可以在每次更改时重新调用API。
Widget staticMessageGenerator(delayedMessage, currentMessage) {
return FutureBuilder(
future: Future.delayed(const Duration(seconds: 2)),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return Text(delayedMessage);
} else {
return Text(currentMessage);
}
});
}
创建一个状态未来变量将解决这个问题。最有可能你需要，我建议如下。
class ExampleF3 extends StatefulWidget {
const ExampleF3({super.key});
@override
State<ExampleF3> createState() => _ExampleF3State();
}
class _ExampleF3State extends State<ExampleF3> {
Future<String> delayedMessage() async {
await Future.delayed(const Duration(seconds: 2)); //你的上传操作，
return 'Success';
}
late final future = delayedMessage();
@override
Widget build(BuildContext context) {
return Scaffold(
body: FutureBuilder(
future: future,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return Text(snapshot.data.toString());
} else if (snapshot.hasError) {
return Text(snapshot.error.toString());
} else {
return const Text('Loading...');
}
},
),
);
}
}
英文:
Firstly, I won't recommend creating method while it just return the FutureBuilder. And the main issue it can recall the api on every changes.
Widget staticMessageGenerator(delayedMessage, currentMessage) {
return FutureBuilder(
future: Future.delayed(const Duration(seconds: 2)),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return Text(delayedMessage);
} else {
return Text(currentMessage);
}
});
}
Creating a state future variable will solve the issue. & most likely you will be needing & I will suggest as follows.
class ExampleF3 extends StatefulWidget {
const ExampleF3({super.key});
@override
State<ExampleF3> createState() => _ExampleF3State();
}
class _ExampleF3State extends State<ExampleF3> {
Future<String> delayedMessage() async {
await Future.delayed(const Duration(seconds: 2)); //your upload operation,
return 'Success';
}
late final future = delayedMessage();
@override
Widget build(BuildContext context) {
return Scaffold(
body: FutureBuilder(
future: future,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
return Text(snapshot.data.toString());
} else if (snapshot.hasError) {
return Text(snapshot.error.toString());
} else {
return const Text('Loading...');
}
},
),
);
}
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论