Question

我很难将Android的状态栏设置为透明。我使用以下代码进行了测试，并且可以正常工作：

@override
Widget build(BuildContext context) {
  SystemChrome.setSystemUIOverlayStyle(
    SystemUiOverlayStyle(
      statusBarColor: Colors.transparent,
      statusBarIconBrightness: Brightness.dark,
    ),
  );
  return Scaffold(
    body: Text('temporary test widget'),
  );
}

但是当我在Scaffold的主体部分中替换正确的窗口小部件时，透明性将丢失：

@override
Widget build(BuildContext context) {
  SystemChrome.setSystemUIOverlayStyle(
    SystemUiOverlayStyle(
      statusBarColor: Colors.transparent,
      statusBarIconBrightness: Brightness.dark,
    ),
  );
  return Scaffold(
    body: CustomScrollView(
      slivers: <Widget>[
        SliverAppBar(
          brightness: Brightness.dark,
          pinned: true,
          expandedHeight: 225.0,
          flexibleSpace: FlexibleSpaceBar(
            background: Image(
              fit: BoxFit.cover,
              excludeFromSemantics: false,
              image: AssetImage('images/aristocrat.jpg'),
            ),
          ),
        ),
        SliverFixedExtentList(
          itemExtent: 100.0,
          delegate: SliverChildBuilderDelegate(
            (BuildContext context, int index) {
              return Container(
                alignment: Alignment.center,
                color: Colors.lightBlue[100 * (index % 9)],
                child: Text('List Item $index'),
              );
            },
            childCount: 10,
          ),
        ),
      ],
    ),
  );
}

我想念什么？

Answer 1

答案3.0

此代码可以正常工作，使状态栏透明，而Brightness.dark将负责其余的工作。

指针：此外，如果您想使用它，则不是必需的。但是，如果没有适合您的方法，请考虑使用flutter_statusbarcolor软件包

Widget build(BuildContext context) {
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle(
        statusBarColor: Colors.transparent, // this one will make the statusbar transparent
        statusBarIconBrightness: Brightness.dark //this will take care of the icon color
      ),
      child: Scaffold(
        body: CustomScrollView(
          slivers: <Widget>[
            SliverAppBar(
              // brightness: Brightness.dark, <-- Not required if you have mentioned in the above AnnotatedRegion
              pinned: true,
              expandedHeight: 225.0,
              flexibleSpace: FlexibleSpaceBar(
                background: Image(
                  fit: BoxFit.cover,
                  excludeFromSemantics: false,
                  image: AssetImage('images/aristocrat.jpg'),
                ),
              ),
            ),
            SliverFixedExtentList(
              itemExtent: 100.0,
              delegate: SliverChildBuilderDelegate(
                (BuildContext context, int index) {
                  return Container(
                    alignment: Alignment.center,
                    color: Colors.lightBlue[100 * (index % 9)],
                    child: Text('List Item $index'),
                  );
                },
                childCount: 10,
              ),
            ),
          ],
        ),
      )
   );
}

Flutter：无法使用SliverAppBar将状态栏设置为透明

1 个答案: