mkobuolys / help_ukraine_widget

🇺🇦 Flutter widget to raise awareness of the war in Ukraine and collect donations.

Help Ukraine Widget for Flutter

This is a port of Help Ukraine Widget - this widget helps to let users of your app know how they can help Ukraine from anywhere in the world.

Showcase

First widget variation

Second widget variation

Third widget variation

Fourth widget variation

Features

By installing this widget in your app, you will help to end the war in Ukraine. It will provide links for:

• donations,
• sharing this widget
• and other ways to support Ukraine.

Getting started

Add the package as a dependency to your pubspec.yaml:

dependencies:
    help_ukraine_widget: <latest version>

In the project, the flutter_sfsymbols package is used. Thus, import the following fonts in your pubspec.yaml:

fonts:
  - family: sficonsets
    fonts:
      - asset: packages/flutter_sfsymbols/fonts/sficonsets.ttf

Then, in your code:

import 'package:help_ukraine_widget/help_ukraine_widget.dart';

Usage

Basic usage

Use OverlayWidget to float and align the widget above your app:

OverlayWidget(
    alignment: Alignment.bottomRight,
    overlayWidget: HorizontalHelpWidget(),
    child: MyApp(),
)

Customization

You can also create custom variations of this widget:

// we used that in our widget, but you do you 
final order = [HelpWidgetView.collapsed, HelpWidgetView.main, HelpWidgetView.options];

final _controller = TraverseController(order);

HelpWidget(
    controller: _controller;
    // view with links to resources that help Ukraine
    optionsView: ...
    // The default first view that the users see.
    mainView: ...
    // smallest view that doesn't obstruct user from
    // using the app, but still exists on the screen
    collapsedView: ...
    // axis of transition animation between views
    axis: ...
)

Credits

jiffsy.co and Gearheart for designing and creating the original widget.