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

插件详情v0.0.2

side_sheet_material3

此 Flutter 包提供了一个 Material Design 3 模态侧边抽屉小部件。

AndroidiOSWebmacOSWindowsLinux
近 30 天下载
167
喜欢数
32
Pub 分数
140

安装插件

flutter pub add side_sheet_material3

插件介绍

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

一个 Flutter 包,实现符合 Material Design 3 规范的模态侧边面板小部件,提供现代化、响应式的滑动面板,用于显示额外内容或执行操作。该组件遵循 Material Design 3 指南,支持 Android、iOS、Web、macOS、Windows 和 Linux 等多种平台。侧边面板可用于导航、设置或详细信息展示,为不同设备提供一致的用户体验。它可无缝集成到现有的 Flutter 应用中,并遵循当前的无障碍性和可用性设计原则。

适合场景

  • 显示附加内容
  • 实施移动导航
  • 显示设置面板
  • 提供详细信息
  • 增强表单工作流

主要特点

  • Material Design 3 兼容性
  • 跨平台支持
  • 模态滑动行为
  • 可自定义外观
  • 响应式布局处理

适合对象

  • 使用 Material Design 3 的应用
  • 寻求现代底部表单的开发者
  • 需要跨平台用户界面组件的项目
  • 以移动设备为优先的应用程序
  • UI密集型仪表板

使用建议

  • 需要 Flutter SDK 3.0+
  • 超出 Material 3 规范的定制选项有限
  • 可能需要额外的样式来处理非标准用例
  • 依赖 material3 包
  • 最适合单窗格布局

原始 README

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

Material Design 3 modal side sheet

A Flutter package that provides a Material Design 3 side sheet as a general dialog.

Please check out the official documentation for more information on Material Design side sheet

Features

  • Custom header and body widgets.
  • Option to add a back button and close button.
  • Option to add confirm and cancel action buttons.
  • Option to show/hide a divider between the body and action buttons.
  • Customizable button text and tooltips.
  • Option to dismiss the dialog by tapping outside of it.

Usage

To use this package, add side_sheet_material3 as a dependency in your pubspec.yaml file.

dependencies:
  side_sheet_material3: ^0.0.1

Example

await showModalSideSheet(
  context: context,
  header: 'Edit Profile',
  body: ProfileEditForm(), // Put your content widget here
  addBackIconButton: true,
  addActions: true,
  addDivider: true,
  confirmActionTitle: 'Save',
  cancelActionTitle: 'Cancel',
  confirmActionOnPressed: () {
    // Do something
  },

  // If null, Navigator.pop(context) will used
  cancelActionOnPressed: () {
    // Do something
  },
);

Please check out the full example for more information on how to use this package.

Buy me a coffe

所属分类

源码仓库

使用此插件的项目

暂无相关数据。