Flutter 中容器底部的 3D 效果

如何解决Flutter 中容器底部的 3D 效果

我想在我的容器中创建类似 3D 的效果。我不知道该怎么做。任何帮助表示赞赏。

Image

提前致谢。

解决方法

那不是什么 3D。它可以通过使用 boxShadow 小部件的 decoration 的 Container 属性轻松实现。

然后，您可以尝试使用 color、blurRadius 之类的东西以获得所需的效果。

示例代码：

class Shadow extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Shadow')),body: Container(
        color: Colors.black,child: Center(
          child: Container(
            width: 300,height: 300,decoration: BoxDecoration(
              color: Colors.blue,borderRadius: BorderRadius.circular(40),boxShadow: [
                BoxShadow(
                  color: Colors.blue.withOpacity(0.5),offset: Offset(0,25),blurRadius: 3,spreadRadius: -10)
              ],),);
  }
}

输出