我有一个按钮,点击它我想要弹出一个对话框,我通过使用 showDialog 并在那里调用我的对话框方法来做到这一点。但是我不知道我应该如何使用图像文本和一行中的分数。?
图片已提供,代码也提示给我,好吗?
这里是使用showDialog的地方
Row(
children: <Widget>[
RaisedButton(
padding: EdgeInsets.symmetric(horizontal: 30.0, vertical: 15.0),
textColor: Colors.black,
child: Text(
'LeaderBoard',
style: TextStyle(
fontSize: 20.0,
fontWeight: FontWeight.bold,
),
),
onPressed: () {
showDialog(
context: context,
builder: (BuildContext context) => leadDialog);
},
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0)),
),
我的对话框mmethod
import 'package:flutter/material.dart';
Dialog leadDialog = Dialog(
child: Container(
height: 300.0,
width: 360.0,
color: Colors.white,
child: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Padding(
padding: EdgeInsets.all(15.0),
child: Text(
'Choose from Library',
style:
TextStyle(color: Colors.black, fontSize: 22.0),
),
),
],
),
),
);
预期的结果是
最佳答案
截图:
代码:
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: ElevatedButton(
onPressed: () {
showDialog(
context: context,
builder: (context) {
return Dialog(
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(40)),
elevation: 16,
child: Container(
child: ListView(
shrinkWrap: true,
children: <Widget>[
SizedBox(height: 20),
Center(child: Text('Leaderboard')),
SizedBox(height: 20),
_buildRow('assets/choc.png', 'Name 1', 1000),
_buildRow('assets/choc.png', 'Name 2', 2000),
_buildRow('assets/choc.png', 'Name 3', 3000),
_buildRow('assets/choc.png', 'Name 4', 4000),
_buildRow('assets/choc.png', 'Name 5', 5000),
_buildRow('assets/choc.png', 'Name 6', 6000),
],
),
),
);
},
);
},
child: Text('Show dialog'),
),
),
);
}
Widget _buildRow(String imageAsset, String name, double score) {
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 20.0),
child: Column(
children: <Widget>[
SizedBox(height: 12),
Container(height: 2, color: Colors.redAccent),
SizedBox(height: 12),
Row(
children: <Widget>[
CircleAvatar(backgroundImage: AssetImage(imageAsset)),
SizedBox(width: 12),
Text(name),
Spacer(),
Container(
decoration: BoxDecoration(color: Colors.yellow[900], borderRadius: BorderRadius.circular(20)),
padding: EdgeInsets.symmetric(vertical: 8, horizontal: 20),
child: Text('$score'),
),
],
),
],
),
);
}
关于flutter - 在 flutter 中按下按钮弹出对话框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56806136/