{"id":13552384,"url":"https://github.com/kherel/animated_theme_switcher","last_synced_at":"2026-03-01T14:03:19.485Z","repository":{"id":42233738,"uuid":"253464927","full_name":"kherel/animated_theme_switcher","owner":"kherel","description":"Flutter animated theme switcher","archived":false,"fork":false,"pushed_at":"2024-12-13T11:04:56.000Z","size":4944,"stargazers_count":280,"open_issues_count":8,"forks_count":28,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-03T03:33:05.002Z","etag":null,"topics":["flutter","flutter-animation","theme"],"latest_commit_sha":null,"homepage":"https://pub.dev/packages/animated_theme_switcher","language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/kherel.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-04-06T10:29:44.000Z","updated_at":"2025-02-23T12:33:58.000Z","dependencies_parsed_at":"2023-12-03T05:22:22.951Z","dependency_job_id":"20c0bb3b-1451-46f3-8f19-bf9053b3124d","html_url":"https://github.com/kherel/animated_theme_switcher","commit_stats":{"total_commits":79,"total_committers":13,"mean_commits":6.076923076923077,"dds":0.3417721518987342,"last_synced_commit":"0be12c7bd291a71eb2ff9f16de16c1bfe515230b"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/kherel/animated_theme_switcher","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kherel%2Fanimated_theme_switcher","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kherel%2Fanimated_theme_switcher/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kherel%2Fanimated_theme_switcher/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kherel%2Fanimated_theme_switcher/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/kherel","download_url":"https://codeload.github.com/kherel/animated_theme_switcher/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kherel%2Fanimated_theme_switcher/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29970543,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-01T13:32:00.443Z","status":"ssl_error","status_checked_at":"2026-03-01T13:32:00.084Z","response_time":124,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["flutter","flutter-animation","theme"],"created_at":"2024-08-01T12:02:03.216Z","updated_at":"2026-03-01T14:03:19.450Z","avatar_url":"https://github.com/kherel.png","language":"Dart","funding_links":[],"categories":["Dart"],"sub_categories":[],"readme":"# animated_theme_switcher\n\n[![Pub](https://img.shields.io/pub/v/animated_theme_switcher.svg)](https://pub.dartlang.org/packages/animated_theme_switcher)\n\n\nAnimated theme switcher.\n\nThis library starts from [Peyman's](https://stackoverflow.com/users/4910935/peyman) stackoverflow question [how-to-add-animation-for-theme-switching-in-flutter](https://stackoverflow.com/questions/60897816/how-to-add-animation-for-theme-switching-in-flutter)\n\n![demo](demo.gif)\n\n## Getting started\n\nAdd animated_theme_switcher: \"^2.0.8\" in your pubspec.yaml dependencies.\n\n```yaml\ndependencies:\n animated_theme_switcher: \"^2.0.8\"\n```\n\n### How To Use\n\nImport the following package in your dart file\n\n```dart\nimport 'package:animated_theme_switcher/animated_theme_switcher.dart';\n```\n\nWrap MaterialApp with ThemeProvider widget, as it has shown in the following example:\n\n```dart\n  ThemeProvider(\n      initTheme: initTheme,\n      builder: (context, myTheme) {\n        return MaterialApp(\n          title: 'Flutter Demo',\n          theme: myTheme,\n          home: MyHomePage(),\n        );\n      }),\n    ),\n```\n\nBut if all you want is to _provide_ a theme, use as follows:\n\n```dart\n  ThemeProvider(\n      initTheme: initTheme,\n      child: SomeCoolPage(),\n    ),\n```\n\nWrap the screen where you whant to make them switch with ThemeSwitchingArea widget, as it has shown in the following example: \n\n```dart\n    ThemeSwitchingArea(\n      child: Builder(builder: (context) {\n        return ...,\n      },\n    );\n```\n\n\nWrap every switcher with ThemeSwitcher builder, and use ThemeSwitcher.of(context).changeTheme function to switch themes;\n\n```dart\n\n    ThemeData newTheme = ThemeData(\n      primaryColor: Colors.amber\n    );\n    ...\n    ThemeSwitcher(\n      builder: (context) {\n        ...\n        onTap: () =\u003e ThemeSwitcher.of(context).changeTheme(\n          theme: newTheme,\n          isReversed: false // default: false \n        );\n        ...\n      },\n    );\n```\n\nAlternatively you could use ThemeSwitcher.switcher() or ThemeSwitcher.withTheme().  \nBuilders of this constructors already provide you ThemeSwitcher.  \nThemeSwitcher.withTheme() also provides current theme:\n\n```dart\n    ThemeSwitcher.switcher(\n      builder: (context, switcher) {\n        ...\n        onTap: () =\u003e switcher.changeTheme(\n          theme: newTheme,\n        );\n        ...\n      },\n    );\n    \n    ThemeSwitcher.withTheme(\n      builder: (context, switcher, theme) {\n        ...\n        onTap: () =\u003e switcher.changeTheme(\n          theme: theme.brightness == Brightness.light\n              ? darkTheme\n              : lightTheme,\n        );\n        ...\n      },\n    );\n```\n\nUse optional named parameter clipper to pass the custom clippers.\n\n```dart\n    ...\n    ThemeSwitcher(\n      clipper: ThemeSwitcherBoxClipper(),\n      builder: (context) {\n        ...\n      },\n    );\n```\n\n**Notes:**\n\n1. This package is not intended to persist selected theme on the local device. But we added [special example](https://github.com/kherel/animated_theme_switcher/blob/master/example/lib/with_saving_theme.dart) to show how to do it using [shared_preferences](https://pub.dev/packages/shared_preferences) package.\n\n2. Use the CanvasKit rendering engine to use it on **web**, [more about it..](https://github.com/kherel/animated_theme_switcher/issues/23)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkherel%2Fanimated_theme_switcher","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkherel%2Fanimated_theme_switcher","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkherel%2Fanimated_theme_switcher/lists"}