flutter_native_splash 0.1.9

flutter_native_splash #

pub package Build Status Pull Requests Welcome

Automatically generates native code for adding splash screens in Android and iOS. Customize with specific platform, background color and splash image.

This package is heavily inspired by flutter_launcher_icons created by Mark O'Sullivan and Franz Silva.

Usage #

First, add flutter_native_splash as a dev dependency in your pubspec.yaml file. You should add the package to dev_dependencies because you don't need this plugin in your APK.

  flutter_native_splash: ^0.1.9

Don't forget to flutter pub get.

1. Setting the splash screen #

Add your settings to your project's pubspec.yaml file or create a file in your root project folder named flutter_native_splash.yaml with your settings.

  image: assets/images/splash.png
  color: "42a5f5"
  • image must be a png file.
  • You can use # in color as well. color: "#42a5f5"

You can omit image parameter if you just want a colored splash screen:

  color: "42a5f5"

You can also set android or ios to false if you don't want to create a splash screen for a specific platform.

  image: assets/images/splash.png
  color: "42a5f5"
  android: false

In case your image should use all available screen (width and height) you can use fill property.

  image: assets/images/splash.png
  color: "42a5f5"
  fill: true

Note: fill property is not yet implemented for iOS splash screens.

If you want to disable full screen splash screen on Android you can use android_disable_fullscreen property.

  image: assets/images/splash.png
  color: "42a5f5"
  android_disable_fullscreen: true

2. Run the package #

After adding your settings, run the package with

flutter pub pub run flutter_native_splash:create

When the package finishes running your splash screen is ready.

Notes #

  • If splash screen was not updated properly on iOS or if you experience a white screen before splash screen, run flutter clean and recompile your app. (issue #9)
  • This package modifies launch_background.xml, styles.xml and MainActivity files on Android and LaunchScreen.storyboard, Info.plist and AppDelegate on iOS. If you modified this files manually this plugin may not work properly, please open a issue if you find any bugs.

Recommendations #

  • If you want to use a Material Icon as your splash image, download an icon in (material.io/resources/icons) as PNG for Android. I recommend using the biggest icon in drawable-xxxhdpi folder which was just downloaded for better results.
  • Material Colors are available in material.io/resources/color

How it works #

Android #

  • Your splash image will be resized to mdpi, hdpi, xhdpi, xxhdpi and xxxhdpi drawables.
  • An <item> tag containing a <bitmap> for your splash image drawable will be added in launch_background.xml
  • Background color will be added in colors.xml and referenced in launch_background.xml.
  • Code for full screen mode toggle will be added in styles.xml and MainActivity.

iOS #

  • Your splash image will be resized to @3x and @2x images.
  • Color and image properties will be inserted in LaunchScreen.storyboard.
  • Code for hidden status bar toggle will be adde in Info.plist and AppDelegate.

[0.1.9] - (16th October 2019)

  • image parameter is now optional (#26)

[0.1.8+4] - (12th October 2019)

  • Fix bug on RegEx preventing package tag from being found in AndroidManifest.xml (#25)

[0.1.8+3] - (4th October 2019)

  • Prevent unhandler int exception in color argument (thanks @wemersonrv - PR #23)

[0.1.8+2] - (16th September 2019)

  • Fix code being added multiple times to MainActivity (#19)

[0.1.8+1] - (16th September 2019)

  • Documentation improvements

[0.1.8] - (16th September 2019)

  • Added fill property to use full screen images on Android (thanks @Bwofls2 - PR #8)
  • Added android_disable_fullscreen property to disable opening app in full screen on Android (#14)
  • Status bar color on Android is now generated dynamically by using same principles as Material Design (thanks @yiss - PR #16)

[0.1.7+2] - (1th September 2019)

  • Fix a bug on minSdkVersion reading (#13)

[0.1.7+1] - (1th September 2019)

  • Check for minSdkVersion >= 21 to add code for changing status bar color to transparent (#12)

[0.1.7] - (27th August 2019)

  • Fix a bug that duplicates entries on Info.plist when using multiple </dict> on iOS (#5)
  • Fix missing imports on MainActivity when not using default class signature (#7)

[0.1.6+2] - (27th August 2019)

  • Yup, I released a new version because a quote was missing

[0.1.6+1] - (27th August 2019)

  • Updated README.md adding quotes on color property
  • Add support for colors with # prefix

[0.1.6] - (26th August 2019)

  • Fix bug where MainActivity file could not be found with custom package names

[0.1.5] - (26th August 2019)

  • Add support for Kotlin
  • Add support for Swift
  • Add await to every step to create splash screen on Android and iOS to prevent async steps causing error

[0.1.4] - (25th August 2019)

  • Fix code style issues pointed by dartanalzyer
  • Fix typo in README.md

[0.1.3] - (25th August 2019)

  • Update README.md

[0.1.2] - (25th August 2019)

  • Fix Travis CI filename

[0.1.1] - (25th August 2019)

  • Added Travis CI and updates to README.md

[0.1.0] - (25th August 2019)

  • Initial release: generate Android and iOS splash screens with a background color and an image


Example for flutter_native_splash #

This is a brand new Flutter project created with flutter create.


name: example
description: A new Flutter project.
version: 1.0.0+1

  sdk: ">=2.1.0 <3.0.0"

    sdk: flutter
  cupertino_icons: ^0.1.2

    sdk: flutter
  flutter_native_splash: ^0.1.5

  image: assets/splash.png
  color: "42a5f5"

  uses-material-design: true

And then:

flutter pub get
flutter pub pub run flutter_native_splash:create

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:

  flutter_native_splash: ^0.1.9

2. Install it

You can install packages from the command line:

with pub:

$ pub get

with Flutter:

$ flutter pub get

Alternatively, your editor might support pub get or flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:

import 'package:flutter_native_splash/flutter_native_splash.dart';
Describes how popular the package is relative to other packages. [more]
Code health derived from static analysis. [more]
Reflects how tidy and up-to-date the package is. [more]
Weighted score of the above. [more]
Learn more about scoring.

We analyzed this package on Feb 21, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.7.1
  • pana: 0.13.5


Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.2.0 <3.0.0
color ^2.1.1 2.1.1
image ^2.1.4 2.1.12
yaml ^2.1.16 2.2.0
Transitive dependencies
archive 2.0.13
args 1.5.2
charcode 1.1.3
collection 1.14.12
convert 2.1.1
crypto 2.1.4
meta 1.1.8
path 1.6.4
petitparser 3.0.1
source_span 1.6.0
string_scanner 1.0.5
term_glyph 1.1.0
typed_data 1.1.6
xml 3.7.0
Dev dependencies
pedantic ^1.8.0+1