I want to hide the AppBar on scroll. The search icon is hidden properly and also the opacity decreases on scroll. But for the title, it is not working.
import 'package:flutter/material.dart';
import 'package:vet_mobile/screens/chat.dart';
import 'package:vet_mobile/screens/logot.dart';

class HomeScreen extends StatelessWidget {
  const HomeScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 3,
      child: Scaffold(
        body: NestedScrollView(
          headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
            return <Widget>[
              SliverAppBar(
                title: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      'WhatsApp',
                      style: TextStyle(
                        color: Theme.of(context).textTheme.bodyLarge!.color,
                      ),
                    ),
                    IconButton(
                      onPressed: () {},
                      icon: Icon(
                        Icons.search,
                        color: Theme.of(context).textTheme.bodyLarge!.color,
                      ),
                    ),
                  ],
                ),
                pinned: true,
                floating: true,
                elevation: 5,
                bottom: TabBar(
                  indicatorSize: TabBarIndicatorSize.tab,
                  indicatorWeight: 4,
                  indicatorColor: Theme.of(context).textTheme.bodyLarge!.color,
                  labelStyle:
                      TextStyle(fontSize: 13, fontWeight: FontWeight.w600),
                  labelColor: Theme.of(context).textTheme.bodyLarge!.color,
                  unselectedLabelColor:
                      Theme.of(context).textTheme.bodySmall!.color,
                  dividerColor: Colors.transparent,
                  tabs: const [
                    Tab(text: 'CHATS'),
                    Tab(text: 'STATUS'),
                    Tab(text: 'CALLS'),
                  ],
                ),
              ),
            ];
          },
          body: const TabBarView(
            children: [
              Center(child: LogoutScreen()),
              Center(child: ChatScreen()),
              Center(child: Text('Patient')),
            ],
          ),
        ),
      ),
    );
  }
}



As we can see the opacity of the search button decreases slowly as I scroll down but not for the title.
I tried using the preferred height, animation controller, but it messed up more.

Cannot properly hide the appbar title on scroll in flutter
Seems that this effect does not work when you set a custom style. Remove the fixed style setting from here:
Text(
  'PawCare',
  // remove this
  /*style: TextStyle(
    color: Theme.of(context).textTheme.bodyLarge!.color,
  ),*/
),

To set the style of the title text, use the titleTextStyle configuration of SliverAppBar:
SliverAppBar(
  titleTextStyle: TextStyle(
   color: Theme.of(context).textTheme.bodyLarge!.color),
...

