{"id":13685072,"url":"https://github.com/blackmann/overlapping_panels","last_synced_at":"2025-03-17T09:30:35.049Z","repository":{"id":56836201,"uuid":"446769571","full_name":"blackmann/overlapping_panels","owner":"blackmann","description":"Discord inspired navigation for Flutter apps","archived":false,"fork":false,"pushed_at":"2023-10-13T10:47:43.000Z","size":8,"stargazers_count":56,"open_issues_count":3,"forks_count":5,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-16T10:33:15.991Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"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/blackmann.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-01-11T10:10:43.000Z","updated_at":"2025-03-01T04:08:02.000Z","dependencies_parsed_at":"2024-10-27T12:58:33.567Z","dependency_job_id":null,"html_url":"https://github.com/blackmann/overlapping_panels","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/blackmann%2Foverlapping_panels","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blackmann%2Foverlapping_panels/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blackmann%2Foverlapping_panels/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blackmann%2Foverlapping_panels/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/blackmann","download_url":"https://codeload.github.com/blackmann/overlapping_panels/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244008891,"owners_count":20382929,"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":[],"created_at":"2024-08-02T14:00:43.322Z","updated_at":"2025-03-17T09:30:34.593Z","avatar_url":"https://github.com/blackmann.png","language":"Dart","readme":"# Overlapping Panels [![Pub](https://img.shields.io/pub/v/overlapping_panels.svg)](https://pub.dev/packages/overlapping_panels)\n\nAdd Discord-like navigation to your app. Demo project here: [overlapping_panels_demo](https://github.com/blackmann/overlapping_panels_demo)\n\n\n\u003cimg src=\"https://i.ibb.co/MsBy18m/ezgif-com-gif-maker.gif\" alt=\"Demo\" height=\"400\"\u003e\n\n\n### TODO\n\nThis widget does not support navigation events yet. So pressing the back button, does not slide the `main` panel back into view. This feature will be implemented in the nearest future.\n\n### Usage\n\nSimple and straight to the point. Just provide usual widgets for all panels:\n\n```dart\nclass _MyHomePageState extends StatelessWidget {\n\n  @override\n  Widget build(BuildContext context) {\n    return Stack(\n      children: [\n        OverlappingPanels(\n          // Using the Builder widget is not required. You can pass your widget directly. \n          // But to use `OverlappingPanels.of(context)` you need to wrap your widget in a Builder\n          left: Builder(builder: (context) {\n            return const LeftPage();\n          }),\n          right: Builder(\n            builder: (context) =\u003e const RightPage(),\n          ),\n          main: Builder(\n            builder: (context) {\n              return const MainPage();\n            },\n          ),\n          onSideChange: (side) {\n            setState(() {\n              if (side == RevealSide.main) {\n                // hide something\n              } else if (side == RevealSide.left) {\n                // show something\n              }\n            });\n          },\n        ),\n      ],\n    );\n  }\n}\n```\n\nTo be able to reveal a panel with the tap of a button, for example, do:\n\n```dart\nIconButton(\n  icon: const Icon(Icons.menu),\n  onPressed: () {\n    // This is the main point\n    OverlappingPanels.of(context)?.reveal(RevealSide.left);\n  },\n)\n```","funding_links":[],"categories":["Dart"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblackmann%2Foverlapping_panels","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fblackmann%2Foverlapping_panels","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblackmann%2Foverlapping_panels/lists"}