这是我的问题:
我想实现这个设计,就像这样:
这是我的代码:
@override
Widget build(BuildContext context) {
return BackdropFilter(
filter: ImageFilter.blur(sigmaX: 2, sigmaY: 2),
child: Scaffold(
backgroundColor: Colors.transparent,
body: Center(
child: Padding(
padding: const EdgeInsets.all(32.0),
child: ClipRRect(
//<---here
borderRadius: BorderRadius.circular(10),
child: Container(
height: MediaQuery.of(context).size.height,
width: 600,
decoration: const BoxDecoration(
color: Color(0xffF6F6F6),
),
child: LayoutBuilder(
builder: (context, constraints) => Stack(
children: [
Padding(
padding: const EdgeInsets.all(15.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: const [
Icon(FontAwesomeIcons.checkDouble,
size: 40, color: Color(0xffD6D6D6)),
Icon(FontAwesomeIcons.squareXmark,
size: 40, color: Color(0xff404040)),
],
),
),
Padding(
padding: const EdgeInsets.fromLTRB(15, 60, 15, 0),
child: Stack(
children: [
Center(
child: Text(
"We send you an Email",
style: TextStyle(
fontSize: 20,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.normal,
color: Color(0xff3B3B3B),
),
),
),
Padding(
padding: EdgeInsets.symmetric(vertical: 8.0),
child: Divider(color: Color(0xff3B3B3B)),
),
Text(
"Please, check your Email inbox to log in and start using Pomoworko",
style: TextStyle(
fontSize: 20,
fontStyle: FontStyle.normal,
fontWeight: FontWeight.normal,
color: Color(0xff3B3B3B),
),
),
Padding(
padding: EdgeInsets.symmetric(vertical: 8.0),
child: Divider(color: Color(0xff3B3B3B)),
),
],
),
),
RiveAnimation.asset(
"img/letter_and_knife.riv",
),
],
),
),
),
),
),
),
),
);
}
我在这个问题上遇到了困难,我使用了一个列,但不起作用,而且我不知道如何组织小部件,为了实现第二个设计,使用什么小部件可能会有帮助?
粉红色为:颜色:彩色(0xffF4CFDD)
谢谢你考虑我的请求。
1条答案
按热度按时间56lgkhnf1#
您使用了错误的小部件,而不是
stack
,您需要像这样使用column
: