- Notifications
You must be signed in to change notification settings - Fork30
A splash screen for flutter, hide when application loaded ,it works on iOS and Android.
License
crazycodeboy/flutter_splash_screen
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
A splash screen API for flutter which can programatically hide and show the splash screen. Works onAndroid and iOS.
| Screenshots | Screenshots |
|---|---|
 |  |
Run this command:
flutter pub add flutter_splash_screen
Update theMainActivity.kt to useflutter_splash_screen via the following changes:
packageorg.devio.flutter.splashscreen.exampleimportandroid.os.Bundleimportio.flutter.embedding.android.FlutterActivityimportorg.devio.flutter.splashscreen.SplashScreen// addclassMainActivity :FlutterActivity() {overridefunonCreate(savedInstanceState:Bundle?) {// SplashScreen.show(this)// or enable full screenSplashScreen.show(this,true)super.onCreate(savedInstanceState) }}
Create a file calledlaunch_screen.xml inapp/src/main/res/layout (create thelayout-folder ifit doesn't exist). The contents of the file should be the following:
<?xml version="1.0" encoding="utf-8"?><FrameLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:background="@android:color/white"> <ImageViewandroid:layout_width="match_parent"android:layout_height="match_parent"android:layout_gravity="center|top"android:scaleType="centerCrop"android:src="@mipmap/launch_screen" /></FrameLayout>
Customize your launch screen by creating alaunch_screen.png-file and placing it in anappropriatemipmap-folder. Android automatically scales drawable, so you do not necessarily needto provide images for all phone densities.You can create splash screens in the following folders:
mipmap-ldpimipmap-mdpimipmap-hdpimipmap-xhdpimipmap-xxhdpimipmap-xxxhdpi
Add a color calledprimary_dark inapp/src/main/res/values/colors.xml
<?xml version="1.0" encoding="utf-8"?><resources> <color name="primary_dark">#000000</color></resources>Optional steps：
If you want the splash screen to be transparent, follow these steps.
Openandroid/app/src/main/res/values/styles.xml andadd<item name="android:windowIsTranslucent">true</item> to the file. It should look like this:
<resources><!-- Base application theme.--> <stylename="AppTheme"parent="Theme.AppCompat.Light.NoActionBar"><!-- Customize your theme here.--><!--设置透明背景--> <itemname="android:windowIsTranslucent">true</item> </style></resources>
To learn moreseeexamples
If you want to customize the color of the status bar when the splash screen is displayed:
Createandroid/app/src/main/res/values/colors.xml and add
<?xml version="1.0" encoding="utf-8"?><resources> <colorname="status_bar_color"><!-- Colour of your status bar here--></color></resources>
Create a style definition for this inandroid/app/src/main/res/values/styles.xml:
<?xml version="1.0" encoding="utf-8"?><resources> <stylename="SplashScreenTheme"parent="SplashScreen_SplashTheme"> <itemname="colorPrimaryDark">@color/status_bar_color</item> </style></resources>
Change yourshow method to include your custom style:
SplashScreen.show(this,R.style.SplashScreenTheme);
Customize your splash screen viaLaunchScreen.storyboard,
Learn more toseeexamples
Use like so:
import'dart:async';import'package:flutter/material.dart';import'package:flutter_splash_screen/flutter_splash_screen.dart';voidmain()=>runApp(MyApp());classMyAppextendsStatefulWidget {@override_MyAppStatecreateState()=>_MyAppState();}class_MyAppStateextendsState<MyApp> {@overridevoidinitState() {super.initState();hideScreen(); }///hide your splash screenFuture<void>hideScreen()async {Future.delayed(Duration(milliseconds:1800), () {FlutterSplashScreen.hide(); }); } ...
| Method | Type | Optional | Description |
|---|---|---|---|
| show() | function | false | Open splash screen (Native Method ) |
| hide() | function | false | Close splash screen |
Issues are welcome. Please add a screenshot of you bug and a code snippet. Quickest way to solveissue is to reproduce it in one of the examples.
Pull requests are welcome. If you want to change the API or do something big it is best to create anissue and discuss it first.
About
A splash screen for flutter, hide when application loaded ,it works on iOS and Android.
Topics
Resources
License
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Packages0
Uh oh!
There was an error while loading.Please reload this page.
Contributors2
Uh oh!
There was an error while loading.Please reload this page.