![](/img/trans.png)
[英]Flutter: how can I make a rounded PopupMenuButton's InkWell?
[英]How can I make InkWell's splash visible?
环境
问题
我在下面编写了这样的代码。
我发现当我点击它时,控制台中会显示“InkWell.onTap”,但不会发生飞溅 animation(= animation 像波浪一样扩展)。 你能帮我理解为什么我看不到飞溅 animation 吗?
样本
InkWell(
splashColor: Colors.blueAccent,
onTap: () {
print('${DateTime.now()}| InkWell.onTap');
},
child: Container(
color: Colors.lightBlue[100],
child: Row(
children: <Widget>[
Expanded(
child: Column(
children: <Widget>[
Padding(
padding: EdgeInsets.all(8.0),
child: Container(
decoration: BoxDecoration(
color: Colors.lightBlue[50],
border: Border.all(),
),
child: Padding(
padding: EdgeInsets.all(8.0),
child: Align(
alignment: Alignment.centerLeft,
child: Text('Text1'),
),
),
),
),
Padding(
padding: EdgeInsets.only(
left: 16, top: 8, right: 8, bottom: 8),
child: Align(
alignment: Alignment.centerLeft,
child: Text('Text2'),
),
),
],
),
),
],
),
),
)
附加信息
上面的代码只制作了一个浅蓝色方块,您可以在屏幕截图中找到 5。
有人建议这个问题可能与此问题重复。 但是,我仍然有一个问题。
I think the answers basically say that "Move the color
property to outside of InkWell
Widget", but my case has multiple colors ( Colors.lightBlue[100]
and Colors.lightBlue[50]
), so I cannot simply move color
to outside. 如果我误解了什么,请纠正我。
要获得涟漪效果, Material
小部件必须是InkWell
的直接祖先,现在您的InkWell
的位置您的整个屏幕都会产生涟漪效果,我不确定这是否是您想要的效果。
Material(
color: Colors.lightBlue[100],
child: InkWell(
splashColor: Colors.blueAccent,
onTap: () {
print('${DateTime.now()}| InkWell.onTap');
},
child: Row(
children: <Widget>[
Expanded(
child: Column(
children: <Widget>[
Padding(
padding: EdgeInsets.all(8.0),
child: Container(
decoration: BoxDecoration(
color: Colors.lightBlue[50],
border: Border.all(),
),
child: Padding(
padding: EdgeInsets.all(8.0),
child: Align(
alignment: Alignment.centerLeft,
child: Text('Text1'),
),
),
),
),
Padding(
padding: EdgeInsets.only(
left: 16, top: 8, right: 8, bottom: 8),
child: Align(
alignment: Alignment.centerLeft,
child: Text('Text2'),
),
),
],
),
),
],
),
),
),
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.