Flutter: I enabled the immersive mode and the AppBar stays big. When I make it smaller the title becomes cropped and does not go up with the AppBar

Question

The image above shows how I enabled the immersive mode.

This is how the AppBar looks without any modification.

And this is how it looks like, when I set the toolbarHeight to 10.

Here is the code from the image:

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) => Scaffold(
    appBar: AppBar(
      backgroundColor: const Color(0xFF892D89),
      toolbarHeight: 10,
      centerTitle: true,
      title: Container(
        height: 30,
        child: Image.asset('assets/fontlogo.png'),
      ),
    ),
  );
}

I tried various of ways to solve this problem, but couldn't do it. One of those ways was to set resizeToAvoidBottomInset to true.

Scaffold(
  resizeToAvoidBottomInset: true,
),

Or to use titleSpacing.

AppBar(
  titleSpacing: 50,
  title: Text('SignShine'),
),

If someone knows the solution, I would appreciate the reply and thank them in advance.