搜索插件、代码仓与 APP 分类

cupertino_stackview 封面
插件详情v2.0.0

cupertino_stackview

一个非常易于使用的导航工具/小部件,用于实现 iOS 13 风格的堆栈。

AndroidiOSWebmacOSWindowsLinux
近 30 天下载
86
喜欢数
53
Pub 分数
140

安装插件

flutter pub add cupertino_stackview

插件介绍

基于插件公开信息、社区数据与项目使用情况整理的选型参考。

CupertinoStackView 是一个 Flutter 小部件,可简化创建 iOS 13 风格的基于堆栈的导航。它通过最少的设置提供流畅、原生般的屏幕间过渡效果,模仿 iOS 内置堆栈导航的外观和感觉。专为希望在跨平台应用中实现一致 iOS 美学的开发者设计,支持所有主要的 Flutter 平台,包括 Android、iOS、Web、macOS、Windows 和 Linux。该包通过直观的手势和动画提升用户体验,非常适合需要现代、以 iOS 为中心界面的应用。

适合场景

  • iOS 风格的屏幕过渡
  • 通过滑动手势进行导航
  • 创建分层 UI
  • 跨平台 iOS 设计一致性
  • 应用引导流程
  • 模态栈管理

主要特点

  • iOS 13 堆栈导航样式
  • 基于手势的导航
  • 流畅的动画
  • 跨平台支持
  • 最小配置
  • 可自定义的过渡效果

适合对象

  • 针对iOS设计语言的开发者
  • 需要原生 iOS 导航的应用感觉
  • 具有复杂屏幕层级的项目
  • 注重用户体验一致性的团队
  • Flutter 应用在多个平台
  • 面向设计的移动应用

使用建议

  • 最适合面向 iOS 的设计
  • 可能需要额外的样式以适配非iOS主题
  • 与完整自定义导航器相比,自定义选项有限
  • 不太适合高度复杂的路由场景
  • 依赖手势识别的准确性
  • 性能在旧设备上可能有所不同

原始 README

以下为关联源码仓库的 README 原文快照,最新内容请访问源码仓库。

cupertino_stackview

Cosmos Software Cosmos Software

Pub License

A very easy-to-use navigation tool/widget for having iOS 13 style stacks.

It is highly recommended to read the documentation and run the example project on a real device to fully understand and inspect the full range of capabilities.

Media | Description | Installation | How-to-Use

Media

Watch on Youtube:

v1.0.0



Description

The "StackView" system, as I like to call it because I don't know the real name, is now the default navigation system for iOS 13. As a fan of this, I decided to implement a very easy-to-use version of it for Flutter as well.

How-to-Use

First, instantiate the cupertinoStackViewController that is provided by "misc.dart" with the required parameters:

cupertinoStackViewController = CupertinoStackViewController(
    navigatorState,
    {
      "Page I": (BuildContext context, dynamic parameters) {
        return PageI();
      },
      "Page II": (BuildContext context, dynamic parameters) {
        return PageII();
      },
      "Page III": (BuildContext context, dynamic parameters) {
        return PageIII();
      },
      "Page IV": (BuildContext context, dynamic parameters) {
        return PageIV();
      },
      ...,
    },
);

Then create a CupertinoStackView widget as shown in the example:

CupertinoStackView(
  true,             //_isPrimary 
  "Page I",         //_navigation
  Scaffold(...),    //_child
  Colors.black,     //_backgroundColor 
 {Key key,
  radius    : Radius.circular(10.0)})

Further Explanations:

For a complete set of descriptions for all parameters and methods, see the documentation.

  • The [cupertinoStackViewController] from 'misc.dart' has to be initialised as soon as the application starts via the [void initialise(double height, double width)] method. Use this method with the [MediaQuery.of(context).size.height] and [MediaQuery.of(context).size.width] values.
  • Use [CupertinoStackViewController]'s [Future back(BuildContext context, dynamic parameters) async] and [Future navigate(String targetNavigation, BuildContext context, dynamic parameters) async] methods for the corresponding actions. Do not call [Navigator] methods directly.

Notes

Any help, suggestion or criticism is appreciated!

Cheers.





所属分类

源码仓库

使用此插件的项目

暂无相关数据。