cmdrootaccess / another-flushbar

A flexible widget for user notification. Customize your text, button, duration, animations and much more. For Android devs, it is made to replace Snackbars and Toasts.
https://pub.dev/packages/another_flushbar
MIT License
146 stars 90 forks source link

feature/handle-click-behind-old-safearea #86

Closed EArminjon closed 1 year ago

EArminjon commented 2 years ago

This PR aim to fix a use case where a top floating flushbar didn't allow user to click on appbar elements.

For example the following screen, you can see a rectangle with red line (which have added). It's coming from the old safeArea. Because of it, it's not possible to click on the bottom of my Icons.home.

Capture d’écran 2022-10-26 à 17 00 29

With the new system, the safeArea didn't interact with user click which let the user to interact with the background.

Capture d’écran 2022-10-26 à 17 00 14

Code used to test.

import 'package:another_flushbar/flushbar.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(
    const MaterialApp(
      home: Home(),
    ),
  );
}

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: IconButton(
          icon: const Icon(Icons.home),
          onPressed: () {
            print("Home button tapped");
          },
        ),
      ),
      body: Center(
        child: OutlinedButton(
          onPressed: () {
            Flushbar<void>? flush;
            flush = Flushbar<void>(
              borderRadius: const BorderRadius.all(Radius.circular(8.0)),
              reverseAnimationCurve: Curves.decelerate,
              margin: const EdgeInsets.only(
                left: 12,
                right: 12,
                top: kToolbarHeight + 9,
              ),
              padding: const EdgeInsets.symmetric(horizontal: 12),
              messageText: Container(
                key: const ValueKey<String>("message_delete_success"),
                width: double.infinity,
                alignment: Alignment.center,
                child: Row(
                  children: <Widget>[
                    const Expanded(
                      child: Text("THE FLUSHBAR"),
                    ),
                    IconButton(
                      onPressed: () => flush?.dismiss(),
                      icon: const Icon(Icons.close, color: Colors.white),
                    ),
                  ],
                ),
              ),
              isDismissible: false,
              backgroundColor: Colors.orange,
              flushbarPosition: FlushbarPosition.TOP,
              flushbarStyle: FlushbarStyle.FLOATING,
            );

            flush.show(context);
          },
          child: const Text("SHOW FLUSHBAR"),
        ),
      ),
    );
  }
}
cmdrootaccess commented 2 years ago

Thanks for this . will review

EArminjon commented 1 year ago

@cmdrootaccess any update ? Many issue are opened and many PR :/

cmdrootaccess commented 1 year ago

@cmdrootaccess any update ? Many issue are opened and many PR :/

my bad, i have been busy with other projects.

i will find time over the weekend hopefully to address the issues including this pr .

EArminjon commented 1 year ago

@cmdrootaccess :) up for this