Pub.dev Badge MIT License Badge Flutter Platform Badge


Status Bar Tap

A Flutter package that enables scroll-to-top functionality when tapping the status bar, just like in native iOS apps. Brings familiar iOS behavior to your Flutter app with full customization for both iOS and Android.

StatusBarTap Demo

StatusBarTap Demo

Usage

Basic Setup

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

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(home: Scaffold(body: SingleControllerScreen()));
  }
}

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

  @override
  State<SingleControllerScreen> createState() => _SingleControllerScreenState();
}

class _SingleControllerScreenState extends State<SingleControllerScreen> {
  final ScrollController _scrollController = ScrollController();
  @override
  void initState() {
    super.initState();
    _initializeLibrary();
  }

  void _initializeLibrary() {
    WidgetsBinding.instance.addPostFrameCallback((_) {
      final double statusBarHeight = MediaQuery.of(context).padding.top;

      StatusBarTap().initialize(
        config: StatusBarTapConfig(
          enableOnIOS: true,
          enableOnAndroid: true,
          statusBarHeight: statusBarHeight,
          androidTapAreaHeight: 20,
        ),
      );

      StatusBarTap().registerScrollController(_scrollController);
    });
  }

  @override
  void dispose() {
    StatusBarTap().unregisterScrollController(_scrollController);
    StatusBarTap().dispose();
    _scrollController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Status Bar Tap Demo')),
      body: Column(
        children: [
          Expanded(
            child: ListView.builder(
              controller: _scrollController,
              itemCount: 50,
              itemBuilder: (context, index) =>
                  ListTile(title: Text('Item ${index + 1}')),
            ),
          ),
        ],
      ),
    );
  }
}

Advanced Configuration

WidgetsBinding.instance.addPostFrameCallback((_) {
  final double statusBarHeight = MediaQuery.of(context).padding.top;
  StatusBarTap().initialize(
    config: StatusBarTapConfig(
      enableOnIOS: true,           // Enable on iOS (default: true)
      enableOnAndroid: false,      // Enable on Android (default: false)
      androidTapAreaHeight: 20.0,  // Additional tap area for Android
      statusBarHeight: statusBarHeight,
      scrollDuration: Duration(milliseconds: 400),
      scrollCurve: Curves.fastOutSlowIn,
      debug: true,                 // Enable debug logging
      debugVisual: true,           // Show visual tap area overlay
      onTap: () {
        // Custom callback when status bar is tapped
        print('Status bar tapped!');
      },
    ),
  );
});

Multiple Controllers

// Register multiple scroll controllers
StatusBarTap().registerScrollController(_mainController);
StatusBarTap().registerScrollController(_sidebarController);

// All registered controllers will scroll to top on status bar tap

Features

  • Platform-specific behavior: Native iOS-like experience with customizable Android support
  • Multiple controller support: Register multiple scroll controllers for complex layouts
  • Flexible configuration: Customize scroll animation, tap area, and platform behavior
  • Debug tools: Visual tap area overlay and detailed logging for development
  • Memory safe: Proper resource cleanup with dispose pattern

Configuration Options

Parameter Type Default Description
enableOnIOS bool true Enable status bar tap on iOS
enableOnAndroid bool false Enable status bar tap on Android
androidTapAreaHeight double 20.0 Additional tap area below status bar on Android
statusBarHeight double Required Status bar height in logical pixels
scrollDuration Duration 400ms Scroll animation duration
scrollCurve Curve Curves.fastOutSlowIn Scroll animation curve
debug bool false Enable debug logging
debugVisual bool false Show visual tap area overlay
onTap VoidCallback? null Callback when status bar is tapped

FAQ

Q: Why doesn't it work on Android by default?
A: Android doesn't expose status bar tap events to apps. The package works around this by detecting taps in an area below the status bar. Set enableOnAndroid: true and adjust androidTapAreaHeight as needed.

Q: Can I use multiple scroll controllers?
A: Yes! Register multiple controllers and they'll all scroll to top on status bar tap.

License

This project is licensed under the MIT License - see the LICENSE file for details.

Libraries

status_bar_tap