我有一个屏幕,上面有一个SafeArea小部件,然后里面的所有内容都用容器 Package 起来,作为一个主体传递给SafeArea,但是当我想改变容器的颜色时,它总是保持白色。
我实现这个用户界面的方式有问题吗?我怎样才能改变这个颜色?
class _MeetingScreenState extends State<MeetingScreen> {
@override
Widget build(BuildContext context) {
return SafeArea(
left: false,
right: false,
child: Container(
// Container color to change
color: Colors.black87,
child: Material(
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
ActionIconButton(
iconState: false,
iconStateOn: Icons.cameraswitch_outlined,
iconStateOff: Icons.cameraswitch_outlined),
Column(
children: const [
Text('Meeting title'),
// TODO implement meeting time
Text('04:28')
],
),
ActionIconButton(
iconState: _switchCamera,
iconStateOn: Icons.volume_up_outlined,
iconStateOff: Icons.volume_off_outlined,
iconBackgroundColor: AppColors.white,
activeIconColor: AppColors.white,
inactiveColor: AppColors.whiteWithOpacity,)
],
),
)
],
),
),
),
),
);
}
}
2条答案
按热度按时间okxuctiv1#
Material
也应用颜色,并且它在Container
的颜色之上。您可以删除
Container
并将您的颜色赋予Material
小部件:变更
与
mnowg1ta2#
材质小部件负责:
剪裁:如果clipBehavior不是Clip.none,Material会将其部件子树剪裁为由shape、type和borderRadius指定的形状。默认情况下,clipBehavior是Clip.none,以考虑性能。有关如何影响剪裁Ink部件的示例,请参见Ink。高度:Material在Z轴上将其部件子树提升高度像素,并绘制适当的阴影。墨水效果:Material显示由InkFeatures实现的墨水效果,如其子级下面的InkSplash和InkHighlight。
所以需要添加颜色的材料小部件根据瓦伦丁维格纳回答。我希望你能理解。