我有一个工具,用户可以更新自己的个人资料图片。用户点击按钮,然后弹出对话框显示。
按键呼叫:
TextButton(
onPressed: () {
changeImage();
setState(() {});
},
child: Text(
'Changer de photo',
style: TextStyle(
fontSize: 9.sp,
fontWeight: FontWeight.w700,
color: Theme.of(context)
.primaryColorLight),
),
更改图像功能:
Future changeImage() {
return showDialog(
context: context,
builder: (BuildContext context) => Dialog(
child: Container(
decoration: BoxDecoration(
color: Theme.of(context).primaryColor,
),
padding: const EdgeInsets.all(30),
width: 300.0,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text(
"Change ta photo de profil",
style: Theme.of(context).textTheme.titleMedium,
textAlign: TextAlign.center,
),
SizedBox(
height: 2.h,
),
if (pickedFile != null)
Container(
child: Image.file(
File(pickedFile!.path!),
width: 200,
height: 200,
)),
TextButton(
onPressed: () {
selectFile();
setState(() {});
print(uploadReady);
},
child: const Text(
"Choisir une image",
),
),
SizedBox(
height: 2.h,
),
ElevatedButton(
onPressed: () {
uploadFile();
Navigator.pop(context);
setState(() {});
},
child: const Text(
"Appliquer l'image",
)),
],
),
),
));
}
正如你所看到的,我想在用户点击应用图像之前显示一个预览。但是在用户选择他的图像之后,预览没有显示。我需要退出弹出对话框,重新点击我的初始按钮(显示弹出窗口),然后图像显示。
如何动态显示图像的预览?
1条答案
按热度按时间brgchamk1#
要更新对话框ui,可以使用
StatefulBuilder
的setState
。和使用情形