dart 我的阴影和模糊是不正确的工作,由于某种原因

oalqel3c  于 2023-11-14  发布在  其他
关注(0)|答案(1)|浏览(99)

我的代码和结果

class WeatherScreen extends StatelessWidget {
  const WeatherScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        title: const Text(
          'Weather App',
          style: TextStyle(fontWeight: FontWeight.bold),
        ),
        actions: [
          IconButton(onPressed: () {}, icon: const Icon(Icons.refresh))
        ],
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          children: [
            //main card
            SizedBox(
              width: double.infinity,
              child: Card(
                elevation: 2,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(16),
                ),
                child: BackdropFilter(
                  filter: ImageFilter.blur(sigmaX: 5, sigmaY: 5),
                  child: const Padding(
                    padding: EdgeInsets.all(16.0),
                    child: Column(
                      children: [
                        Text(
                          '20 °C',
                          style: TextStyle(
                              fontSize: 32, fontWeight: FontWeight.bold),
                        ),
                        SizedBox(
                          height: 16,
                        ),
                        Icon(
                          Icons.cloud,
                          size: 64,
                        ),
                        SizedBox(
                          height: 16,
                        ),
                        Text(
                          'Rain',
                          style: TextStyle(fontSize: 20),
                        ),
                      ],
                    ),
                  ),
                ),
              ),
            ),
            SizedBox(
              height: 20,
            ),
            //weather cards
            Placeholder(
              fallbackHeight: 150,
            ),
            SizedBox(
              height: 20,
            ),
            //additional information
            Placeholder(
              fallbackHeight: 150,
            ),
          ],
        ),
      ),
    );
  }
}

字符串


的数据
在作者的视频中,一切看起来都很好,我重复了他所有的动作,但由于某种原因看起来是这样的

x0fgdtte

x0fgdtte1#

您可以在卡上包含clipBehavior: Clip.antiAlias以获得您想要的用户界面。默认值为Clip.none

SizedBox(
  width: double.infinity,
  child: Card(
    clipBehavior: Clip.antiAlias, //this
    shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(16),
    ),

字符串

相关问题