{"id":13550202,"url":"https://github.com/BBarisKilic/Animated-SVG","last_synced_at":"2025-04-02T23:32:10.504Z","repository":{"id":40436482,"uuid":"484225419","full_name":"BBarisKilic/Animated-SVG","owner":"BBarisKilic","description":"Flutter package for displaying and animating Scalable Vector   Graphics 1.1 files. The package has been written solely in Dart Language.","archived":false,"fork":false,"pushed_at":"2024-10-11T20:09:47.000Z","size":4486,"stargazers_count":15,"open_issues_count":0,"forks_count":5,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-11-03T19:37:46.124Z","etag":null,"topics":["android","animated-svg","animated-vector-drawables","dart","flutter","ios","linux","macos","package","svg","svg-animations","web","windows"],"latest_commit_sha":null,"homepage":"https://pub.dev/packages/animated_svg","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/BBarisKilic.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","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":"2022-04-21T22:42:39.000Z","updated_at":"2024-10-11T20:09:45.000Z","dependencies_parsed_at":"2024-11-03T19:41:54.341Z","dependency_job_id":null,"html_url":"https://github.com/BBarisKilic/Animated-SVG","commit_stats":{"total_commits":66,"total_committers":2,"mean_commits":33.0,"dds":"0.015151515151515138","last_synced_commit":"6dc20acbf7e0c1d19e0efb7eae5c2cacd91cc959"},"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BBarisKilic%2FAnimated-SVG","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BBarisKilic%2FAnimated-SVG/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BBarisKilic%2FAnimated-SVG/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/BBarisKilic%2FAnimated-SVG/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/BBarisKilic","download_url":"https://codeload.github.com/BBarisKilic/Animated-SVG/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246911369,"owners_count":20853653,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["android","animated-svg","animated-vector-drawables","dart","flutter","ios","linux","macos","package","svg","svg-animations","web","windows"],"created_at":"2024-08-01T12:01:30.145Z","updated_at":"2025-04-02T23:32:09.697Z","avatar_url":"https://github.com/BBarisKilic.png","language":"Dart","funding_links":[],"categories":["Dart"],"sub_categories":[],"readme":"# Animated SVG | Flutter Package\n\n[Flutter][flutter_dev_link] package for displaying and animating Scalable Vector Graphics 1.1 files. The package has been written solely in [Dart][dart_dev_link] language.\n\n\u003cdiv align=\"center\"\u003e\n\n[![animated_svg][build_status_badge]][workflow_link]\n![coverage][coverage_badge]\n[![style: very good analysis][very_good_analysis_badge]][very_good_analysis_link]\n[![License: MIT][license_badge]][license_link]\n\n\u003c/div\u003e\n\n\n| ![animated_svg_first_gif][animated_svg_first_gif] | ![animated_svg_second_gif][animated_svg_second_gif]   \n| :-: | :-: |\n\n## Features\n\nA powerful and fully customizable widget. With this package, you can animate `SVGs` without effort and make your `UI` look more lovely.\n\nThe `AnimatedSvg` widget creates a smooth transition between the two SVGs you assign.\n\n\u003cp align=\"center\"\u003e\n    \u003cimg src=\"https://github.com/BBarisKilic/Animated-SVG/blob/master/art/animated_svg_1.png?raw=true\" width=\"300\"\u003e\n    \u0026nbsp; \n    \u0026nbsp;\n    \u003cimg src=\"https://github.com/BBarisKilic/Animated-SVG/blob/master/art/animated_svg_2.png?raw=true\" width=\"300\"\u003e\n\u003c/p\u003e\n\n## Getting started\n\nLet's take a look at how to implement `AnimatedSvg` to quickly create cool transition animation between `SVGs`.\n\nFirst, add the following line to `pubspec.yaml`:\n```yaml\nanimated_svg: ^2.1.0\n```\n\nSecond, import `AnimatedSvg`:\n```dart\nimport 'package:animated_svg/animated_svg.dart';\n```\n\n## Usage\n\nBasic usage example: \n\n`main.dart`\n```dart\n// Define an SvgController\nlate final SvgController controller;\n\n@override\nvoid initState() {\n    // Initialize SvgController\n    controller = AnimatedSvgController();\n    super.initState();\n}\n\n@override\nvoid dispose() {\n    // Dispose SvgController\n    controller.dispose();\n    super.dispose();\n}\n\n@override\nWidget build(BuildContext context) {\n    // Call the AnimatedSvg widget anywhere in your widget tree.\n    return AnimatedSvg(\n        controller: controller,\n        duration: const Duration(milliseconds: 600),\n        onTap: () {},\n        size: 80,\n        clockwise: false,\n        isActive: true,\n        children: [\n            SvgPicture.asset(\n                'assets/play.svg',\n            ),\n            SvgPicture.asset(\n                'assets/pause.svg',\n            ),\n        ],\n    );\n}\n```\n\n## Example\n\nMore examples can be found in `/example` folder on [GitHub][animated_svg_github_link]. \n\n[Media Player][example_media_player_link] - an example of basic implementation of `AnimatedSvg`. Simple project that simulates a media player. As usual, the player needs play and pause buttons. Thanks to the `AnimatedSvg` package, it is so easy to create a smooth transition between play and pause SVGs.\n\n## Additional information\n\nThis package has been written solely in Dart Language yet it has the [flutter_svg][flutter_svg_link] as a dependency.\n\nFor more information please visit [GitHub][animated_svg_github_link].\n\n## Feature requests and bugs\n\nPlease file feature requests and bugs at the [issue tracker][animated_svg_issue_link].\n\n## Maintainers\n\n- [Bulent Baris Kilic][maintainer_one_link]\n\n[flutter_dev_link]: https://flutter.dev/\n[dart_dev_link]: https://dart.dev/\n[build_status_badge]: https://github.com/BBarisKilic/Animated-SVG/actions/workflows/main.yaml/badge.svg\n[workflow_link]: https://github.com/BBarisKilic/Animated-SVG/actions/workflows/main.yaml\n[coverage_badge]: coverage_badge.svg\n[very_good_analysis_badge]: https://img.shields.io/badge/style-very_good_analysis-B22C89.svg\n[very_good_analysis_link]: https://pub.dev/packages/very_good_analysis\n[license_badge]: https://img.shields.io/badge/license-MIT-blue.svg\n[license_link]: https://opensource.org/licenses/MIT\n[animated_svg_first_gif]: https://github.com/BBarisKilic/Animated-SVG/blob/master/art/animated_svg_gif_1.gif?raw=true\n[animated_svg_second_gif]: https://github.com/BBarisKilic/Animated-SVG/blob/master/art/animated_svg_gif_2.gif?raw=true\n[animated_svg_github_link]: https://github.com/BBarisKilic/Animated-SVG\n[example_media_player_link]: https://github.com/BBarisKilic/Animated-SVG/tree/master/example/media_player\n[flutter_svg_link]: https://github.com/dnfield/flutter_svg\n[animated_svg_issue_link]: https://github.com/BBarisKilic/Animated-SVG/issues\n[maintainer_one_link]: https://github.com/BBarisKilic","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FBBarisKilic%2FAnimated-SVG","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FBBarisKilic%2FAnimated-SVG","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FBBarisKilic%2FAnimated-SVG/lists"}