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

animated_confirm_dialog 封面
插件详情v1.0.2

animated_confirm_dialog

一个可自定义的确认对话框 Flutter 包,支持可选的 3D 翻转动画和现代 UI。

AndroidiOSWebmacOSWindowsLinux
近 30 天下载
73
喜欢数
46
Pub 分数
150

安装插件

flutter pub add animated_confirm_dialog

插件介绍

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

一个 Flutter 包,提供可自定义的确认对话框,支持可选的 3D 翻转动画和现代、简洁的用户界面。它通过在确认操作期间提供流畅的视觉反馈来增强用户体验。开发者可以轻松调整对话框的外观、按钮和行为,以匹配其应用的设计语言。该包支持多种平台,包括 Android、iOS、Web、macOS、Windows 和 Linux,确保在各种设备上提供一致的体验。

适合场景

  • 用户操作确认
  • 表单提交验证
  • 删除或取消操作
  • 应用设置更改
  • 入职步骤确认
  • 安全相关提示

主要特点

  • 可自定义的对话框样式
  • 可选的3D翻转动画
  • 现代且响应式的用户界面
  • 跨平台兼容性
  • 与 Flutter 的轻松集成
  • 可配置的按钮标签和操作

适合对象

  • 寻求精致对话交互的开发者
  • 需要直观用户确认的应用程序
  • 强调视觉反馈的项目
  • 跨平台移动和Web应用
  • 以UI为中心的Flutter应用

使用建议

  • 可能需要额外的样式设置以适应复杂主题
  • 低端设备上的动画性能
  • 仅限确认用例
  • 依赖 Flutter 的动画框架
  • 不适用于非交互式弹窗

原始 README

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

animated_confirm_dialog

Banner

A customizable Flutter package for displaying confirmation dialogs with optional 3D flip animations and modern UI. This package allows you to easily show stylish confirmation dialogs with a clean and modern design, making it highly customizable.

Features

  • Customizable Dialogs: Easily adjust the title, message, and button text.
  • Animations: Includes optional 3D flip animation for dialog transitions.
  • Modern UI: A visually appealing, modern design with customizable button styles and colors.
  • Dismissable: Optionally control if the dialog can be dismissed by tapping outside.

Demo Video 2

Demo Video

Demo Video 1

Getting Started

To use animated_confirm_dialog in your Flutter project, follow these simple steps.

Prerequisites

Before starting, ensure that you have the following installed:

  • Flutter SDK: >=3.0.0
  • Dart SDK: >=3.1.3 <4.0.0
Installation
  1. Open your pubspec.yaml file.
  2. Under dependencies, add the following line:
dependencies:
  animated_confirm_dialog: ^1.0.2
Usage

Once you’ve installed the package, you can use the showCustomDialog function to display the confirmation dialog. Here’s an example of how to use it:

import 'package:animated_confirm_dialog/animated_confirm_dialog.dart';

 showCustomDialog(
              context: context,
              title: 'Delete Item?',
              message: 'Are you sure you want to delete this item?',
              cancelButtonText: 'No',
              confirmButtonText: 'Yes',
              cancelButtonColor: Colors.red,
              cancelButtonTextColor: Colors.white,
              confirmButtonColor: Colors.green,
              confirmButtonTextColor: Colors.white,
              onCancel: () {
                // Action when cancel button is pressed
                Navigator.of(context).pop();
              },
              onConfirm: () {
                // Action when confirm button is pressed
                Navigator.of(context).pop();
              },
              isFlip: true, // You can set isFlip to true for 3D rotation effect
            );

Customization

You can customize various aspects of the dialog by passing different parameters. Below is a list of customizable options:

Parameter Description Default
title The title of the dialog. 'Logout Confirmation'
message The message displayed inside the dialog. 'Are you sure you want to log out?'
cancelButtonText Text for the cancel button. 'Cancel'
confirmButtonText Text for the confirm button. 'Logout'
backgroundColor Background color of the dialog. Color(0xFFF5F5F5)
titleColor Color of the title text. Color(0xFF000000)
messageColor Color of the message text. Color(0xFF000000)
cancelButtonColor Background color of the cancel button. Color(0xFF007BFF)
cancelButtonTextColor Color of the cancel button text. Colors.white
confirmButtonColor Background color of the confirm button. Colors.white
confirmButtonTextColor Color of the confirm button text. Color(0xFF007BFF)
onCancel A callback function triggered when the cancel button is tapped. null (no action)
onConfirm A callback function triggered when the confirm button is tapped. null (no action)
isFlip Enables a 3D flip animation when the dialog is shown. false
dismissible Controls whether the dialog can be dismissed by tapping outside. true

Licence

This project is licensed under the MIT License. You can view the full license in the LICENSE file.

Support the Library

You can support the library by:

所属分类

源码仓库

使用此插件的项目

暂无相关数据。