在Flutter的标签栏下方添加阴影?

问题描述 投票:0回答:1

是否可以在标签栏下方添加阴影?

  Widget build(BuildContext context) {
    return MaterialApp(
      home: DefaultTabController(
        length: 3,
        child: Scaffold(
          appBar: AppBar(
            bottom: TabBar(
              tabs: [
                Tab(icon: Icon(Icons.directions_car)),
                Tab(icon: Icon(Icons.directions_transit)),
                Tab(icon: Icon(Icons.directions_bike)),
              ],
            ),
            title: Text('Tabs Demo'),
          ),
          body: TabBarView(
            children: [
              Icon(Icons.directions_car),
              Icon(Icons.directions_transit),
              Icon(Icons.directions_bike),
            ],
          ),
        ),
      ),
    );
  }
flutter
1个回答
-1
投票

也许这会有所帮助:

  Widget build(BuildContext context) {
    return MaterialApp(
      home: DefaultTabController(
          length: 3,
          child: Scaffold(
            appBar: AppBar(
                bottom: TabBar(tabs: [
                  Tab(icon: Icon(Icons.directions_car)),
                  Tab(icon: Icon(Icons.directions_transit)),
                  Tab(icon: Icon(Icons.directions_bike)),
                ])),
            body: Stack(                 // <<<<<<<< USE A STACK
                alignment: Alignment.topCenter,       
                children: <Widget>[
                  Container(            // <<<<<<<< Add a shaddow
                      height: 50, 
                      color: Colors.black.withOpacity(0.5)),
                  TabBarView(
                      children: [
                        Icon(Icons.directions_car),
                        Icon(Icons.directions_transit),
                        Icon(Icons.directions_bike),
                      ]
                  )
                ]
            ),
          )
      ),
    );
  }

The

enter image description here

© www.soinside.com 2019 - 2024. All rights reserved.