FLUTTER ECOSYSTEM

macielcr7/animated_float_action_button

macielcr7/animated_float_action_button open-source repository details.

animated_float_action_button のプロジェクト画像
Stars
5
Forks
2
最終プッシュ(UTC)
2024/01/17
プロジェクト状態
公開中
Maciel Sousa GitHub avatar
GITHUB User

Maciel Sousa ↗

LocktecMaranguape - Ceará - Brasil公式サイト ↗
言語Dart

このリポジトリが公開するパッケージ

使用している依存関係

依存関係一覧 2 件
  • flutter{"sdk":"flutter"}
  • flutter_test開発用{"sdk":"flutter"}

元の README

以下は英語原文のスナップショットです。最新版は GitHub をご覧ください。

README を開く / 閉じる

Getting Started

This project is a starting point for a Dart package, a library module containing code that can be shared easily across multiple Flutter or Dart projects.

For help getting started with Flutter, view our online documentation, which offers tutorials, samples, guidance on mobile development, and a full API reference.

##Screenshots

https://raw.githubusercontent.com/macielcr7/animated_float_action_button/master/screen.gif

Usage

To use this plugin:

In your flutter project add the dependency:

dependencies:
    ...
    animated_float_action_button: ^1.0.3

Example

//Import package
import 'package:animated_float_action_button/animated_floating_action_button.dart';
...
final GlobalKey<AnimatedFloatingActionButtonState> fabKey = GlobalKey();

Widget add() {
    return FloatActionButtonText(
      onPressed: (){
        fabKey.currentState.animate();
      },
      icon: Icons.add,
      text: "Ativar/Desativar Âncora",
      textLeft: -215,
    );
  }

  Widget image() {
    return FloatActionButtonText(
      onPressed: (){
        fabKey.currentState.animate();
      },
      icon: Icons.image,
      textLeft: -150,
      text: "Visualizar Rota",
    );
  }

  Widget inbox() {
    return FloatActionButtonText(
      onPressed: (){
        fabKey.currentState.animate();
      },
      icon: Icons.inbox,
      textLeft: -135,
      text: "Desbloquear",
    );
  }
...
Scaffold(
    floatingActionButton: AnimatedFloatingActionButton(
        key: fabKey,
        fabButtons: <Widget>[
            add(), 
            image(),
            inbox(),
        ],
        colorStartAnimation: Colors.blue,
        colorEndAnimation: Colors.red,
        animatedIconData: AnimatedIcons.menu_close //To principal button
    ),
)

Complete example here