{"id":13684892,"url":"https://github.com/fluttercommunity/breakpoint","last_synced_at":"2025-04-15T04:25:49.090Z","repository":{"id":35151673,"uuid":"188468223","full_name":"fluttercommunity/breakpoint","owner":"fluttercommunity","description":"Breakpoint - A Flutter plugin to calculate the material design breakpoints. Maintainer: @rodydavis","archived":false,"fork":false,"pushed_at":"2022-02-16T01:30:26.000Z","size":13576,"stargazers_count":109,"open_issues_count":1,"forks_count":9,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-04-10T05:07:04.368Z","etag":null,"topics":["breakpoint","flutter","layout-builder","material","material-design"],"latest_commit_sha":null,"homepage":"https://fluttercommunity.github.io/breakpoint/","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/fluttercommunity.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}},"created_at":"2019-05-24T18:16:28.000Z","updated_at":"2025-01-26T16:12:32.000Z","dependencies_parsed_at":"2022-07-25T19:17:52.586Z","dependency_job_id":null,"html_url":"https://github.com/fluttercommunity/breakpoint","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fluttercommunity%2Fbreakpoint","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fluttercommunity%2Fbreakpoint/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fluttercommunity%2Fbreakpoint/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fluttercommunity%2Fbreakpoint/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fluttercommunity","download_url":"https://codeload.github.com/fluttercommunity/breakpoint/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249005276,"owners_count":21197030,"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":["breakpoint","flutter","layout-builder","material","material-design"],"created_at":"2024-08-02T14:00:40.329Z","updated_at":"2025-04-15T04:25:49.062Z","avatar_url":"https://github.com/fluttercommunity.png","language":"Dart","funding_links":["https://www.buymeacoffee.com/rodydavis","https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick\u0026hosted_button_id=WSH3GVC49GNNJ"],"categories":["Dart"],"sub_categories":[],"readme":"[![Flutter Community: breakpoint](https://fluttercommunity.dev/_github/header/breakpoint)](https://github.com/fluttercommunity/community)\n\n[![Buy Me A Coffee](https://img.shields.io/badge/Donate-Buy%20Me%20A%20Coffee-yellow.svg)](https://www.buymeacoffee.com/rodydavis)\n[![Donate](https://img.shields.io/badge/Donate-PayPal-green.svg)](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick\u0026hosted_button_id=WSH3GVC49GNNJ)\n![github pages](https://github.com/fluttercommunity/breakpoint/workflows/github%20pages/badge.svg)\n[![GitHub stars](https://img.shields.io/github/stars/fluttercommunity/breakpoint?color=blue)](https://github.com/fluttercommunity/breakpoint)\n[![breakpoint](https://img.shields.io/pub/v/breakpoint.svg)](https://pub.dev/packages/breakpoint)\n\n\n# breakpoint\n\nView the online demo [here](https://fluttercommunity.github.io/breakpoint/#/)!\n\n## Overview\n\nFollows Material Design [Docs](https://material.io/design/layout/responsive-layout-grid.html#breakpoints).\n\n![breakpoint](https://github.com/fluttercommunity/breakpoint/blob/master/screenshots/breakpoint.png)\n\n## Usage\n\nWhen you are wanting to calculate the breakpoint of a widget that may not take up the full screen. This needs `BoxConstraints` but can be provided by the layout builder.\n\n``` dart\nfinal _breakpoint = Breakpoint.fromConstraints(constraints);\n```\n\nWhen a widget always takes up thye full screen.\n\n``` dart\nfinal _breakpoint = Breakpoint.fromMediaQuery(context);\n```\n\nUse `BreakpointBuilder` if you want the layout builder wrapped for you.\n\n``` dart\nreturn BreakpointBuilder(\n    builder: (context, breakpoint) {\n    print('Breakpoint: $breakpoint');\n    return Container();\n  },\n);\n```\n\n## Example\n\n``` dart\nimport 'dart:io';\n\nimport 'package:flutter/foundation.dart';\nimport 'package:flutter/material.dart';\nimport 'package:breakpoint/breakpoint.dart';\n\n/// main is entry point of Flutter application\nvoid main() {\n  // Desktop platforms aren't a valid platform.\n  _setTargetPlatformForDesktop();\n\n  return runApp(MyApp());\n}\n\n/// If the current platform is desktop, override the default platform to\n/// a supported platform (iOS for macOS, Android for Linux and Windows).\n/// Otherwise, do nothing.\nvoid _setTargetPlatformForDesktop() {\n  TargetPlatform targetPlatform;\n  if (Platform.isMacOS) {\n    targetPlatform = TargetPlatform.iOS;\n  } else if (Platform.isLinux || Platform.isWindows) {\n    targetPlatform = TargetPlatform.android;\n  }\n  if (targetPlatform != null) {\n    debugDefaultTargetPlatformOverride = targetPlatform;\n  }\n}\n\nclass MyApp extends StatelessWidget {\n  @override\n  Widget build(BuildContext context) {\n    return MaterialApp(\n      title: 'Flutter Demo',\n      theme: ThemeData(\n        primarySwatch: Colors.blue,\n      ),\n      home: MyHomePage(),\n    );\n  }\n}\n\nclass MyHomePage extends StatelessWidget {\n  @override\n  Widget build(BuildContext context) {\n    return LayoutBuilder(builder: (_, constraints) {\n      final _breakpoint = Breakpoint.fromConstraints(constraints);\n      return Scaffold(\n        appBar: AppBar(\n          title: Text('Breakpoint Example: ${_breakpoint.toString()}'),\n        ),\n        body: Container(\n          padding: EdgeInsets.all(_breakpoint.gutters),\n          child: GridView.builder(\n            gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(\n              crossAxisCount: _breakpoint.columns,\n              crossAxisSpacing: _breakpoint.gutters,\n              mainAxisSpacing: _breakpoint.gutters,\n            ),\n            itemCount: 200,\n            itemBuilder: (_, index) {\n              return Container(\n                child: Card(\n                  child: Text(\n                    index.toString(),\n                  ),\n                ),\n              );\n            },\n          ),\n        ),\n      );\n    });\n  }\n}\n\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffluttercommunity%2Fbreakpoint","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffluttercommunity%2Fbreakpoint","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffluttercommunity%2Fbreakpoint/lists"}