{"id":19273068,"url":"https://github.com/fluttercandies/extended_sliver","last_synced_at":"2025-04-07T10:26:16.606Z","repository":{"id":45300627,"uuid":"286765335","full_name":"fluttercandies/extended_sliver","owner":"fluttercandies","description":"A powerful extension library of Sliver, which include SliverToNestedScrollBoxAdapter， SliverPinnedPersistentHeader, SliverPinnedToBoxAdapter and ExtendedSliverAppbar.","archived":false,"fork":false,"pushed_at":"2024-06-24T09:28:11.000Z","size":1308,"stargazers_count":170,"open_issues_count":7,"forks_count":30,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-31T08:12:12.522Z","etag":null,"topics":["dart","flutter","sliver"],"latest_commit_sha":null,"homepage":"","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/fluttercandies.png","metadata":{"files":{"readme":"README-ZH.md","changelog":"CHANGELOG.md","contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":"CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"custom":"http://zmtzawqlp.gitee.io/my_images/images/qrcode.png"}},"created_at":"2020-08-11T14:25:21.000Z","updated_at":"2025-03-26T06:44:59.000Z","dependencies_parsed_at":"2024-06-18T22:50:44.218Z","dependency_job_id":"f5a9da65-9707-40fe-9dfa-6b6412f3bcc0","html_url":"https://github.com/fluttercandies/extended_sliver","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fluttercandies%2Fextended_sliver","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fluttercandies%2Fextended_sliver/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fluttercandies%2Fextended_sliver/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fluttercandies%2Fextended_sliver/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fluttercandies","download_url":"https://codeload.github.com/fluttercandies/extended_sliver/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247634089,"owners_count":20970456,"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":["dart","flutter","sliver"],"created_at":"2024-11-09T20:40:42.133Z","updated_at":"2025-04-07T10:26:16.573Z","avatar_url":"https://github.com/fluttercandies.png","language":"Dart","funding_links":["http://zmtzawqlp.gitee.io/my_images/images/qrcode.png"],"categories":[],"sub_categories":[],"readme":"# extended_sliver\n\n[![pub package](https://img.shields.io/pub/v/extended_sliver.svg)](https://pub.dartlang.org/packages/extended_sliver) [![GitHub stars](https://img.shields.io/github/stars/fluttercandies/extended_sliver)](https://github.com/fluttercandies/extended_sliver/stargazers) [![GitHub forks](https://img.shields.io/github/forks/fluttercandies/extended_sliver)](https://github.com/fluttercandies/extended_sliver/network) [![GitHub license](https://img.shields.io/github/license/fluttercandies/extended_sliver)](https://github.com/fluttercandies/extended_sliver/blob/master/LICENSE) [![GitHub issues](https://img.shields.io/github/issues/fluttercandies/extended_sliver)](https://github.com/fluttercandies/extended_sliver/issues) \u003ca target=\"_blank\" href=\"https://jq.qq.com/?_wv=1027\u0026k=5bcc0gy\"\u003e\u003cimg border=\"0\" src=\"https://pub.idqqimg.com/wpa/images/group.png\" alt=\"flutter-candies\" title=\"flutter-candies\"\u003e\u003c/a\u003e\n\n语言: [English](README.md) | 中文简体\n\n## 描述\n\n强大的Sliver扩展库, 包括 SliverToNestedScrollBoxAdapter, SliverPinnedPersistentHeader, SliverPinnedToBoxAdapter 和 ExtendedSliverAppbar.\n\n- [extended_sliver](#extended_sliver)\n  - [描述](#描述)\n  - [使用](#使用)\n    - [添加引用](#添加引用)\n  - [SliverPinnedPersistentHeader](#sliverpinnedpersistentheader)\n  - [SliverPinnedToBoxAdapter](#sliverpinnedtoboxadapter)\n  - [ExtendedSliverAppbar](#extendedsliverappbar)\n  - [SliverToNestedScrollBoxAdapter](#slivertonestedscrollboxadapter)\n  - [复杂的例子](#复杂的例子)\n\n\n## 使用\n\n### 添加引用\n\n添加引用到 `pubspec.yaml` 下面的 `dependencies`\n\n```yaml\ndependencies:\n  extended_sliver: latest-version\n```\n\n执行 `flutter packages get` 下载\n\n## SliverPinnedPersistentHeader\n\n跟官方的`SliverPersistentHeader(pinned: true)`一样, 不同的是你不需要去设置 minExtent 和 maxExtent。\n\n它是通过设置 `minExtentProtoType` 和 `maxExtentProtoType` 来计算 minExtent 和 maxExtent。\n\n当Widget没有layout之前，你没法知道Widget的实际大小，这将是非常有用的组件。\n\n```dart\n    SliverPinnedPersistentHeader(\n      delegate: MySliverPinnedPersistentHeaderDelegate(\n        minExtentProtoType: Container(\n          height: 120.0,\n          color: Colors.red.withOpacity(0.5),\n          child: FlatButton(\n            child: const Text('minProtoType'),\n            onPressed: () {\n              print('minProtoType');\n            },\n          ),\n          alignment: Alignment.topCenter,\n        ),\n        maxExtentProtoType: Container(\n          height: 200.0,\n          color: Colors.blue,\n          child: FlatButton(\n            child: const Text('maxProtoType'),\n            onPressed: () {\n              print('maxProtoType');\n            },\n          ),\n          alignment: Alignment.bottomCenter,\n        ),\n      ),\n    )\n```\n## SliverPinnedToBoxAdapter\n\n你可以轻松创建一个锁定的Sliver。\n\n当child没有layout之前，你没法知道child的实际大小，这将是非常有用的组件。\n\n```dart\n    SliverPinnedToBoxAdapter(\n      child: Container(\n        padding: const EdgeInsets.all(20),\n        color: Colors.blue.withOpacity(0.5),\n        child: Column(\n          children: \u003cWidget\u003e[\n            const Text(\n                '[love]Extended text help you to build rich text quickly. any special text you will have with extended text. '\n                '\\n\\nIt\\'s my pleasure to invite you to join \\$FlutterCandies\\$ if you want to improve flutter .[love]'\n                '\\n\\nif you meet any problem, please let me konw @zmtzawqlp .[sun_glasses]'),\n            FlatButton(\n              child: const Text('I\\'m button. click me!'),\n              onPressed: () {\n                debugPrint('click');\n              },\n            ),\n          ],\n        ),\n      ),\n    )\n```\n## ExtendedSliverAppbar\n\n你可以创建一个SliverAppbar，不用去设置expandedHeight。\n\n```dart\nreturn CustomScrollView(\n  slivers: \u003cWidget\u003e[\n    ExtendedSliverAppbar(\n      title: const Text(\n        'ExtendedSliverAppbar',\n        style: TextStyle(color: Colors.white),\n      ),\n      leading: const BackButton(\n        onPressed: null,\n        color: Colors.white,\n      ),\n      background: Image.asset(\n        'assets/cypridina.jpeg',\n        fit: BoxFit.cover,\n      ),\n      actions: Padding(\n        padding: const EdgeInsets.all(10.0),\n        child: Icon(\n          Icons.more_horiz,\n          color: Colors.white,\n        ),\n      ),\n    ),\n  ],\n);\n```\n\n## SliverToNestedScrollBoxAdapter\n\n你可以在 CustomScrollView/NestedScrollView 中创建一个嵌套滚动的组件(比如 Webview).\n\n```dart\nreturn CustomScrollView(\n  slivers: \u003cWidget\u003e[\n      SliverToBoxAdapter(\n        child: Container(\n          height: 100,\n          color: Colors.red,\n          child: const Center(\n            child: Text(\n              'Header',\n              style: TextStyle(color: Colors.white),\n            ),\n          ),\n        ),\n      ),\n    ValueListenableBuilder\u003cdouble\u003e(\n      valueListenable: nestedWebviewController.scrollHeightNotifier,\n      builder: (\n        BuildContext context,\n        double scrollHeight,\n        Widget? child,\n      ) {\n        return SliverToNestedScrollBoxAdapter(\n          childExtent: scrollHeight,\n          onScrollOffsetChanged: (double scrollOffset) {\n            double y = scrollOffset;\n            if (Platform.isAndroid) {\n              // https://github.com/flutter/flutter/issues/75841\n              y *= window.devicePixelRatio;\n      \n            nestedWebviewController.webviewController\n                ?.scrollTo(0, y.ceil());\n          },\n          child: child,\n        );\n      },\n      child: WebView(\n        initialUrl: nestedWebviewController.initialUrl,\n        onPageStarted: nestedWebviewController.onPageStarted,\n        onPageFinished: nestedWebviewController.onPageFinished,\n        onWebResourceError:\n            nestedWebviewController.onWebResourceError,\n        onWebViewCreated: nestedWebviewController.onWebViewCreated,\n        onProgress: nestedWebviewController.onProgress,\n        javascriptChannels: \u003cJavascriptChannel\u003e{\n          nestedWebviewController\n              .scrollHeightNotifierJavascriptChannel\n        },\n        javascriptMode: JavascriptMode.unrestricted,\n      ),\n    ),\n    SliverToBoxAdapter(\n        child: Container(\n          height: 300,\n          color: Colors.green,\n          child: const Center(\n            child: Text(\n              'Footer',\n              style: TextStyle(color: Colors.white),\n            ),\n          ),\n        ),\n    ),\n  ],\n);\n```\n\n## 复杂的例子\n\n[例子地址](https://github.com/fluttercandies/extended_sliver/blob/master/example/lib/pages/complex/home_page.dart)\n\n![image](http://zmtzawqlp.gitee.io/my_images/images/extended_sliver/extended_sliver.gif)\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffluttercandies%2Fextended_sliver","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffluttercandies%2Fextended_sliver","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffluttercandies%2Fextended_sliver/lists"}