Flutter animated theme switcher

Overview

animated_theme_switcher

Pub

Animated theme switcher.

This library starts from Peyman's stackoverflow question how-to-add-animation-for-theme-switching-in-flutter

demo

Getting started

Add animated_theme_switcher: "^2.0.5" in your pubspec.yaml dependencies.

dependencies:
 animated_theme_switcher: "^2.0.5"

How To Use

Import the following package in your dart file

import 'package:animated_theme_switcher/animated_theme_switcher.dart';

Wrap MaterialApp with ThemeProvider widget, as it has shown in the following example:

  ThemeProvider(
      initTheme: initTheme,
      builder: (context, myTheme) {
        return MaterialApp(
          title: 'Flutter Demo',
          theme: myTheme,
          home: MyHomePage(),
        );
      }),
    ),

But if all you want is to provide a theme, use as follows:

  ThemeProvider(
      initTheme: initTheme,
      child: SomeCoolPage(),
    ),

Wrap the screen where you whant to make them switch with ThemeSwitchingArea widget, as it has shown in the following example:

    ThemeSwitchingArea(
      child: Builder(builder: (context) {
        return ...,
      },
    );

Wrap every switcher with ThemeSwitcher builder, and use ThemeSwitcher.of(context).changeTheme function to switch themes;

    ThemeData newTheme = ThemeData(
      primaryColor: Colors.amber
    );
    ...
    ThemeSwitcher(
      builder: (context) {
        ...
        onTap: () => ThemeSwitcher.of(context).changeTheme(
          theme: newTheme,
          isReversed: false // default: false 
        );
        ...
      },
    );

Use optional named parameter clipper to pass the custom clippers.

    ...
    ThemeSwitcher(
      clipper: ThemeSwitcherBoxClipper(),
      builder: (context) {
        ...
      },
    );

Notes:

  1. This package is not intended to persist selected theme on the local device. But we added special example to show how to do it using shared_preferences package.

  2. Use the CanvasKit rendering engine to use it on web, more about it..

Comments
  • Error on changing theme in app

    Error on changing theme in app

    Facing this error while changing theme:

    [log] Null check operator used on a null value
          #0      ThemeSwitcherCircleClipper.getClip (package:animated_theme_switcher/src/clippers/theme_switcher_circle_clipper.dart:15:25)
          #1      ThemeSwitcherClipperBridge.getClip (package:animated_theme_switcher/src/clippers/theme_switcher_clipper_bridge.dart:14:21)
          #2      _RenderCustomClip._updateClip (package:flutter/src/rendering/proxy_box.dart:1375:25)
          #3      RenderClipPath.paint (package:flutter/src/rendering/proxy_box.dart:1689:7)
          #4      RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #5      PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
          #6      RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2795:15)
          #7      RenderStack.paintStack (package:flutter/src/rendering/stack.dart:629:5)
          #8      RenderStack.paint (package:flutter/src/rendering/stack.dart:645:7)
          #9      RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #10     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
          #11     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
          #12     _RenderInkFeatures.paint (package:flutter/src/material/material.dart:551:11)
          #13     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #14     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
          #15     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
          #16     PaintingContext.pushLayer (package:flutter/src/rendering/object.dart:394:12)
          #17     RenderPhysicalModel.paint (package:flutter/src/rendering/proxy_box.dart:1922:15)
          #18     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #19     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
          #20     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
          #21     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #22     PaintingContext._repaintCompositedChild (package:flutter/src/rendering/object.dart:139:11)
          #23     PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:100:5)
          #24     PipelineOwner.flushPaint (package:flutter/src/rendering/object.dart:975:29)
          #25     RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:464:19)
          #26     WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:876:13)
          #27     RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:328:5)
          #28     SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1144:15)
          #29     SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1082:9)
          #30     SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:998:5)
          #31     _rootRun (dart:async/zone.dart:1354:13)
          #32     _CustomZone.run (dart:async/zone.dart:1258:19)
          #33     _CustomZone.runGuarded (dart:async/zone.dart:1162:7)
          #34     _invoke (dart:ui/hooks.dart:163:10)
          #35     PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:259:5)
          #36     _drawFrame (dart:ui/hooks.dart:126:31)
    [log] Null check operator used on a null value
          #0      ThemeSwitcherCircleClipper.getClip (package:animated_theme_switcher/src/clippers/theme_switcher_circle_clipper.dart:15:25)
          #1      ThemeSwitcherClipperBridge.getClip (package:animated_theme_switcher/src/clippers/theme_switcher_clipper_bridge.dart:14:21)
          #2      _RenderCustomClip._updateClip (package:flutter/src/rendering/proxy_box.dart:1375:25)
          #3      RenderClipPath.paint (package:flutter/src/rendering/proxy_box.dart:1689:7)
          #4      RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #5      PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
          #6      RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2795:15)
          #7      RenderStack.paintStack (package:flutter/src/rendering/stack.dart:629:5)
          #8      RenderStack.paint (package:flutter/src/rendering/stack.dart:645:7)
          #9      RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #10     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
          #11     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
          #12     _RenderInkFeatures.paint (package:flutter/src/material/material.dart:551:11)
          #13     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #14     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
          #15     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
          #16     PaintingContext.pushLayer (package:flutter/src/rendering/object.dart:394:12)
          #17     RenderPhysicalModel.paint (package:flutter/src/rendering/proxy_box.dart:1922:15)
          #18     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #19     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
          #20     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
          #21     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #22     PaintingContext._repaintCompositedChild (package:flutter/src/rendering/object.dart:139:11)
          #23     PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:100:5)
          #24     PipelineOwner.flushPaint (package:flutter/src/rendering/object.dart:975:29)
          #25     RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:464:19)
          #26     WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:876:13)
          #27     RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:328:5)
          #28     SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1144:15)
          #29     SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1082:9)
          #30     SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:998:5)
          #31     _rootRun (dart:async/zone.dart:1354:13)
          #32     _CustomZone.run (dart:async/zone.dart:1258:19)
          #33     _CustomZone.runGuarded (dart:async/zone.dart:1162:7)
          #34     _invoke (dart:ui/hooks.dart:163:10)
          #35     PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:259:5)
          #36     _drawFrame (dart:ui/hooks.dart:126:31)
    [log] Null check operator used on a null value
          #0      ThemeSwitcherCircleClipper.getClip (package:animated_theme_switcher/src/clippers/theme_switcher_circle_clipper.dart:15:25)
          #1      ThemeSwitcherClipperBridge.getClip (package:animated_theme_switcher/src/clippers/theme_switcher_clipper_bridge.dart:14:21)
          #2      _RenderCustomClip._updateClip (package:flutter/src/rendering/proxy_box.dart:1375:25)
          #3      RenderClipPath.paint (package:flutter/src/rendering/proxy_box.dart:1689:7)
          #4      RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #5      PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
          #6      RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2795:15)
          #7      RenderStack.paintStack (package:flutter/src/rendering/stack.dart:629:5)
          #8      RenderStack.paint (package:flutter/src/rendering/stack.dart:645:7)
          #9      RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #10     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
          #11     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
          #12     _RenderInkFeatures.paint (package:flutter/src/material/material.dart:551:11)
          #13     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #14     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
          #15     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
          #16     PaintingContext.pushLayer (package:flutter/src/rendering/object.dart:394:12)
          #17     RenderPhysicalModel.paint (package:flutter/src/rendering/proxy_box.dart:1922:15)
          #18     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #19     PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13)
          #20     RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15)
          #21     RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7)
          #22     PaintingContext._repaintCompositedChild (package:flutter/src/rendering/object.dart:139:11)
          #23     PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:100:5)
          #24     PipelineOwner.flushPaint (package:flutter/src/rendering/object.dart:975:29)
          #25     RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:464:19)
          #26     WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:876:13)
          #27     RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:328:5)
          #28     SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1144:15)
          #29     SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1082:9)
          #30     SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:998:5)
          #31     _rootRun (dart:async/zone.dart:1354:13)
          #32     _CustomZone.run (dart:async/zone.dart:1258:19)
          #33     _CustomZone.runGuarded (dart:async/zone.dart:1162:7)
          #34     _invoke (dart:ui/hooks.dart:163:10)
          #35     PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:259:5)
          #36     _drawFrame (dart:ui/hooks.dart:126:31)
    

    Code for this page:

    import 'dart:developer';
    
    import 'package:animated_theme_switcher/animated_theme_switcher.dart';
    import 'package:flutter/material.dart';
    import 'package:flutter_bloc/flutter_bloc.dart';
    import '../app/theme_config.dart';
    import '../issues/issues.dart';
    
    import 'components/components.dart';
    
    class IssuesPage extends StatefulWidget {
      const IssuesPage({Key? key}) : super(key: key);
    
      @override
      _IssuesPageState createState() => _IssuesPageState();
    }
    
    class _IssuesPageState extends State<IssuesPage> {
      @override
      Widget build(BuildContext context) {
        return ThemeSwitchingArea(
          child: Scaffold(
            appBar: AppBar(
              title: const Text('Issues'),
              leading: _themeSwitcherButton(),
            ),
            body: const IssuesList(),
          ),
        );
      }
    
      Widget _themeSwitcherButton() {
        return ThemeSwitcher(
          clipper: const ThemeSwitcherCircleClipper(),
          builder: (context) {
            return IconButton(
              icon: const Icon(Icons.dark_mode),
              onPressed: () {
                ThemeSwitcher.of(context)!.changeTheme(
                  theme: ThemeProvider.of(context)!.brightness == Brightness.light
                      ? darkTheme
                      : lightTheme,
                );
              },
            );
          },
        );
      }
    }
    

    Flutter version: 2.2.3

    opened by muhammadmateen027 8
  • ThemeSwitchingArea error

    ThemeSwitchingArea error

    When I use this as in the example I get an error:

    ════════ Exception caught by rendering library ═════════════════════════════════
    The following NoSuchMethodError was thrown during paint():
    The getter 'dx' was called on null.
    Receiver: null
    Tried calling: dx
    
    The relevant error-causing widget was
        ThemeSwitchingArea
    When the exception was thrown, this was the stack
    #0      Object.noSuchMethod  (dart:core-patch/object_patch.dart:53:5)
    #1      ThemeSwitcherCircleClipper._calcMaxRadius
    #2      ThemeSwitcherCircleClipper.getClip
    #3      ThemeSwitcherClipperBridge.getClip
    #4      _RenderCustomClip._updateClip
    ...
    The following RenderObject was being processed when the exception was fired: RenderClipPath#4c9de relayoutBoundary=up1
    RenderObject: RenderClipPath#4c9de relayoutBoundary=up1
        needs compositing
        parentData: not positioned; offset=Offset(0.0, 0.0) (can use size)
        constraints: BoxConstraints(0.0<=w<=411.4, 0.0<=h<=830.9)
        size: Size(411.4, 830.9)
        child: RenderPhysicalModel#2f2c7 relayoutBoundary=up2 NEEDS-PAINT
            needs compositing
            parentData: <none> (can use size)
            constraints: BoxConstraints(0.0<=w<=411.4, 0.0<=h<=830.9)
            layer: PhysicalModelLayer#87699 DETACHED
                engine layer: PhysicalShapeEngineLayer#1686c
                elevation: 0.0
                color: Color(0xfffafafa)
            size: Size(411.4, 830.9)
            elevation: 0.0
            color: Color(0xff303030)
            shadowColor: Color(0xff303030)
            shape: BoxShape.rectangle
            borderRadius: BorderRadius.zero
            child: _RenderInkFeatures#29c3a relayoutBoundary=up3 NEEDS-PAINT
                needs compositing
                parentData: <none> (can use size)
                constraints: BoxConstraints(0.0<=w<=411.4, 0.0<=h<=830.9)
                size: Size(411.4, 830.9)
                child: RenderCustomMultiChildLayoutBox#6539a relayoutBoundary=up4 NEEDS-PAINT
                    needs compositing
                    parentData: <none> (can use size)
                    constraints: BoxConstraints(0.0<=w<=411.4, 0.0<=h<=830.9)
                    size: Size(411.4, 830.9)
                    child 1: RenderFlex#91f0f relayoutBoundary=up5 NEEDS-PAINT
                        needs compositing
                        parentData: offset=Offset(0.0, 80.0); id=_ScaffoldSlot.body (can use size)
                        constraints: BoxConstraints(0.0<=w<=411.4, 0.0<=h<=750.9)
                        size: Size(411.4, 750.9)
                        direction: vertical
                        mainAxisAlignment: start
                        mainAxisSize: max
                        crossAxisAlignment: start
                        textDirection: ltr
                        verticalDirection: down
                    child 2: RenderConstrainedBox#0eebb relayoutBoundary=up5 NEEDS-PAINT
                        needs compositing
                        parentData: offset=Offset(0.0, 0.0); id=_ScaffoldSlot.appBar (can use size)
                        constraints: BoxConstraints(w=411.4, 0.0<=h<=830.9)
                        size: Size(411.4, 80.0)
                        additionalConstraints: BoxConstraints(0.0<=w<=Infinity, 0.0<=h<=80.0)
                    child 3: RenderStack#65589 relayoutBoundary=up5 NEEDS-PAINT
                        parentData: offset=Offset(395.4, 814.9); id=_ScaffoldSlot.floatingActionButton (can use size)
                        constraints: BoxConstraints(0.0<=w<=411.4, 0.0<=h<=830.9)
                        size: Size(0.0, 0.0)
                        alignment: centerRight
                        textDirection: ltr
                        fit: loose
                        overflow: clip
    ════════════════════════════════════════════════════════════════════════════════
    
    ════════ Exception caught by rendering library ═════════════════════════════════
    The getter 'dx' was called on null.
    Receiver: null
    Tried calling: dx
    The relevant error-causing widget was
        ThemeSwitchingArea
    ════════════════════════════════════════════════════════════════════════════════
    
    
    opened by the-thirteenth-fox 8
  • Some changes

    Some changes

    creating two same page with different themes is tricky, because we cant use duplicate global keys and 2 pages will not share states so for example drawer will close on creating new page.

    Solution : save screenshot of old Theme page and create new page with new theme, so we just recreate old page with new theme and same state.

    opened by Viper-Bit 4
  • It is not clear where to pass colors for each element!

    It is not clear where to pass colors for each element!

    It's not at all clear how to change colors !!! The theme_config.dart only has values ​​for Checkbox ... for dark and light mode there are no parameters and cannot be added! image

    And I can't figure out where to insert so that the top status bar is transparent!

    appBarTheme: AppBarTheme( systemOverlayStyle: SystemUiOverlayStyle( statusBarIconBrightness: Brightness.dark, statusBarColor: Colors.transparent, ), image

    opened by Kerabor 3
  • Animation not smooth in case of complex widget tree.

    Animation not smooth in case of complex widget tree.

    In my case, When the widget tree is complex the animation stutters. If I remove complex widgets, animation works smoothly.

    I might need to restructure the app correctly. But wondering if anyone else has also experienced this?

    Any advise would be appreciated.

    opened by omerasif57 3
  • Web support

    Web support

    Hey, Thanks for the great package! I was wondering whether you were looking to support web? I don't think it would too difficult although I'm not sure what blockers there would be.

    opened by joshbenaron 3
  • Theme Switching doesnt work on web?

    Theme Switching doesnt work on web?

    Hi,

    I was trying to use this with Flutter web and I got this error

    Error: Assertion failed: org-dartlang-sdk:///flutter_web_sdk/lib/_engine/engine/surface/scene_builder.dart:95:16 matrix4[0] == window.devicePixelRatio && matrix4[5] == window.devicePixelRatio is not true

    How do i fix it?

    opened by geektutor 3
  • Bug once theme switcher is actived and showModalBottomSheet is used

    Bug once theme switcher is actived and showModalBottomSheet is used

    I have a listview, and a theme switcher in the appbar.

    when the switch is done, changing the theme, and i call showModalBottomSheet(), it also somehow includes the first item of the listview

    see image.

    not sure if it's the prob of this lib or flutter. it worked before.

    my content is also a stack widget.

    showModalBottomSheet(
                      context: context,
                      clipBehavior: Clip.antiAliasWithSaveLayer,
                      shape: RoundedRectangleBorder(borderRadius: BorderRadius.vertical(top: Radius.circular(10.0))),
                      builder: (context) => Wrap(
                        children: [
                          _getRemoveAdsBox(),
                        ],
                      );
    

    ss

    opened by chitgoks 2
  • System controlled dark mode not working when using ThemeSwitchingArea

    System controlled dark mode not working when using ThemeSwitchingArea

    The system controlled dark mode doesn't work when using a ThemeSwitchingArea. I can use the plugin without the circle/box animation, but the effect is not the same. I also tried playing with the MaterialApp themeMode parameter, but when there's a ThemeSwitchingArea, it seems that it considers only the light theme..

    Maybe adding the darkTheme to ThemeSwitcher.of(context)!.changeTheme() could solve the issue. I really like your plugin, but I don't want to give up on system managed light/dark mode.

    opened by EngFoggy 2
  • Crash on change theme

    Crash on change theme

    When i change the theme ThemeSwitcher.

    I/flutter ( 6544): When the exception was thrown, this was the stack: I/flutter ( 6544): #0 ThemeSwitcherBoxClipper.getClip (package:animated_theme_switcher/src/clippers/theme_switcher_box_clipper.dart:14:25) I/flutter ( 6544): #1 ThemeSwitcherClipperBridge.getClip (package:animated_theme_switcher/src/clippers/theme_switcher_clipper_bridge.dart:14:21) I/flutter ( 6544): #2 _RenderCustomClip._updateClip (package:flutter/src/rendering/proxy_box.dart:1375:25) I/flutter ( 6544): #3 RenderClipPath.paint (package:flutter/src/rendering/proxy_box.dart:1689:7) I/flutter ( 6544): #4 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #5 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #6 RenderBoxContainerDefaultsMixin.defaultPaint (package:flutter/src/rendering/box.dart:2795:15) I/flutter ( 6544): #7 RenderStack.paintStack (package:flutter/src/rendering/stack.dart:629:5) I/flutter ( 6544): #8 RenderStack.paint (package:flutter/src/rendering/stack.dart:645:7) I/flutter ( 6544): #9 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #10 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #11 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #12 _RenderInkFeatures.paint (package:flutter/src/material/material.dart:551:11) I/flutter ( 6544): #13 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #14 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #15 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #16 PaintingContext.pushLayer (package:flutter/src/rendering/object.dart:394:12) I/flutter ( 6544): #17 RenderPhysicalModel.paint (package:flutter/src/rendering/proxy_box.dart:1922:15) I/flutter ( 6544): #18 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #19 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #20 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #21 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #22 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #23 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #24 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #25 PaintingContext._repaintCompositedChild (package:flutter/src/rendering/object.dart:139:11) I/flutter ( 6544): #26 PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:100:5) I/flutter ( 6544): #27 PaintingContext._compositeChild (package:flutter/src/rendering/object.dart:204:7) I/flutter ( 6544): #28 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:185:7) I/flutter ( 6544): #29 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #30 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #31 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #32 RenderAnimatedOpacityMixin.paint (package:flutter/src/rendering/proxy_box.dart:1016:17) I/flutter ( 6544): #33 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #34 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #35 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #36 RenderFractionalTranslation.paint (package:flutter/src/rendering/proxy_box.dart:2723:13) I/flutter ( 6544): #37 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #38 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #39 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #40 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #41 PaintingContext._repaintCompositedChild (package:flutter/src/rendering/object.dart:139:11) I/flutter ( 6544): #42 PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:100:5) I/flutter ( 6544): #43 PaintingContext._compositeChild (package:flutter/src/rendering/object.dart:204:7) I/flutter ( 6544): #44 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:185:7) I/flutter ( 6544): #45 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #46 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #47 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #48 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #49 RenderOffstage.paint (package:flutter/src/rendering/proxy_box.dart:3383:11) I/flutter ( 6544): #50 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #51 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #52 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #53 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #54 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #55 _RenderTheatre.paintStack (package:flutter/src/widgets/overlay.dart:780:15) I/flutter ( 6544): #56 _RenderTheatre.paint (package:flutter/src/widgets/overlay.dart:798:7) I/flutter ( 6544): #57 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #58 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #59 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #60 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #61 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #62 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #63 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #64 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #65 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #66 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #67 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #68 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #69 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #70 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #71 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #72 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #73 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #74 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #75 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #76 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:187:13) I/flutter ( 6544): #77 RenderProxyBoxMixin.paint (package:flutter/src/rendering/proxy_box.dart:140:15) I/flutter ( 6544): #78 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #79 PaintingContext._repaintCompositedChild (package:flutter/src/rendering/object.dart:139:11) I/flutter ( 6544): #80 PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:100:5) I/flutter ( 6544): #81 PaintingContext._compositeChild (package:flutter/src/rendering/object.dart:204:7) I/flutter ( 6544): #82 PaintingContext.paintChild (package:flutter/src/rendering/object.dart:185:7) I/flutter ( 6544): #83 RenderView.paint (package:flutter/src/rendering/view.dart:200:15) I/flutter ( 6544): #84 RenderObject._paintWithContext (package:flutter/src/rendering/object.dart:2317:7) I/flutter ( 6544): #85 PaintingContext._repaintCompositedChild (package:flutter/src/rendering/object.dart:139:11) I/flutter ( 6544): #86 PaintingContext.repaintCompositedChild (package:flutter/src/rendering/object.dart:100:5) I/flutter ( 6544): #87 PipelineOwner.flushPaint (package:flutter/src/rendering/object.dart:975:29) I/flutter ( 6544): #88 RendererBinding.drawFrame (package:flutter/src/rendering/binding.dart:464:19) I/flutter ( 6544): #89 WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:876:13) I/flutter ( 6544): #90 RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:328:5) I/flutter ( 6544): #91 SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1144:15) I/flutter ( 6544): #92 SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1082:9) I/flutter ( 6544): #93 SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:998:5) I/flutter ( 6544): #97 _invoke (dart:ui/hooks.dart:163:10) I/flutter ( 6544): #98 PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:259:5) I/flutter ( 6544): #99 _drawFrame (dart:ui/hooks.dart:126:31) I/flutter ( 6544): (elided 3 frames from dart:async)

    opened by vishwajit76 2
  • How to get current theme after switch?

    How to get current theme after switch?

    Hi, so onPressed this is my code

    ThemeSwitcher.of(context)!.changeTheme( theme: ThemeProvider.of(context)!.brightness == Brightness.light ? Util.getThemeDark() : Util.getThemeLight(), );

    How to get the current theme? I figured there would be something like a .then() after changeTheme() but none.

    So if i call it after the block of code above.

    ThemeProvider.of(context)!.brightness.toString() or WidgetsBinding.instance!.window.platformBrightness.toString()

    It does not get the current theme that is being switched to. Thoughts?

    opened by chitgoks 2
  • Can't use implicit animations when having ThemeSwitchingArea

    Can't use implicit animations when having ThemeSwitchingArea

    I have a simple code where I animate a container

      @override
      Widget build(BuildContext context) {
        return ThemeSwitchingArea(
          child: Scaffold(
            body: Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  AnimatedContainer(
                    duration: const Duration(seconds: 2),
                    color: _color,
                    height: _height,
                    width: _width,
                    curve: Curves.bounceInOut,
                    child: Image.asset('assets/images/coffee.png'),
                  ),
                  MaterialButton(
                    onPressed: () => setState(() {
                      _color = _color == Colors.red ? Colors.deepPurple : Colors.red;
                      _height = _height == 100 ? 200 : 100;
                      _width = _width == 100 ? 300 : 100;
                    }),
                    child: const Icon(Icons.star),
                  )
                ],
              ),
            ),
          ),
        );
      }
    
    

    I noticed that with ThemeSwitchingArea, there's no animation at all, and it only works once I remove the widget

    With ThemeSwitchingArea

    https://user-images.githubusercontent.com/11313734/190719164-db604c65-c512-4774-a2b9-fd72a60086d1.mov

    Without ThemeSwitchingArea

    https://user-images.githubusercontent.com/11313734/190719241-04f90509-1968-496c-941f-56ab5963ad0e.mov

    Any idea how to fix this issue :/

    opened by chaosLegacy 0
  • debug needs paint

    debug needs paint

    i got an issue when toggling the theme mode

    E/flutter (28682): #17     GestureBinding.handlePointerEvent
    package:flutter/…/gestures/binding.dart:338
    E/flutter (28682): #18     GestureBinding._flushPointerEventQueue
    package:flutter/…/gestures/binding.dart:296
    E/flutter (28682): #19     GestureBinding._handlePointerDataPacket
    package:flutter/…/gestures/binding.dart:279
    E/flutter (28682): #20     _rootRunUnary (dart:async/zone.dart:1442:13)
    E/flutter (28682): #21     _CustomZone.runUnary (dart:async/zone.dart:1335:19)
    E/flutter (28682): #22     _CustomZone.runUnaryGuarded (dart:async/zone.dart:1244:7)
    E/flutter (28682): #23     _invoke1 (dart:ui/hooks.dart:170:10)
    E/flutter (28682): #24     PlatformDispatcher._dispatchPointerDataPacket (dart:ui/platform_dispatcher.dart:331:7)
    E/flutter (28682): #25     _dispatchPointerDataPacket (dart:ui/hooks.dart:94:31)
    E/flutter (28682):
    
    opened by ymrabti 0
  • Demo app loses state on Hot Reload

    Demo app loses state on Hot Reload

    I am not sure of the cause of this, but the default example app that is provided with the library does not preserve state on hot reload. In this case, the counter value goes back to 0, which does not happen on the normal counter demo.

    Is there a fix for this?

    Output of flutter doctor:

    Doctor summary (to see all details, run flutter doctor -v):
    [✓] Flutter (Channel stable, 3.0.5, on Arch Linux 5.18.12-arch1-1, locale en_GB.UTF-8)
    [✓] Android toolchain - develop for Android devices (Android SDK version 32.0.0)
    [✓] Chrome - develop for the web
    [✓] Linux toolchain - develop for Linux desktop
    [!] Android Studio (not installed)
    [✓] Connected device (2 available)
    [✓] HTTP Host Availability
    
    
    opened by rishabh-os 1
  • _saveScreenshot function  (must include the statusBar & navigationBar)

    _saveScreenshot function (must include the statusBar & navigationBar)

    Hi there, thanks for this awesome package , i've check the example on the android not working like your gif example because the _saveScreenshot function take a screenshot just for previewContainer (RenderRepaintBoundary) so doesn't include the statusBar and navigationBar this caused blink the statusBar and navigationBar while changing the theme. Kind regards

    opened by BenCherif 0
