Question - Taskbar height behavior

[Nirsu]

Hello,

I'd like to know if it's possible to make the taskbar outside the window size? I mean, if I set a size for my window, I don't want the taskbar height to be included:

• my goal is to do like the "Xbox Game Bar" widgets on Windows (Windows + G) which have a taskbar when you want to move them but when they're pinned can't move anymore but keep the same size.

I imagined that the solution would be to hide the native taskbar, to make one myself that I would hide/display according to a button, but I wanted to know if there was a better solution.

Thanks for your answer :)

[Nirsu]

If anyone goes through it, here's what I did:

• I change the position of the window at the same time as I display the taskbar.

The problem is that every time the window changes, it shakes due to the change in position, so I'm open to suggestions 😄

import 'package:flutter/material.dart';
import 'package:window_manager/window_manager.dart';

class Tabify extends StatefulWidget {
  const Tabify({super.key});

  @override
  State<Tabify> createState() => _TabifyState();
}

class _TabifyState extends State<Tabify> {
  bool _isTaskbarVisible = true;

  Future<void> _toggleTaskbarVisibility() async {
    final Size size = await windowManager.getSize();
    final Offset position = await windowManager.getPosition();
    setState(() {
      _isTaskbarVisible = !_isTaskbarVisible;
      if (_isTaskbarVisible) {
        windowManager
          ..setSize(
            Size(
              size.width,
              size.height + 28,
            ),
          )
          ..setPosition(Offset(position.dx, position.dy - 28));
      } else {
        windowManager
          ..setSize(
            Size(
              size.width,
              size.height - 28,
            ),
          )
          ..setPosition(Offset(position.dx, position.dy + 28));
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        if (_isTaskbarVisible)
          MouseRegion(
            cursor: SystemMouseCursors.move,
            child: GestureDetector(
              onTapDown: (_) async => windowManager.startDragging(),
              child: AppBar(
                title: const Text('Tabify'),
                toolbarHeight: 28,
                backgroundColor: Colors.red,
                actions: <IconButton>[
                  IconButton(
                    padding: EdgeInsets.zero,
                    onPressed: _toggleTaskbarVisibility,
                    icon: const Icon(Icons.push_pin_outlined),
                  ),
                  IconButton(
                    padding: EdgeInsets.zero,
                    icon: const Icon(Icons.close),
                    onPressed: () async => windowManager.destroy(),
                  ),
                ],
              ),
            ),
          ),
        Flexible(
          child: TextButton(
            onPressed: _toggleTaskbarVisibility,
            child: const Text('Toggle Taskbar Visibility'),
          ),
        ),
      ],
    );
  }
}

[lijy91]

The screen_retriever package can solve your problem by obtaining the displayed size, position, and visual size, so that you can calculate the height of the Taskbar

https://github.com/leanflutter/screen_retriever

[Nirsu]

@lijy91 I don't understand how this can help me, can you explain it more clearly?