Flutter | Create advanced modal bottom sheets. Material, Cupertino or your own style

Overview

Flutter Modal Bottom Sheet

BREAKING CHANGE IN 1.0.0

In the builder param remove scrollController and use ModalScrollController.of(context) instead to access the modal's scrollController. Check the CHANGELOG for more information

Awesome Flutter Pub

Create awesome and powerful modal bottom sheets.

Cupertino Modal Multiple Modals Material Modal Bar Modal Create your own

Try it

Explore the Web Demo or clone the repository.

Why not showModalBottomSheet?

Inspired by showModalBottomSheet, it completes with some must-need features:

  • Support for inside scrollview + dragging down to close (showModalBottomSheet won't work correctly with scrollviews.
  • Support for WillPopScope to prevent closing the dialog.
  • Support for scroll to top when tapping status bar (iOS only)
  • Cupertino modal bottom sheet
  • Create custom modal bottom sheet

First Steps

How to install it? Follow Instructions

Material Modal BottomSheet

showMaterialModalBottomSheet(
  context: context,
  builder: (context) => Container(),
)

Generic params for all modal bottom sheets

Param Description
bool expand = false The expand parameter specifies id the modal bottom sheet will be full screen size or will fit the content child
bool useRootNavigator = false The useRootNavigator parameter ensures that the root navigator is used to display the bottom sheet when set to true. This is useful in the case that a modal bottom sheet needs to be displayed above all other content but the caller is inside another Navigator.
bool isDismissible = true The isDismissible parameter specifies whether the bottom sheet will be dismissed when user taps on the scrim.
Color barrierColor The barrierColor parameter controls the color of the scrim for this route
bool enableDrag = true The enableDrag parameter specifies whether the bottom sheet can be dragged up and down and dismissed by swiping downwards.
AnimationController secondAnimation The secondAnimation parameter allows you to provide an animation controller that will be used to animate push/pop of the modal route. Using this param is advised against and will be probably removed in future versions
bool bounce = false The bounce parameter specifies if the bottom sheet can go beyond the top boundary while dragging
Duration duration = const Duration(milliseconds: 400) The duration of modal opening
double closeProgressThreshold = 0.6 The closeProgressThreshold specifies when the bottom sheet will be dismissed when user drags it.

Material params

The optional backgroundColor, elevation, shape, and clipBehavior parameters can be passed in to customize the appearance and behavior of material bottom sheets.

Using it with a scroll view inside

Assign the ModalScrollController.of(context) to your primary modal to sync the scroll with the modal's drag

showMaterialModalBottomSheet(
  context: context,
  builder: (context) => SingleChildScrollView(
    controller: ModalScrollController.of(context),
    child: Container(),
  ),
);

Cupertino Modal BottomSheet

iOS 13 came with an amazing new modal navigation and now it is available to use with Flutter.

showCupertinoModalBottomSheet(
  context: context,
  builder: (context) => Container(),
)

See generic paramameter in the Material section above

Cupertino specific params

The optional backgroundColor parameters can be passed in to customize the backgroundColor cupertino bottom sheets. Useful if you want a blurred transparent background as the example Cupertino Photo Share

CAUTION!: To animate the previous route some changes are needed.

Why? MaterialPageRoute and CupertinoPageRoute do not allow animated translation to/from routes that are not the same type.

Replace your current route class with MaterialWithModalsPageRoute.

Notice this route type behaves the same as MaterialPageRoute and supports custom PageTransitionsBuilder and PageTransitionsTheme.

How can I replace my current route?
1.

Using Navigator.of(context).push

Navigator.of(context).push(MaterialPageRoute(builder: (context) => Container()));`

Replace it with

Navigator.of(context).push(MaterialWithModalsPageRoute(builder: (context) => Container()));
2.

Using onGenerateRoute parameter of MaterialApp, CupertinoApp or Navigator

onGenerateRoute: (settings) {
   ...
    return MaterialPageRoute(settings: settings, builder: (context) => Container());
},

Replace it to

onGenerateRoute: (settings) {
  ...
   return MaterialWithModalsPageRoute(settings: settings, builder: (context) => Container());
},
3.

Using pageRouteBuilder parameter of WidgetApp

pageRouteBuilder: <T>(RouteSettings settings, WidgetBuilder builder) => MaterialWithModalsPageRoute<T>(settings: settings, builder: builder)
4.

Using routes parameter from MaterialApp or CupertinoApp

Unfortunately this parameter uses MaterialPageRoute and CupertinoPageRoute respectively and cannot be changed. You can modify the way you call the previous route with one of the previous methods or try option 2

Is there an alternative in case I can't change my current route? Yes!

Learn how to animate previous route with CupertinoScaffold:
  1. Wrap previous route inside a CupertinoScaffold. Example with routes parameter from MaterialApp or CupertinoApp
  routes: <String, WidgetBuilder>{
    '/previous_route_where_you_push_modal': (BuildContext context) => CupertinoScaffold(body: Container()),
   },
  1. Push modal with this method
CupertinoScaffold.showCupertinoModalBottomSheet(context:context, builder: (context) => Container())

Don't use this solution at the same time as MaterialWithModalsPageRoute

It supports native features as bouncing, blurred background, dark mode, stacking modals and inside navigation.

Push new views inside the modal bottom sheet

a. If you want to push a new modal bottom sheet just call showCupertinoModalBottomSheet again (works with both options)

b. For inside navigaton add a new Navigator or CupertinoTabScaffold inside

c. Also it supports flutter features as WillPopScope to prevent the modal bottom to be closed.

Build other BottomSheets

Try showBarModalBottomSheet for a bottomSheet with the appearance used by Facebook or Slack

Check in the example project showAvatarModalBottomSheet for how to create your own ModalBottomSheet

Questions

Ask a question and ping me @jamesblasco

Found an issue or have a proposal?

Create an issue

Roadmap

  • Support closing by dragging fast on a modal with a scroll view.

  • Improve animation curves when user is not dragging.

  • Allow to set the initial size of the bottom sheet

  • Support hero animations Pull Request #2

Comments
  • showBarModalBottomSheet does not adjust size on keyboard open

    showBarModalBottomSheet does not adjust size on keyboard open

    This is an my modal sheet:

        String _prevText =
            await Provider.of<FirebaseDataProvider>(context, listen: false)
                .getMarquee();
        TextEditingController _marqueeController =
            TextEditingController(text: _prevText);
        return showBarModalBottomSheet(
            context: context,
            expand: true,
            builder: (BuildContext context, ScrollController scrollController) {
              return Material(
                child: Container(
                  // height: MediaQuery.of(context).size.height * 0.3,
                  color: Theme.of(context).colorScheme.primary,
                  child: Padding(
                    padding: const EdgeInsets.all(12.0),
                    child: ListView(
                      controller: scrollController,
                      shrinkWrap: true,
                      children: <Widget>[
                        AutoSizeText(
                          title,
                          style: TextStyle(
                              color: Theme.of(context).colorScheme.onPrimary),
                        ),
                        TextField(
                          decoration: InputDecoration(hintText: 'escribe aquí'),
                          controller: _marqueeController,
                          autofocus: true,
                        ),
                        FlatButton(
                          color: Colors.green,
                          child: AutoSizeText(
                            'OK',
                            style: TextStyle(color: Colors.white),
                          ),
                          onPressed: () {
                            Provider.of<FirebaseDataProvider>(context,
                                    listen: false)
                                .setMarquee(_marqueeController.text);
                            Navigator.of(context).pop();
                          },
                        ),
                        FlatButton(
                          color: Colors.red,
                          child: AutoSizeText(
                            'Cancelar',
                            style: TextStyle(color: Colors.white),
                          ),
                          onPressed: () {
                            Navigator.of(context).pop();
                          },
                        ),
                      ],
                    ),
                  ),
                ),
              );
            });
      }
    } 
    

    So right now I have to fix the height to mediaquery * 0.6 so that keyboard does not interfere with textfileld inside the modal sheet. But I would really like for the size to change depending on the keyboard size.

    I am going to attach a few pictures representing expand setting with and without keyboard...

    expand_false_no_kb expand_false_no_kb

    expand_false_with_kb expand_false_with_kb

    expand_true_no_kb expand_true_no_kb

    expand_true_with_kb expand_true_with_kb

    opened by fenchai23 21
  • Doesn't go back to the top sometimes

    Doesn't go back to the top sometimes

    Almost perfect except :

    1. sometimes when I let ago while dragging, the sheet doesn't go back to the top and just stops there. It happens quite frequently.

    2. The animation curve is ugly. Please provide a parameter to pass the animation curve. Haven't read the code but is this related to PageRoute ?

    3. Provide a parameter for the dismiss threshold. Personally, I feel it's a bit hard to dismiss. I prefer it easier to dismiss.

    I am using dev channel of flutter.

    Gif: issue01

    Regards Hiroshi

    opened by hiroshihorie 16
  • No modal animation on iOS 14

    No modal animation on iOS 14

    I don't get the iOS 13 modal animation on my iOS 14 Simulation. Using this code: showCupertinoModalBottomSheet( context: context, builder: (context) => LoginPage(), );

    I'm also using the Flutter Platform Widgets. Could this be the problem?

    opened by Urkman 15
  • version 0.2.0+1 breaks with Flutter Beta 1.22.0-12.1.pre

    version 0.2.0+1 breaks with Flutter Beta 1.22.0-12.1.pre

    flutter doctor shows:

    [✓] Flutter (Channel master, 1.22.0-10.0.pre.109, on Mac OS X 10.15.6 19G2021, locale en-GB)
    
    modal_bottom_sheet: ^0.2.0+1
    

    during compiling, it fail with:

    ../../../.pub-cache/hosted/pub.dartlang.org/modal_bottom_sheet-0.2.0+1/lib/src/bottom_sheet.dart:295:43: Error: Too few positional arguments: 1 required, 0 given.
            _velocityTracker = VelocityTracker();
                                              ^
    ../../../Sandbox/flutter/packages/flutter/lib/src/gestures/velocity_tracker.dart:152:3: Context: Found this candidate, but the arguments don't match.
      VelocityTracker(this.kind);
      ^^^^^^^^^^^^^^^
    

    Looks like flutter changed the interface:

    /// Computes a pointer's velocity based on data from [PointerMoveEvent]s.
    ///
    /// The input data is provided by calling [addPosition]. Adding data is cheap.
    ///
    /// To obtain a velocity, call [getVelocity] or [getVelocityEstimate]. This will
    /// compute the velocity based on the data added so far. Only call these when
    /// you need to use the velocity, as they are comparatively expensive.
    ///
    /// The quality of the velocity estimation will be better if more data points
    /// have been received.
    class VelocityTracker {
      /// Create a new velocity tracker for a pointer [kind].
      VelocityTracker(this.kind);
    
    opened by soloman817 14
  • CupertinoUserInterfaceLevel and ColorFilter for CupertinoBottomSheet

    CupertinoUserInterfaceLevel and ColorFilter for CupertinoBottomSheet

    This PR adds the changes discussed in #41 .

    The previousRoute is now wrapped with a ColorFilter and has a CupertinoUserInterfaceLevel.elevated thus the CupertinoDynamicColors automatically uses the elevatedColor. This makes it unnecessary to detect if dark mode is activated. The changes are only applied when the transition is started. While making the changes I noticed that even when the animation isn't started the child is wrapped with Translate and ClipRect. This is not nessecary and therefore I adding a check if the animation.value is 0 then only the child itself is displayed and otherwise the widgets nessecary for the translation. This should improve the performance a bit.

    The seconds change I made was to wrap the child of the modal with CupertinoUserInterfaceLevel and give it also an CupertinoUserInterfaceLevel.elevated .

    opened by bierbaumtim 14
  • Expose on popped API on showCupertinoModalBottomSheet

    Expose on popped API on showCupertinoModalBottomSheet

    I need to run a specific function when the modal sheet is closed or return some value, So is it possible to expose some API from CupertinoModalBottomSheetRoute which is rendered in showCupertinoModalBottomSheet

    await showCupertinoModalBottomSheet(
    	context: context,
    	builder: (context, scrollController) => Container();
    	popped: () {
           print('Modal is closed')
    	}
    );
    

    or the return value from widget which is rendered

    T result = await showCupertinoModalBottomSheet<T>(
    	context: context,
    	builder: (context, scrollController) => Container();
    );
    
    opened by Amerr 8
  • Change black background color when cupertino modal fit opens.

    Change black background color when cupertino modal fit opens.

    I'm using this with material scaffold and I wanted to achieve new ios style navigation. It works well except the background of my app is black. How do I change it ?

    opened by westdabestdb 8
  • Unwanted onWillPop calls on newest 2.0.1 version

    Unwanted onWillPop calls on newest 2.0.1 version

    Let's imagine our showCupertinoModalBottomSheet looks something like this:

    CupertinoScaffold.showCupertinoModalBottomSheet(
      expand: true,
      context: context,
      backgroundColor: Colors.transparent,
      builder: (context) => WillPopScope(
        onWillPop: onWillPop,
        child: YourContent(),
      ),
    );
    

    Problem: onWillPop from WillPopScope is called even if there was no actual pop from the modal.

    Potential reason: Probably removing the check if (widget.shouldClose != null && hasReachedWillPopThreshold) in this PR here is the reason of such behavior.

    Please let me know if I could help by providing more info.

    opened by marcsanny 7
  • Scaling down of the previous page

    Scaling down of the previous page

    Hey, thanks for the fantastic package!

    I'm successfully displaying a modal page like this: showCupertinoModalBottomSheet( expand: false, context: context, backgroundColor: Colors.transparent, builder: (context) => ItemFullView("Item") )

    However, unlike the demo app, the previous page doesn't dim and scale down. Could you please tell me what are the essential steps/changes to the page widget to get this effect?

    opened by plavunov 7
  • UI elements within Modal not rebuilding when state is changed

    UI elements within Modal not rebuilding when state is changed

    I have a modal which displays a ListView and has RadioListTiles within. When I select a RadioListTile, the state data changes but the UI won't rebuild until the modal is closed and re opened. I have also noticed when changing the elements within the modal will not hot update when you save the source.dart file - you need to close and re open the modal.

    Any ideas how to get widgets within the modal to rebuild when state is changed?

    opened by FickleLife 7
  • Add PointerDeviceKind to VelocityTracker()

    Add PointerDeviceKind to VelocityTracker()

    Ola @jamesblasco ,

    As I have mentioned in #72 I have made a fix and please do verify it and pull ASAP, cause I need to build my app, It takes large size 😜.

    Regards.

    Closes #72

    opened by yahu1031 7
  • Sheet upwards drag bug

    Sheet upwards drag bug

    When dragging upwards in modal without scroll widget like ListView the available sizing increases (doubles?). When ListView is present the issue doesn't seem to be occurring; in my observation at least.

    You can use the code from my other issue https://github.com/jamesblasco/modal_bottom_sheet/issues/294. All you have to do is open the modal and drag the modal upwards.

    opened by NikosTsesmelis 0
  • Keyboard bug

    Keyboard bug

    I have this weird and complicated bug:

    I have a nested navigator inside my sheet. Then I use the root navigator to go to a new screen; In the new screen I cannot open a keyboard.

    After some investigation I figured that this only happen when I use a key in my nested navigator.

    This happens with both sheet and modal_bottom_sheet.

    I have actually made it work with a "fix" temporarily here https://github.com/NikosTsesmelis/modal_bottom_sheet.

    This seems to be an issue primarily with the navigator but I don't seem to be able to understand why this happens and need help.

    I have created a test project to showcase this: (If you remove the navigator key this works as intended)

    import 'package:flutter/material.dart';
    import 'package:sheet/route.dart';
    
    void main() {
      runApp(const MyApp());
    }
    
    class MyApp extends StatelessWidget {
      const MyApp({super.key});
    
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: 'Flutter Demo',
          theme: ThemeData(
            primarySwatch: Colors.blue,
          ),
          onGenerateRoute: (settings) => MaterialExtendedPageRoute(
            builder: (context) => const TestScreen(),
          ),
        );
      }
    }
    
    class TestScreen extends StatefulWidget {
      const TestScreen({Key? key}) : super(key: key);
    
      @override
      _TestScreenState createState() => _TestScreenState();
    }
    
    class _TestScreenState extends State<TestScreen> {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: Center(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: [
                InkWell(
                  onTap: _openModal,
                  child: const Text('Open modal'),
                ),
                Container(
                  decoration: BoxDecoration(border: Border.all(color: Colors.black)),
                  child: const TextField(),
                ),
              ],
            ),
          ),
        );
      }
    
      void _openModal() {
        Navigator.push(
          context,
          CupertinoSheetRoute<void>(
            builder: _modalBuilder,
          ),
        );
      }
    
      Widget _modalBuilder(BuildContext context) {
        return Navigator(
          key: GlobalKey<NavigatorState>(),
          onPopPage: (route, result) {
            return false;
          },
          pages: [
            MaterialPage(
              child: Builder(builder: (context) {
                return Scaffold(
                  body: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      InkWell(
                        onTap: () => _navigateToScreen(context),
                        child: Container(
                          height: 100,
                          alignment: Alignment.center,
                          child: const Text('Root navigation'),
                        ),
                      )
                    ],
                  ),
                );
              }),
            ),
          ],
        );
      }
    
      _navigateToScreen(BuildContext context) {
        Navigator.of(context, rootNavigator: true).push(
          MaterialExtendedPageRoute(
            builder: (context) => const TestScreen(),
          ),
        );
      }
    }
    
    
    opened by NikosTsesmelis 0
  • Should be possible to pass a transitionsBuilder on the MaterialWithModalsPageRoute

    Should be possible to pass a transitionsBuilder on the MaterialWithModalsPageRoute

    Based on this issue https://github.com/Milad-Akarie/auto_route_library/issues/1283 it should be possible to add transitionsBuilder in the constructor of MaterialWithModalsPageRoute.

    I made an example of a working class here https://github.com/Milad-Akarie/auto_route_library/issues/1283#issuecomment-1325242772

    Maybe we should integrate this directly in this package ? If so I will prepare a PR.

    opened by Kiruel 0
  • the sheet doesn't have any shadow indicates the pop ups

    the sheet doesn't have any shadow indicates the pop ups

    图片

    the pops up sheets havne't any shadows at all:

    
    Navigator.of(context).push(CupertinoSheetRoute(
        initialStop: 0.5,
        stops: <double>[0, 0.5, 1],
        // fit: SheetFit.loose,
        builder: (BuildContext) {
          return Material(
              color: Colors.transparent,
              // child: SheetMediaQuery(child: SafeArea(child: widget)));
              child: SheetMediaQuery(
                  child: SafeArea(
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: <Widget>[
                    ListTile(
                      title: const Text('Edit'),
                      leading: const Icon(Icons.edit),
                      onTap: () => Navigator.of(context).pop(),
                    ),
                    ListTile(
                      title: const Text('Copy'),
                      leading: const Icon(Icons.content_copy),
                      onTap: () => Navigator.of(context).pop(),
                    ),
                    CupertinoTextField(
                      decoration: BoxDecoration(color: Colors.blue),
                      placeholder: "fuck",
                    ),
                  ],
                ),
              )));
        },
      ));
    

    any wrong?

    opened by jinfagang 0
  • Center sheet disappears in visual sheet stack

    Center sheet disappears in visual sheet stack

    I've setup a CupertinoScaffolded screen and push a showCupertinoModalBottomSheet to show my first modal. I put the contents of that modal in a CupertinoScaffold. Then open a second modal sheet on top of it, also placed within a CupertinoScaffold. Here I get the following resulting animation glitch:

    Double route visual glitch

    So the structure is as follows:

    CupertinoScaffold(body: SomeWidget) -> CupertinoScaffold.showCupertinoModalBottomSheet(CupertinoScaffold(body: SomeWidget)) -> CupertinoScaffold.showCupertinoModalBottomSheet(CupertinoScaffold(body: SomeWidget))

    I'm trying to figure out what's happening here. I can see in the animation that the stack consists of only 2 sheets, while it should be 3, the animation glitch seems to be happening on the "in between" sheet, so I'm missing that one in the visual stack. This looks like a bug of sorts, but I can't wrap my head around what exactly is causing this.

    When I change this structure to:

    CupertinoScaffold(body: SomeWidget) -> CupertinoScaffold.showCupertinoModalBottomSheet(SomeWidget) -> CupertinoScaffold.showCupertinoModalBottomSheet(CupertinoScaffold(body: SomeWidget))

    I get an "Unhandled Exception: Null check operator used on a null value" on CupertinoScaffold.of(context)!.topRadius; (cupertino_bottom_sheet.dart: 357).

    Is there someone with an idea on what's happening here and how it can be resolved?

    opened by cmkramer 0
Releases(v0.2)
  • v0.2(Jul 5, 2020)

    • Added support for scroll-to-top by tapping the status bar on iOS devices.
    • Use curveAnimation to define a custom curve animation for the modal transition
    • Bug fixes releated to horizontal scroll, clamping physics and othes.
    Source code(tar.gz)
    Source code(zip)
  • v.0.1.6(May 21, 2020)

    • Use duration to define the opening duration of the modal
    • Change the top radius of the cupertino bottom sheet with topRadius Thanks to @bierbaumtim @troyanskiy @rodineijf for the contributions
    Source code(tar.gz)
    Source code(zip)
  • v0.1.5(Apr 15, 2020)

    • Support for closing a modal with a scroll view by dragging down fast.
    • Fix assertion in CupertinoBottomSheet and BottomSheetRoute when using the CupetinoApp or WidgetsApp as root
    • Fix assertion when scrollController isn't used by the builder
    Source code(tar.gz)
    Source code(zip)
Owner
Jaime Blasco
GSoC '20 @dart-lang
Jaime Blasco
An elastic material bottom sheet implementation for Flutter.

An elastic material bottom sheet implementation for Flutter. This is still an early preview, some behaviors can change or being removed. Every feedbac

Mattia Crovero 483 Nov 28, 2022
Instagram post style button/card made for flutter

Instagram post style button/card made for flutter

Ismael Shakverdiev 12 Nov 2, 2022
A Very Flexible Widget that can Implement Material Sheets on all Directions, both modal and persistent, and consequently a Material Navigation Drawer

Flutter_MaterialSheetAndNavigationDrawer If this project helped you reduce developement time or you just want to help me continue making useful tools

Bryan Cancel 30 Dec 4, 2021
Circular Bottom Navigation Iman KhoshabiCircular Bottom Navigation [368⭐] - Beautiful animated bottom navigation bar by Iman Khoshabi.

Circular Bottom Navigation (or maybe a tab bar). This is implementation of an artwork in Uplabs Donate Support us by becoming a patron on Patreon Let'

Iman khoshabi 521 Nov 24, 2022
Flutter modal bottom route - A flutter route animation

flutter_modal_bottom_route This is a flutter route animation demo. See Chinouo J

null 4 Aug 19, 2022
Flutter 2.0 (Null safety) Snapping Modal Bottom Sheet made using sliding sheet package. 🔖

Snapping Modal Bottom Sheet Developement Stack Getting Started This project is a starting point for a Flutter application. A few resources to get you

Nakshatra Singh 3 Sep 20, 2021
New trick on how to create your own custom icons in flutter with bottom bar navigation

Customized Bottom Navigation Bar in Flutter | Tech With Sam Customized Bottom Navigation Bar in Flutter - Watch on youtube ✌   App Preview App Screens

Samuel Adekunle 10 Oct 26, 2022
Cupertino app codelab - Building a Cupertino App with Flutter

Building a Cupertino App with Flutter Flutter allows us creating Cupertino (iOS-

Abdulaziz Malikov 4 Jun 23, 2022
Flutter cupertino style date picker.

Flutter Cupertino Date Picker [pub packages] | 中文说明 Flutter cupertino date picker. Usage 1. Depend Add this to you package's pubspec.yaml file: depend

Dylan Wu 331 Oct 23, 2022
Flutter cupertino style date picker.

Flutter Cupertino Date Picker [pub packages] | 中文说明 Flutter cupertino date picker. Usage 1. Depend Add this to you package's pubspec.yaml file: depend

Dylan Wu 331 Oct 23, 2022
Cupertino version of the Material Stepper in Flutter

Cupertino Stepper for Flutter Cupertino version of the stock Material Stepper in Flutter. NOTE: This is not the same as the UIStepper control on iOS.

J-P Nurmi 18 Oct 13, 2022
Material & Cupertino SpinBox for Flutter

SpinBox for Flutter SpinBox for Flutter is a numeric input widget with an input field for entering a specific value, and spin buttons for quick, conve

J-P Nurmi 25 Nov 29, 2022
Customizable Material and Cupertino buttons with progress indicators and more

future_button Customizable Material and Cupertino buttons with progress indicators and more.

Erzhan 33 Oct 13, 2022
Loading indicator GIFs. Material and Cupertino (Android and iOS) loading indicators in assorted sizes. Use as placeholders for loading remote image assets. Demo: https://gallery.codelessly.com/flutterwebsites/loadinggifs/

Loading GIFs High quality Android and iOS loading spinners. View Demo Loading GIFs is a collection of high fidelity loading animations in GIF format.

Codelessly 30 Oct 25, 2022
Target the specific design of Material for Android and Cupertino for iOS widgets through a common set of Platform aware widgets

Flutter Platform Widgets This project is an attempt to see if it is possible to create widgets that are platform aware. Currently in order to render t

null 1.3k Nov 24, 2022
Target the specific design of Material for Android and Cupertino for iOS widgets through a common set of Platform aware widgets

Flutter Platform Widgets This project is an attempt to see if it is possible to create widgets that are platform aware. Currently in order to render t

null 1.3k Nov 30, 2022
An advanced story viewer for Flutter. Quite easy & Quite advanced

AdvStory ?? Quite simple & Quite advanced ?? Advanced Story viewer for Flutter. Supports image, video and custom stories. Full control over stories fo

Ertuğrul Yakın 21 Nov 18, 2022
An open source encrypted peer-to-peer system. Own data, own privacy. (Rust+Flutter)

An open source encrypted peer-to-peer system. Own data, own privacy. (Rust+Flutter)

Cymple Tech 124 Oct 7, 2021
An open source encrypted peer-to-peer system. Own data, own privacy.

An open source encrypted peer-to-peer system. Own data, own privacy.

Cymple Tech 449 Nov 29, 2022
Encrypted peer-to-peer system for data security. Own data, own privacy

ESSE (Encrypted Symmetrical Session Engine) An open source encrypted peer-to-pee

CympleTech 448 Nov 23, 2022