Flutter-animated-ui-space-app - ⚡Animated UI Space App Challenge Part 5 🐱‍👤🐱‍👤

Flutter-animated-ui-space-app ?? ?? Project img : Image Challenge Code Image Note !! : Please include your photos to show and install simple_animation

Hmida 7 Sep 15, 2022
Easy to use, customizable and pluggable Theme Provider.

theme_provider Easy to use, customizable Theme Provider. This provides app color schemes throughout the app and automatically rebuilds the UI dynamica

K.D. Sunera Avinash Chandrasiri 143 Dec 10, 2022
✨ A collection of loading indicators animated with flutter. Heavily Inspired by http://tobiasahlin.com/spinkit.

✨ Flutter Spinkit A collection of loading indicators animated with flutter. Heavily inspired by @tobiasahlin's SpinKit. ?? Installing dependencies:

Jeremiah Ogbomo 2.7k Dec 30, 2022
Animated Menu in Flutter using radial.

Animated_radial_Menu_in_Flutter Animated Menu in Flutter using radial. Getting Started This project is a starting point for a Flutter application. A f

Habib ullah 4 Jul 18, 2022
Cool 3D Drawer Animated With flutter part 2 🔥 🔥

Cool 3D Drawer Animated With flutter part 2 ?? ??

Hmida 12 Nov 22, 2022
🐱‍👤 Flutter-Animation 🔥 🔥 List Animated Staggered Animations

