设置AppBar属性：flexibleSpace

AppBar(
        title: const Text('XXXXX', style: Styles.pageTitle),
        centerTitle: true,
        flexibleSpace: Container(
          decoration: BoxDecoration(
            gradient: LinearGradient(colors: [
            ColorConfig.gradient_begin,
             ColorConfig.gradient_end,
            ], begin: Alignment.bottomCenter, end: Alignment.topCenter),
          ),
        ),

再去掉状态栏的半透明改为沉浸式后的效果，如图
在这里插入图片描述

# flutter # css # css3
Logo
华为开发者空间

华为开发者空间，是为全球开发者打造的专属开发空间，汇聚了华为优质开发资源及工具，致力于让每一位开发者拥有一台云主机，基于华为根生态开发、创新。

更多推荐

cover

基于仓颉编程语言+DeepSeek实现智能聊天助手开发秘籍

avatar 华为开发者空间
cover

华为云Tokens服务全面接入384超节点，以“大杂烩”优势打造先进算力

avatar 华为开发者空间

云闪付联合HarmonyOS SDK打造更便捷安全的支付体验

（Scan Kit），作为软硬协同的系统级扫码服务，Scan Kit应用了多项计算机视觉和AI技术，不仅实现了远距离自动扫码，同时还对各种复杂扫码场景（如暗光、污损、模糊、小角度、曲面码等）做了识别优化。比如扫码时，云闪付可以选择二维码的图片识别，减少用户找二维码的时间。云闪付是由各商业银行、产业各方与中国银联共建共享的移动支付产品，通过聚合银行业资源与银联广阔网络，覆盖更广阔的服务场景，如商超、

avatar 华为开发者空间