Splash Master

A Flutter plugin that streamlines the process of adding splash screens to your app. This plugin takes care of all the necessary native-side setup which saves your time and efforts. It supports videos, Lottie animations, images and custom Flutter widgets, giving users various creative options. Simply define the required details by adding a splash_master section to your pubspec.yaml. Additionally, the plugin ensures a smooth and seamless transition from native to flutter app, enhancing the user experience.

Preview

Android	iOS

Installation

Add splash_master as a dependency in your pubspec.yaml from pub.dev.

dependencies:
  splash_master: <Latest Version>

Usage

Setup the splash screen

Add splash_master section in pubspec.yaml.

splash_master:
  # Use to specifies the color for the splash screen
  color: '#FFFFFF'
  # Use to specifies the splash image
  image: 'assets/splash.png'
  # Provides content mode for splash image in iOS
  # iOS content mode options: scaleToFill, scaleAspectFit, scaleAspectFill, redraw, center, top, bottom,
  # left, right, topLeft, topRight, bottomLeft, bottomRight.
  ios_content_mode: 'center'
  # Provides gravity for splash image in Android
  # Android gravity options: center, clip_horizontal, clip_vertical, fill_horizontal, fill, center_vertical, 
  # bottom, fill_vertical, center_horizontal, top, end, left, right, start
  android_gravity: 'center'
  # Use to specifies the splash image
  background_image: 'assets/background_image.png'
  # Provided content mode for splash image in background for iOS
  ios_background_content_mode: 'scaleToFill'
  # Provides gravity for background image in Android
  # Android gravity options: center, clip_horizontal, clip_vertical, fill_horizontal, fill, center_vertical, 
  # bottom, fill_vertical, center_horizontal, top, end, left, right, start
  android_background_image_gravity: 'fill'
  # Use to specifies image for android in dark mode
  image_dark_android: 'assets/splash_dark.png'
  # Provides gravity for splash image for Android in dark mode
  android_dark_gravity_key: 'center'
  # Use to specifies the color for the splash screen for Android in dark mode
  color_dark_android: '#000000'
  # Section to specifies the configuration for the splash in Android 12+
  android_12_and_above:
    # Provides the background color of splash screen
    color: '#FFFFFF'
    # Provides custom icon to replace the default app icon
    image: 'assets/splash_12.png'
    # Provides branding image which is shown under main icon image. 
    branding_image: 'assets/branding_image.png'

Create & setup splash screen

Run the following command to create & setup the splash screen on native side.
```
dart run splash_master create
```
Or run following command to activate splash_master globally
```
dart pub global activate splash_master
```
Now you can directly use following command to set splash screen
```
splash_master create
```

Setup on the flutter side

We offer support for splash components, including video, Lottie animations, and images. Videos and Lottie animations are processed on the Flutter side, while image handling is managed natively.

Video

  void main() {
   WidgetsFlutterBinding.ensureInitialized();
   SplashMaster.initialize();
   runApp(
      MaterialApp(
         home: SplashMaster.video(...),  // use for video
      ),
    );
  }

Lottie

  void main() {
   WidgetsFlutterBinding.ensureInitialized();
   SplashMaster.initialize();
   runApp(
      MaterialApp(
         home: SplashMaster.lottie(...),  // use for lottie
      ),
    );
  }

Image: While using image as splash screen you have to call the SplashMaster.resume() method explicitly to resume the Flutter app.

  void main() {
   WidgetsFlutterBinding.ensureInitialized();
   SplashMaster.initialize();
   // Setup your config before the resume.
   SplashMaster.resume();
   runApp(
      MaterialApp(
         home: YourWidget(),  // Your first screen
      ),
   );
}

If you prefer to use your own custom widget instead of the provided options, you can easily integrate it as a splash widget.

  void main() {
   WidgetsFlutterBinding.ensureInitialized();
   SplashMaster.initialize();
   runApp(
      MaterialApp(
         home: YourCustomWidget(),
      ),
   );
}

The SplashMaster.initialize() method prevents flutter frames from rendering until initialization is complete. To resume Flutter frames, call the SplashMaster.resume() method. Until resume() is called, the app will remain in the native splash screen.
- initialize()
  - Use this method to initialize resources or execute code during app startup. Once the initialization is complete, call resume() to allow Flutter to start rendering frames.
- resume()
  - If you use the SplashMaster.video() or SplashMaster.lottie() methods, you don’t need to call resume() explicitly. The rendering will resume automatically once the provided video or Lottie source is fully initialized.
  - This function will be called automatically from onSourceLoaded, if you haven't provided this parameter from VideoConfig or LottieConfig. If you set this parameter or don't use SplashMaster widget, then you will be responsible for calling this function.
Once command runs successfully splash screen has been setup on native side.

Properties of `SplashMaster.video()` and `SplashMaster.lottie()`:

The common properties used in SplashMaster.video() and SplashMaster.lottie() are largely the same. The key difference between the two is the use of videoConfig and lottieConfig, which allow for configuration customization specific to video and Lottie animations, respectively.

Name	Description
source	Media source for assets.
videoConfig	To handle the video's configuration.
lottieConfig	To handle the lottie's configuration.
backGroundColor	To handle the background color of the splash screen.
nextScreen	Screen to navigate once splash finished.
customNavigation	Callback to handle the logic when the splash is completed.
onSourceLoaded	Called when provided media is loaded.