??‍?? Staggered Animations made with algeria ❤

Hmida 17 Nov 22, 2022
Animated Backgrounds for Flutter.

Animated Backgrounds for Flutter Animated Backgrounds for Flutter. Easily extended to paint whatever you want on the canvas. Note: These examples are

André Baltazar 168 Nov 27, 2022
A simple animated circular menu for Flutter, Adjustable radius, colors, alignment, animation curve and animation duration.

A simple animated circular menu for Flutter, Adjustable radius, colors, alignment, animation curve and animation duration. pub package Getting Started

Hasan Mohammed 91 Dec 20, 2022
Flutter package for animated unit stepper.

stepo A highly customisable Flutter package for animated unit stepper Supported Dart Versions Dart SDK version >= 2.1.0 Demo Gif Installation Add the

hd-motion 23 Feb 4, 2021
Animated Tesla App Conect using Flutter

Animated Tesla App Conect using Flutter Watch it on YouTube Packages we are using: flutter_svg: link This video is for those who want to master Flutte

Abu Anwar 171 Dec 28, 2022
Animated collasable app drawer for flutter

collasable_drawer Animated collasable app drawer

Benjamin Mahmić 173 Jan 6, 2023
3d Drawer Animated && Made with algeria heart

Cool 3D Drawer Animated With flutter part 1 ?? ?? Getting Started # You need to import this in our file import 'dart:math'; import 'package:flutter/m

