{"id":18977940,"url":"https://github.com/vorkytaka/animated_line_through","last_synced_at":"2025-08-05T09:09:22.565Z","repository":{"id":192112463,"uuid":"686377845","full_name":"Vorkytaka/animated_line_through","owner":"Vorkytaka","description":"Animated line through for Flutter","archived":false,"fork":false,"pushed_at":"2024-12-01T11:16:42.000Z","size":612,"stargazers_count":3,"open_issues_count":5,"forks_count":2,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-06T15:54:30.483Z","etag":null,"topics":["animation","dart","flutter","flutter-plugin","flutter-text-animations","flutter-ui"],"latest_commit_sha":null,"homepage":"https://pub.dev/packages/animated_line_through","language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"bsd-3-clause","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Vorkytaka.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":"2023-09-02T15:34:35.000Z","updated_at":"2025-02-09T13:19:18.000Z","dependencies_parsed_at":"2023-09-02T17:01:13.523Z","dependency_job_id":"7f40b18e-867b-4455-b09f-98f4ff741dcf","html_url":"https://github.com/Vorkytaka/animated_line_through","commit_stats":null,"previous_names":["vorkytaka/animated_line_through"],"tags_count":5,"template":false,"template_full_name":null,"purl":"pkg:github/Vorkytaka/animated_line_through","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vorkytaka%2Fanimated_line_through","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vorkytaka%2Fanimated_line_through/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vorkytaka%2Fanimated_line_through/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vorkytaka%2Fanimated_line_through/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Vorkytaka","download_url":"https://codeload.github.com/Vorkytaka/animated_line_through/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vorkytaka%2Fanimated_line_through/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":268867091,"owners_count":24320285,"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","status":"online","status_checked_at":"2025-08-05T02:00:12.334Z","response_time":2576,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":["animation","dart","flutter","flutter-plugin","flutter-text-animations","flutter-ui"],"created_at":"2024-11-08T15:31:27.030Z","updated_at":"2025-08-05T09:09:22.515Z","avatar_url":"https://github.com/Vorkytaka.png","language":"Dart","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Animated Line Through\n\nA super simple package to add animated line through text in your Flutter app!\n\nWe created this package because Flutter currently lacks built-in support for animating text\ndecorations, particularly the line through effect.\n\n![Example](https://github.com/Vorkytaka/animated_line_through/blob/media/gif/example.gif?raw=true)\n\n### Usage\n\nThis package provides two widgets: `AnimatedLineThrough` and `AnimatedLineThroughRaw`.\n\nBoth widgets require a `child` argument, which must be a widget that uses either `RenderParagraph` or\n`RenderEditable` as its render object. Without this, the line through effect won't work.\n\nTypically, you'll use widgets like `Text`, `RichText`, `TextField`, or `TextFormField`.\n\n#### AnimatedLineThrough\n\nThe `AnimatedLineThrough` widget is ready to use out-of-the-box, just like any other declarative\nwidget. It expects 3 arguments: `duration`, `isCrossed` and `strokeWidth`(optional). \n\nHere's an example using `Text` as the child widget:\n\n```dart\nAnimatedLineThrough(\n  duration: const Duration(milliseconds: 500),\n  isCrossed: _isCrossed,\n  strokeWidth: 2,\n  child: Text('Our text'),\n);\n```\n\n- `duration` specifies the duration of the animation,\n- `isCrossed` is a boolean that indicates whether the text should have a line through effect or not,\n- `strokeWidth` defines the width of the line-through to paint over the text.\n\n#### AnimatedLineThroughRaw\n\nThe `AnimatedLineThroughRaw` widget gives you more control over the line animation. It expects an\n`Animation\u003cdouble\u003e` object for line progress and a `color` for the line.\n\nHere's an example using `AnimationController` and `Tween` to control the line animation:\n\n```dart\nlate final _controller = AnimationController();\nlate final _animation = Tween(begin: 0.0, end: 1.0).animate(\n  CurvedAnimation(\n    parent: _controller,\n    curve: const Interval(0, 0.7, curve: Curves.easeInOut),\n  ),\n);\n\nAnimatedLineThroughRaw(\n  crossed: _animation,\n  color: Colors.black,\n  strokeWidth: 2.5,\n  child: Text('Our text'),\n);\n```\n\n### Text Fields issues\n\nThe workaround for `TextField` (and `TextFormField`) is much more complex than the workaround for simple `Text` widget.\nThe problem is that those widgets doesn't use `RenderEditable` directly, but have many widget before that.\n\nSo, instead of simple get `RenderEditable` we need to find it through render-tree, try to find `RenderBox` above it and then count everything we need to draw a cross line.\n\nBut for you it's just that simple as use with simple `Text` widget, just wrap your `TextField` (or `TextFormField`) with `AnimatedLineThrough`:\n\n```dart\nAnimatedLineThrough(\n  duration: const Duration(milliseconds: 500),\n  isCrossed: _isCrossed,\n  strokeWidth: 2,\n  child: TextField(),\n);\n```\n\nAs the version 1.0.3 we fix main problem with editable widgets, so from now on it's count width of each line correctly.\n\nI hope this helps! Let me know if you have any further questions or issues. 🧡","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvorkytaka%2Fanimated_line_through","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvorkytaka%2Fanimated_line_through","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvorkytaka%2Fanimated_line_through/lists"}