How to create splash screen in android application with help of flutter || intro screen in flutter || Programmer Hubs|| Programmer Rohit Sharma

 If you do not know about that what is splash screen so the first thing you know about the splash screen.

If you same article want to android with java so you can click here and read it.

Splash Screen  in android :-if you’re starting an application in your android mobile /smartphone so you see the first interface on your mobile /android device screen of the application or app. So that is called splash screen in android phone.

So if you create an android application in a flutter so you want to create an intro screen or splash screen so do follow some step:-

  1. Create a dart file that name is splash.dart.

    How to create splash screen in android application with help of flutter || intro screen in flutter || Programmer Hubs|| Programmer Rohit  Sharma

  2. And write some code but this also use statefulWidget because statefulwidget only get initstate()  Method.

  3. And also use timer method that is inbuilt method or function in dart library.

    How to create splash screen in android application with help of flutter || intro screen in flutter || Programmer Hubs|| Programmer Rohit  Sharma

  4. Timer()  is take  two argument.

        • First is duration

        • Second is callback method 

  1. main.dart open and change the home screen call splashscreen().

  2. If you also want an attractive look splash screen or intro page so basic code follow for interactive way.

    How to create splash screen in android application with help of flutter || intro screen in flutter || Programmer Hubs|| Programmer Rohit  Sharma

  3. if you want otherwise optional and you can also use video or image for intro or splash screen in a flutter.

  4. A new dart file create for after the screen is splash so the new screen is open purpose only.

  5. You can run and find the output like below given video.


       


Code Here main.dart

import 'package:flutter/material.dart';
import 'package:quizapp/splash.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: splashscreen(),
    );
  }
}

Splash.dart

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:quizapp/widget.dart';
import 'home.dart';

class splashscreen extends StatefulWidget {
  @override
  _splashscreenState createState() => _splashscreenState();
}

class _splashscreenState extends State<splashscreen> {
  @override
  void initState() {
    super.initState();
    Timer(Duration(seconds: 5), () {
      Navigator.of(context).pushReplacement(MaterialPageRoute(
        builder: (context) => homepage(),
      ));
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Center(
      child: appbar(context),
    ));
  }
}

Home.dart

import 'package:flutter/material.dart';
import 'package:quizapp/widget.dart';

class homepage extends StatefulWidget {
  @override
  _homepageState createState() => _homepageState();
}

class _homepageState extends State<homepage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: appbar(context),
        backgroundColor: Colors.white,
        elevation: 0.1,
        brightness: Brightness.light,
        actions: [
          IconButton(
            icon: Icon(
              Icons.search,
              color: Colors.black87,
            ),
            onPressed: null,
            focusColor: Colors.black12,
          ),
          IconButton(
            icon: Icon(
              Icons.settings_power,
              color: Colors.black87,
            ),
            onPressed: null,
            focusColor: Colors.black12,
          ),
        ],
      ),
      body: Center(
        child: Row(
          children: [
            //Image(image: Image.file())
            
          ],
        ),
      ),
    );
  }
}

If you any problem this code so you can leave comment and Facebook page

If you want any solution about the flutter and you want to be a new article any problem statement so also leave a comment

Thanks for reading this article


Post a Comment

0 Comments