Hmida 8 Sep 10, 2022
A beautiful animated onboarding app.

Animated Onboarding Made with ?? in India This flutter app is made just to demonstrate how to we can make an animated onboarding experience that looks

Shubham Soni 117 Dec 4, 2022
Animated triangles background widget with color gradients

Triangles background Animated triangles background widget with color gradients Getting Started click image to see the video Usage add this line to pub

Marco Bavagnoli 17 Oct 13, 2022
Beautiful Animated ListView and GridView

staggered_animated_listview Beautiful Animated ListView and GridView Online Preview Getting Started This project is a starting point for a Flutter app

Elyas Sekhavati Nia 1 Dec 11, 2021
An animated menu with both RTL and LTR direction support

animated_menu A new Flutter package project. Getting Started This project is a starting point for a Dart package, a library module containing code tha

Persian Flutter Community 5 Jan 31, 2022
A collection of loading indicators animated with CSS

SpinKit Simple loading spinners animated with CSS. See demo. SpinKit only uses (transform and opacity) CSS animations to create smooth and easily cust

Tobias Ahlin 19k Dec 26, 2022
🔔 A flutter package to create cool and beautiful text animations. [Flutter Favorite Package]

Animated Text Kit A flutter package which contains a collection of some cool and awesome text animations. Recommended package for text animations in C

Ayush Agarwal 1.4k Jan 6, 2023
This repository demonstrates use of various widgets in flutter and tricks to create beautiful UI elements in flutter for Android and IOS

AwesomeFlutterUI The purpose of this repository is to demonstrate the use of different widgets and tricks in flutter and how to use them in your proje

Subir Chakraborty 132 Nov 13, 2022