{"id":16382278,"url":"https://github.com/iamsahdeep/liquid_button","last_synced_at":"2025-03-23T03:33:19.702Z","repository":{"id":56834007,"uuid":"243506916","full_name":"iamSahdeep/liquid_button","owner":"iamSahdeep","description":"Liquify your buttons, web demo at website","archived":false,"fork":false,"pushed_at":"2020-03-01T20:01:43.000Z","size":2504,"stargazers_count":21,"open_issues_count":0,"forks_count":6,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-18T17:24:43.058Z","etag":null,"topics":["button","button-animation","button-widget","buttons","flutter","flutter-apps","flutter-package","flutter-plugin","flutter-ui","flutter-widget","liquid","liquidity","wave"],"latest_commit_sha":null,"homepage":"https://iamsahdeep.github.io/liquid_button/#/","language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/iamSahdeep.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"github":null,"patreon":"iamSahdeep","open_collective":null,"ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"custom":["paypal.me/sahdeep"]}},"created_at":"2020-02-27T11:49:37.000Z","updated_at":"2025-02-05T13:00:17.000Z","dependencies_parsed_at":"2022-09-08T07:41:48.768Z","dependency_job_id":null,"html_url":"https://github.com/iamSahdeep/liquid_button","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iamSahdeep%2Fliquid_button","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iamSahdeep%2Fliquid_button/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iamSahdeep%2Fliquid_button/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/iamSahdeep%2Fliquid_button/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/iamSahdeep","download_url":"https://codeload.github.com/iamSahdeep/liquid_button/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245052662,"owners_count":20553162,"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":["button","button-animation","button-widget","buttons","flutter","flutter-apps","flutter-package","flutter-plugin","flutter-ui","flutter-widget","liquid","liquidity","wave"],"created_at":"2024-10-11T04:04:48.676Z","updated_at":"2025-03-23T03:33:19.015Z","avatar_url":"https://github.com/iamSahdeep.png","language":"Dart","readme":"\u003ch1 align=\"center\" xmlns=\"http://www.w3.org/1999/html\"\u003e\n  \u003cbr\u003e\n   \u003cimg src=\"https://github.com/iamSahdeep/liquid_button/blob/master/Assets/topImage.png\" alt=\"Logo Liquid Button\" title=\"Liquid Button\" /\u003e\n  \u003cbr\u003e\n\u003c/h1\u003e\n\u003cp align=\"center\"\u003e\n \u003ca href=\"https://github.com/iamSahdeep/liquid_button/releases\" \u003cimg height=\"20\" alt=\"GitHub All Releases\" src=\"https://img.shields.io/github/downloads/iamSahdeep/liquid_button/total.svg?style=for-the-badge\"\u003e\u003c/a\u003e\n \u003ca href=\"https://pub.dev/packages/liquid_button\"\u003e \u003cimg height=\"20\" alt=\"Pub\" src=\"https://img.shields.io/pub/v/liquid_button.svg?style=for-the-badge\"\u003e\u003c/a\u003e\n \u003ca href=\"https://github.com/iamSahdeep/liquid_swipe_button/blob/master/LICENSE\"\u003e\u003cimg src=\"https://img.shields.io/badge/license-APACHE2.0-blue.svg?longCache=true\u0026style=flat-square\"\u003e\u003c/a\u003e\n   \u003ca href=\"https://flutter.dev\"\u003e\u003cimg src=\"https://img.shields.io/badge/Built%20for-Flutter-blue.svg?longCache=true\u0026style=flat-square\" \"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  Hi, Introducing Liquid Button for Flutter. It supports Web and Mobile, not tested on Ios. Inspired by \u003ca href=\"https://codepen.io/electerious/pen/gOOLgjd\"\u003eLiquid Button in JS\u003c/a\u003e.\n\u003c/p\u003e\n\n## Preview\n\u003cp align=\"center\"\u003e\n\u003cimg src=\"https://github.com/iamSahdeep/liquid_button/blob/master/Assets/exampleMobile.gif\" width=\"360\" height=\"640\"\u003e\n\u003c/p\u003e\n\n\n## Live Demo\n\nDownload sample apk as shown in example from releases.\n\n\u003ca href='https://github.com/iamSahdeep/liquid_button/releases'\u003e\u003cimg alt='Get it from Github Releases' src='https://i0.wp.com/dimitrology.com/wp-content/uploads/2017/02/download-apk.png?resize=172%2C100\u0026ssl=1' width=\"200\" height=\"100\"/\u003e\u003c/a\u003e\n\n\nExperience Live Demo on (not on mobile) : https://iamsahdeep.github.io/liquid_button/#/\n\n\n## Getting Started\n* Add this to your pubspec.yaml\n  ```\n  dependencies:\n  liquid_button: 1.0.0\n\n  ```\n* Get the package from Pub:\n\n  ```\n  flutter packages get\n  ```\n* Import it in your file\n\n  ```\n  import 'package:liquid_button/liquid_button.dart';\n  ```\n\n# Example\n- Look for complete example in [example](https://github.com/iamSahdeep/liquid_button/blob/master/example) folder.\n- Remember to wrap it with GestureDetector or InkWell, might include in next version.\n\n```\n                LiquidButton(\n                  expandFactor: 20,\n                  backgroundColor: Colors.black87,\n                  height: 100,\n                  child: Text(\n                    \"Liquid Button\",\n                    style: TextStyle(\n                        fontSize: 30,\n                        color: Colors.white,\n                        fontWeight: FontWeight.bold),\n                  ),\n                  gradientColor: Colors.black54,\n                  width: 400,\n                ),\n```\n\n## Attributes\nCurrently we have 3 buttons : RoundClothButton(poor naming :p), ClothButton and LiquidButton.\nHere are some of the attributes in which height,width and background color is the required. Rest can be left to have default values.\n* **expandFactor** : (double) Allows you to decide Expansion of the button while animating. Should be less than 50.\n* **backgroundColor** : (Color) Color of the button.\n* **gradientColor** : (Color) If you want gradient effect onHover, if not given no color effect will be there.\n* **retainGradient** : (bool) If you want to retain the gradient effect when mouse leaves the button area. Default is false.\n* **gap** : (int) Integer to provide gap between subsequent point while painting the line. Do experiment with it, Should not be greater that height/2.\n\n# Known Issues\n\n   * **Lag on Web** - It generally happens when we are using multiple Liquid Buttons on same screen due to usage of `MouseRegion`.You might experience the same on the live demo also. Check this issue https://github.com/flutter/flutter/issues/41194\n   * **Gesture not working on Web on Mobile** - Need to work on it..\n   * **Note** : Please report any kind of bugs you are experiencing.\n\n\n## Author \u0026 support\nThis project is created by [Sahdeep Singh](https://github.com/iamSahdeep) but with lots of support and help.\n\u003e If you appreciate my work, consider buying me a cup of :coffee: to keep me recharged :metal:\n\u003e  + [PayPal](https://www.paypal.me/sahdeep)\n\u003e \n\u003e Or you can also endorse me on [LinkedIn](https://www.linkedin.com/in/iamsahdeep/) to keep me motivated.\n\u003e \n\u003e I love my work and I'm available for freelance work. Contact me on my email: sahdeepsingh98@gmail.com\n\n\n\u003cimg src=\"https://cdn-images-1.medium.com/max/1200/1*2yFbiGdcACiuLGo4dMKmJw.jpeg\" width=\"90\" height=\"35\"\u003e\n","funding_links":["https://patreon.com/iamSahdeep","paypal.me/sahdeep","https://www.paypal.me/sahdeep"],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fiamsahdeep%2Fliquid_button","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fiamsahdeep%2Fliquid_button","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fiamsahdeep%2Fliquid_button/lists"}