Create splash screen in Flutter
Create splash screen in Flutter
- Import the image file
We need to import the image files into the project. It is common practice to put image files in a
images
or assets
folder at the root of a Flutter project.- Declare the Image in the
pubspec.yaml
pubspec.yaml -
flutter:
uses-material-design: true
assets:
- images/flutterwithlogo.png
uses-material-design: true
assets:
- images/flutterwithlogo.png
- main.dart File
import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'SplashPage.dart'; import 'HomePage.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { // This widget is the root of your application. @override Widget build(BuildContext context) { // Fixing App Orientation. SystemChrome.setPreferredOrientations( [DeviceOrientation.portraitUp, DeviceOrientation.portraitDown]); return new MaterialApp( debugShowCheckedModeBanner: false, title: 'Flutter Demo', theme: new ThemeData( primarySwatch: Colors.blue, hintColor: Colors.black, inputDecorationTheme: new InputDecorationTheme( labelStyle: new TextStyle(color: Colors.white), border: OutlineInputBorder( borderRadius: BorderRadius.circular(4.0)))), home: new SplashPage() , routes: <String, WidgetBuilder>{ '/HomePage': (BuildContext context) => HomePage() }, ); } }
- SplashPage
import 'package:flutter/material.dart'; import 'dart:async'; import 'package:flutter/services.dart'; class SplashPage extends StatefulWidget { @override SplashPageState createState() => SplashPageState(); } class SplashPageState extends State<SplashPage> { startTime() async { var _duration = new Duration(seconds: 5); return new Timer(_duration, navigationPage); } void navigationPage() { Navigator.of(context).pushReplacementNamed('/HomePage'); } @override void initState() { super.initState(); startTime(); } @override Widget build(BuildContext context) { return new Scaffold( body: new Center( child: new Image.asset('images/download.png'), ), ); } }
Comments
Post a Comment