{"id":21280141,"url":"https://github.com/eliezerantonio/flutter_responsivity_widget","last_synced_at":"2025-11-06T20:03:21.968Z","repository":{"id":64999551,"uuid":"568253989","full_name":"eliezerantonio/flutter_responsivity_widget","owner":"eliezerantonio","description":"A package for responsivity.","archived":false,"fork":false,"pushed_at":"2025-06-18T06:08:19.000Z","size":20646,"stargazers_count":10,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-07-11T11:15:52.069Z","etag":null,"topics":["android","dart","desktop","flutter","ios","web"],"latest_commit_sha":null,"homepage":"https://pub.dev/packages/flutter_responsivity_widget","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/eliezerantonio.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":"2022-11-19T23:30:33.000Z","updated_at":"2025-06-18T06:08:58.000Z","dependencies_parsed_at":"2024-11-21T10:39:12.245Z","dependency_job_id":null,"html_url":"https://github.com/eliezerantonio/flutter_responsivity_widget","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/eliezerantonio/flutter_responsivity_widget","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eliezerantonio%2Fflutter_responsivity_widget","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eliezerantonio%2Fflutter_responsivity_widget/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eliezerantonio%2Fflutter_responsivity_widget/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eliezerantonio%2Fflutter_responsivity_widget/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/eliezerantonio","download_url":"https://codeload.github.com/eliezerantonio/flutter_responsivity_widget/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/eliezerantonio%2Fflutter_responsivity_widget/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":283073600,"owners_count":26774726,"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-11-06T02:00:06.180Z","response_time":55,"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":["android","dart","desktop","flutter","ios","web"],"created_at":"2024-11-21T10:28:29.208Z","updated_at":"2025-11-06T20:03:21.963Z","avatar_url":"https://github.com/eliezerantonio.png","language":"Dart","funding_links":[],"categories":[],"sub_categories":[],"readme":"# flutter\\_responsivity\\_widget\n\n by: [Eliezer Antonio](https://github.com/eliezerantonio)\n\n##### You can achieve this result, fully adjustable to your screen size \n\n## Note\n\nMost of us Flutter developers add fixed sizes to our components, whether it's text, images, or other widgets, and sometimes because of this, on different screen sizes, we end up with the famous overflow error. With this package, each component adjusts to every different device size. Although there are other approaches to solve this, an automatic adaptation that provides the right size for each device can be better in terms of UX and has other advantages.\n\n## Features\n\n  - [X] Width in percent\n  - [X] Height in percent\n  - [X] Diagonal in percent\n  - [X] Detect tablet size\n\n## Supported Platforms\n\n  - Flutter Android\n  - Flutter iOS\n  - Flutter web\n  - Flutter desktop\n\n## Preview\n\n## Installation\n\nAdd `flutter_responsivity_widget: ^0.0.1` to your `pubspec.yaml` dependency file. And import:\n\n```dart\nimport 'package:flutter_responsivity_widget/flutter_responsivity_widget.dart';\n```\n\n## How to use\n\n```dart\n\n```\n\n## Examples\n\n```dart\n\nclass ExamplePage extends StatelessWidget {\n  const ExamplePage({super.key});\n\n  @override\n  Widget build(BuildContext context) {\n    final responsive = Responsive(context);\n    return Scaffold(\n      backgroundColor: Colors.white,\n      body: Center(\n        child: Image.asset(\n          'assets/logo_jp.jpg',\n          width: responsive.wp(100), // wp- width in %\n          height: responsive.hp(100), // hp- height in %\n        ),\n      ),\n    );\n  }\n}\n\n\n```\n\n### Example with text\n\n###### For texts, it is recommended to use the diagonal percentage\n\n```dart\n\nclass ExamplePage extends StatelessWidget {\n  const ExamplePage({super.key});\n\n  @override\n  Widget build(BuildContext context) {\n    final responsive = Responsive(context);\n    return Scaffold(\n      backgroundColor: Colors.white,\n      body: Center(\n        child: Text(\n          'Example',\n          style: TextStyle(\n            fontSize: responsive.dp(8), // dp- diagonal in %\n          ),\n        ),\n      ),\n    );\n  }\n}\n\n\n```\n\n##### Result of the example above\n\n### Example detecting tablet size\n\n###### In case you want to show different content for a tablet and a phone\n\n```dart\n\nclass ExamplePage extends StatelessWidget {\n  const ExamplePage({super.key});\n\n  @override\n  Widget build(BuildContext context) {\n    final responsive = Responsive(context);\n    final isTablet = responsive.isTablet;\n    return Scaffold(\n      backgroundColor: Colors.white,\n      body: Center(\n        child: isTablet\n            ? Text(\n                'iPad',\n                style: TextStyle(\n                  fontSize: responsive.dp(10),\n                ),\n              )\n            : Text( 'iPhone',\n                style: TextStyle(\n                  fontSize: responsive.dp(10), \n                )\n              ),\n      ),\n    );\n  }\n}\n\n\n```\n\n### Result of the example above\n\n## My Packages\n\n  [flutter\\_carousel\\_intro](https://github.com/eliezerantonio/flutter_carousel_intro)\n\n-----\n\n## Contributing\n\nContributions are welcome\\! If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag \"enhancement\".\n\n1.  Fork the Project\n2.  Create your Feature Branch (`git checkout -b feature/AmazingFeature`)\n3.  Commit your Changes (`git commit -m 'Add some AmazingFeature'`)\n4.  Push to the Branch (`git push origin feature/AmazingFeature`)\n5.  Open a Pull Request\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feliezerantonio%2Fflutter_responsivity_widget","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Feliezerantonio%2Fflutter_responsivity_widget","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feliezerantonio%2Fflutter_responsivity_widget/lists"}