Flutter 在颤振中,当滑动杆不是主要的时,如何使其在浮动状态下尊重顶部安全区域

Flutter 在颤振中,当滑动杆不是主要的时,如何使其在浮动状态下尊重顶部安全区域,flutter,sliverappbar,Flutter,Sliverappbar,我有一个滑动条,看起来这是正常状态,这就是我想要的: 但当向下滚动时,应用程序栏不尊重其浮动状态的顶部安全区域: 这是我的构建方法代码 return Scaffold( body: CustomScrollView( controller: _scrollController, slivers: <Widget>[ SliverSafeArea( bottom: false,

我有一个滑动条,看起来这是正常状态,这就是我想要的:

但当向下滚动时,应用程序栏不尊重其浮动状态的顶部安全区域:

这是我的构建方法代码

      return Scaffold(
      body: CustomScrollView(
        controller: _scrollController,
        slivers: <Widget>[
          SliverSafeArea(
            bottom: false,
            sliver: SliverPadding(
              padding: const EdgeInsets.symmetric(horizontal: 5),
              sliver: SliverAppBar(
                primary: false,
                centerTitle: true,
                actions: actions,
                floating: true,
                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
                title: const Text('title'),
              ),
            ),
          ),
          SliverGrid(
            gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 4,
            ),
            delegate: SliverChildBuilderDelegate(
              (BuildContext context, int index) {
                return Container(
                  margin: const EdgeInsets.all(20),
                  color: Colors.amber,
                );
              },
              childCount: 130,
            ),
          ),
        ],
      ),
    );
返回脚手架(
正文:自定义滚动视图(
控制器:\ u滚动控制器,
条子:[
斯莱凡尼亚(
底部:错误,
银条:银条填充(
填充:常量边集。对称(水平:5),
银条:银条(
主要:错误,
标题:对,
行动:行动,
浮动:是的,
形状:RoundedRectangleBorder(borderRadius:borderRadius.circular(8)),
标题:常量文本(“标题”),
),
),
),
银栅(
gridDelegate:const SliverGridDelegateWithFixedCrossAxisCount(
交叉轴计数:4,
),
代表:SliverChildBuilderDelegate(
(BuildContext上下文,int索引){
返回容器(
边距:常数边集全部(20),
颜色:颜色。琥珀色,
);
},
儿童人数:130,
),
),
],
),
);

我想你需要一个定制的应用程序条

像这样的

class FloatingAppBar extends StatelessWidget {
  const FloatingAppBar(
    this.title, {
    this.actions = const <Widget>[],
    Key? key,
    this.leading = const BackButton(),
    this.height = 48,
  }) : super(key: key);

  final String? title;
  final List<Widget> actions;
  final Widget leading;
  final double height;

  @override
  Widget build(BuildContext context) {
    //final Color bgColor = isDark(context) ? Colors.grey.shade800 : Colors.white;
    return Center(
      child: Container(
        height: height,
        width: MediaQuery.of(context).size.width - 20,
        constraints: const BoxConstraints(maxWidth: 600),
        decoration: BoxDecoration(
          color: isDark(context) ? Colors.grey.shade800 : Colors.white,
          borderRadius: BorderRadius.circular(8),
          boxShadow: <BoxShadow>[
            BoxShadow(
              color: isDark(context) ? Colors.black54 : Colors.grey.shade500,
              blurRadius: 1,
              spreadRadius: 0.1,
              offset: const Offset(0, 0.7),
            ),
          ],
        ),
        padding: const EdgeInsets.all(0),
        margin: const EdgeInsets.only(top: 5),
        child: Row(
          children: <Widget>[
            leading,
            Expanded(
              child: Center(
                child: Text(
                  title ?? '',
                  textDirection: getTextDirection(title ?? ''),
                  style: const TextStyle(
                    fontWeight: FontWeight.bold,
                    //color: Colors.black87,
                  ),
                ),
              ),
            ),
            if (actions.isEmpty)
              const IconButton(
                padding: EdgeInsets.all(0),
                iconSize: 20,
                icon: Icon(iconArrowLeft, color: Colors.transparent),
                onPressed: null,
              ),
            //
            ...actions
          ],
        ),
      ),
    );
  }
}


class FloatingAppBar扩展了无状态小部件{
常数浮动条(
这个名字{
this.actions=const[],
钥匙?,钥匙,
this.leading=const BackButton(),
这个高度=48,
}):super(key:key);
最终字符串?标题;
最后行动清单;
最终引导;
最终双倍高度;
@凌驾
小部件构建(构建上下文){
//最终颜色bgColor=isDark(上下文)?Colors.grey.shade800:Colors.white;
返回中心(
子:容器(
高度:高度,,
宽度:MediaQuery.of(context).size.width-20,
约束:常量框约束(最大宽度:600),
装饰:盒子装饰(
颜色:isDark(上下文)?Colors.grey.shade800:Colors.white,
边界半径:边界半径。圆形(8),
boxShadow:[
箱形阴影(
颜色:isDark(上下文)?Colors.black 54:Colors.grey.shade500,
半径:1,
扩展半径:0.1,
偏移量:常数偏移量(0,0.7),
),
],
),
填充:常量边集。全部(0),
边距:仅限常量边集(顶部:5),
孩子:排(
儿童:[
主要的
扩大(
儿童:中心(
子:文本(
标题??”,
textDirection:getTextDirection(标题??“”),
样式:consttextstyle(
fontWeight:fontWeight.bold,
//颜色:颜色。黑色87,
),
),
),
),
如果(actions.isEmpty)
常量图标按钮(
填充:边缘集。全部(0),
iconSize:20,
图标:图标(左侧,颜色:颜色。透明),
onPressed:null,
),
//
……行动
],
),
),
);
}
}

谢谢您的回答,但我想使用默认的AppBar+您的代码在滚动时没有实现AppBar的浮动特性!