如何在 Flutter 中重新创建此按钮？

Question

我有这个按钮，它倾向于混合或融化到我想要重新创建的它的侧面......

到目前为止，我已经设法做到这一点，方法是向堆栈中的两个容器添加两个框阴影

但我似乎无法像第一个按钮那样将它混合到两侧。

Stack(
         children: [
           Container(
               height: 50,
               width: 150,
               decoration: const BoxDecoration(
                   borderRadius: BorderRadius.all(Radius.circular(30)),
                   boxShadow: [
                     BoxShadow(color: Colors.white38,blurRadius: 5, offset: Offset(-3, -5)),
                   ]
               )
           ),
           Container(
             height: 50,
             width: 150,
             child: Center(
               child: GestureDetector(
                 onTapDown: (_) {
                   setState(() {
                     button = Colors.grey.shade600;
                     print("pressed");
                   });
                 },
                 child: const Text(
                   'Create Account',
                   textAlign: TextAlign.left,
                   style: TextStyle(
                     fontFamily: "Netflix",
                     fontWeight: FontWeight.w600,
                     fontSize: 18,
                     letterSpacing: 0.0,
                     color: Colors.white,
                   ),
                 ),
               ),
             ),
             decoration: BoxDecoration(
             color: button,
             borderRadius: const BorderRadius.all(Radius.circular(30)),
             boxShadow: const [
               BoxShadow(color: Colors.black45,blurRadius: 5, offset: Offset(5, 3)),
             ]
             )
           ),
         ],
      )

Answer 1

有这个插件flutter_neumorphic 。 它基本上有助于在 flutter 中创建新形态设计。 我不知道你所说的blend or melt over to its sides是什么意思，但我认为这就是你要找的东西。