Flutter TabBar com Box Shadow: Guia de Implementação

Para aplicar uma sombra de caixa a TabBar in Flutter, você pode envolvê-la em a Container e usar a BoxDecoration propriedade. Aqui está um exemplo:

import 'package:flutter/material.dart';  
  
void main() {  
  runApp(MyApp());  
}  
  
class MyApp extends StatelessWidget {  
  @override  
  Widget build(BuildContext context) {  
    return MaterialApp(  
      home: MyHomePage(),  
   );  
  }  
}  
  
class MyHomePage extends StatelessWidget {  
  @override  
  Widget build(BuildContext context) {  
    return DefaultTabController(  
      length: 3,  
      child: Scaffold(  
        appBar: AppBar(  
          title: Text('TabBar with Shadow'),  
          bottom: TabBar(  
            tabs: [  
              Tab(text: 'Tab 1'),  
              Tab(text: 'Tab 2'),  
              Tab(text: 'Tab 3'),  
            ],  
         ),  
       ),  
        body: TabBarView(  
          children: [  
            Container(color: Colors.red),  
            Container(color: Colors.green),  
            Container(color: Colors.blue),  
          ],  
       ),  
     ),  
   );  
  }  
}  

Se você quiser adicionar um efeito de sombra ao TabBar, você pode envolvê-lo TabBar em a Container e aplicar BoxDecoration:

Container(  
  decoration: BoxDecoration(  
    boxShadow: [  
      BoxShadow(  
        color: Colors.grey.withOpacity(0.5),  
        spreadRadius: 5,  
        blurRadius: 7,  
        offset: Offset(0, 3), // changes position of shadow  
     ),  
    ],  
 ),  
  child: TabBar(  
    tabs: [  
      Tab(text: 'Tab 1'),  
      Tab(text: 'Tab 2'),  
      Tab(text: 'Tab 3'),  
    ],  
 ),  
),  

Neste exemplo, o BoxShadow é usado para criar um efeito de sombra para o arquivo TabBar. Você pode personalizar a cor, o raio de propagação, o raio de desfoque e o deslocamento para obter a aparência de sombra desejada.

Lembre-se de ajustar as propriedades da sombra para atender aos requisitos do seu projeto.

Observe que aplicar uma sombra pode não funcionar se você AppBar já estiver usando elevação. Nesses casos, pode ser necessário usar widgets personalizados ou ajustar o design para acomodar ambos os efeitos.