我试图让启动画面与我的容器(其子级为 FlatButton)匹配相同的形状。
按下时,飞溅当前会填充不同的形状,如下所示:
我的小部件代码如下:
import 'package:flutter/material.dart';
class RoundedButton extends StatelessWidget {
const RoundedButton( {this.buttonColor, this.buttonTitle, @required this.onPressed});
final Color buttonColor;
final String buttonTitle;
final Function onPressed;
@override
Widget build(BuildContext context) {
return Container(
margin: EdgeInsets.symmetric(vertical: 16.0),
height: 42.0,
width: 200.0,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(30.0),
color: buttonColor,
),
child: FlatButton(
onPressed: onPressed,
child: Text(
buttonTitle,
style: TextStyle(
color: Colors.white
),
),
),
);
}
}
最佳答案
您可以使用 ClipRRect
小部件,它可以用圆角剪切底层小部件,并使用 borderRadius
属性并传递与父小部件相同的 radius
即Container
,即用ClipRRect
包裹FlatButton
来达到想要的效果。下面的示例工作代码:
body: Container(
margin: EdgeInsets.symmetric(vertical: 16.0),
height: 42.0,
width: 200.0,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(30.0),
color: Colors.red,
),
child: ClipRRect(
borderRadius: BorderRadius.circular(30),
child: FlatButton(
onPressed: () {
print('pressed');
},
child: Text(
'Send',
style: TextStyle(
color: Colors.white
),
),
),
)
),
希望这能回答您的问题。
关于android - Splash 流到 Container/FlatButton 之外 - Flutter,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61026309/