Facebook Twitter Instagram
    DeepCrazyWorld
    Facebook Twitter Instagram Pinterest YouTube
    • FLUTTER
      • FLUTTER APP
        • QRCode
        • Quiz App
        • Chat GPT
        • PDF App
        • News App
        • Fitness App
        • Weather App
        • BMI Calculator
        • GAME APP
        • Ecommerce App
        • wallpaper App
        • Finance app
        • Chat App
        • Wallet App
        • Taxi App
        • Quran app
        • Music player app
      • FLUTTER UI
        • Splash Screen
        • Onboarding Screen
        • Login Screen
        • Card Design
        • Drawer
    • PROJECT
      • Android Projects
      • College Projects
      • FLUTTER APP
      • Project Ideas
      • PHP Projects
      • Python Projects
    • SOURCE CODE
    • ANDROID
      • ANDROID APP
      • GAME APP
      • ANDROID STUDIO
    • MCQ
      • AKTU MCQ
        • RPA MCQ
        • COA MCQ
        • HPC MCQ
        • SPM MCQ
        • Renewable Energy All MCQ
        • Data Compression MCQ
        • Data Structure MCQ
        • Digital Image Processing MCQ
        • Software Engineering MCQ
        • Machine Learning MCQ
        • Artificial Intelligence MCQ
      • D PHARMA MCQ
        • Pharmaceutics – I MCQ
        • Pharmacognosy MCQ
        • Pharmaceutical Chemistry MCQ
        • Biochemistry and Clinical Pathology MCQ
        • Human Anatomy and Physiology MCQ
        • Heath Education and Community Pharmacy MCQ
    • INTERVIEW QUESTIONS
      • Flutter Interview Questions
      • INTERVIEW QUESTIONS
      • Python Interview Questions
      • Coding ninjas solution
    • MORE
      • WORDPRESS
        • SEO
        • TOP 10 WORDPRESS THEME
      • PRODUCTIVITY
      • Program
      • QUOTES
    DeepCrazyWorld
    Home»Splash Screen»A Splash Screen ui design using Flutter source code
    Splash Screen

    A Splash Screen ui design using Flutter source code

    DeepikaBy DeepikaNovember 13, 2023Updated:November 14, 2023No Comments3 Mins Read

    Splash Screen View with Flutter – A Splash Screen ui design using Flutter source code

    This is a Splash Screen Package

    Table of Contents

    Toggle
    • Features
    • SplashScreen with Gradient
    • Using Code
    • Using Code
    • (Optional) Using Code .
      • ScreenShot
        • Resources Used:
    • Get Full Source Code
    • Conclusion
        • Related Articles:
      • READ MORE

    Features

    SplashScreen({
        super.key,
        this.duration = const Duration(seconds: 5),
        required this.nextPage,
        this.circleHeight = 0,
        this.iconBackgroundColor,
        this.backgroundColor,
        this.timer,
        this.child,
        this.text,
      });
    

    SplashScreen with Gradient

      SplashScreen.gradient({
        super.key,
        this.duration = const Duration(seconds: 5),
        this.gradient,
        required this.nextPage,
        this.circleHeight = 0,
        this.iconBackgroundColor,
        this.timer,
        this.child,
        this.text,
      });

    Using Code

    SplashScreen(
            backgroundColor: Colors.purple,
            duration: const Duration(minutes: 1),
            nextPage: const WelcomePage(),
            iconBackgroundColor: Colors.white,
            circleHeight: 60,
            child: Icon(
              Icons.ac_unit_outlined,
              size: 50,
            ),
            text: const Text(
              "ImCoderAditya",
              style: TextStyle(
                color: Colors.white,
                fontSize: 30,
                fontWeight: FontWeight.bold,
              ),
            ),
        ),

    Using Code

     SplashScreen.gradient(
          gradient: const LinearGradient(
              begin: Alignment.topCenter,
              colors: [
                Colors.red,
                Colors.pink,
                Colors.purpleAccent,
              ],
            ),
            duration: const Duration(minutes: 1),
            nextPage: const WelcomePage(),
            iconBackgroundColor: Colors.white,
            circleHeight: 60,
            child: Icon(
              Icons.code,
              size: 50,
            ),
            text: const Text(
              "ImCoderAditya",
              style: TextStyle(
                color: Colors.white,
                fontSize: 30,
                fontWeight: FontWeight.bold,
              ),
            ),
          ),

    (Optional) Using Code .

    SystemChrome.setSystemUIOverlayStyle(
        const SystemUiOverlayStyle(
          statusBarColor: Colors.transparent,
          statusBarIconBrightness: Brightness.dark,
        ),
      );

    ScreenShot

    loading...
    loading...
    loading...
    loading...
    loading...

    Resources Used:

    • YouTube
    • Dart & Flutter Packages

    You can check out the entire code of this App here:

    Get Full Source Code

    View Github

    download source code

    Conclusion

    This was all about a quick go through the basic flutter App UI Screen. If you need any assistance regarding flutter app development, you can consult a flutter developer from FlutterDesk. We would love to be of help. Still, if you feel any difficult while dealing with Flutter app development projects, you can reach out to us or hire Flutter developers to outsource any of your app development project.

    Do like & share my Facebook page. if you find this post helpful. Thank you!!

    Happy coding! 😉

    Related Articles:

    • Onboarding screen UI with Flutter source code
    • Quiz App using flutter with source code
    • Flutter QR Code Generator and Scanner with source code
    • QR code scanner in flutter bowser app source code
    • Flutter Quran app to read or listen to the holly quran source code
    • Beautiful animated onboarding screen using flutter source code
    • Flutter animation transition and animation painter logo splash screen
    • Flutter Splash screen with curved custom bottom sheet and dots indicator
    • Flutter 2.0 (Null safety) Splash screens with flutter good way
    • Splash Screen for Food Delivery app with flutter source code
    • Animated Splash Screen with Flutter source code
    • Splash Login UI screen with Animation using flutter
    • Animated OnBoarding screens with the page indicator using flutter
    • Beautiful Onboarding screen ui using flutter source code
    • Flutter Onboarding Screen Onboard package for Flutter project
    • Beautiful onboarding screen using Flutter source code
    • Custom and beautiful onboarding screen easily with Flutter
    • Onboarding Screen UI for ecommerce app using flutter source code
    • Intro screens using flutter package for some material design app
    • Create onboarding page using flutter package provide
    • Flutter Onboarding, caching, splash screen, icon app name change
    • Beautiful Animated splash screen ui design with flutter
    • Flutter Ecommerce App build using flutter, getx with source code
    • Login Screen with Firebase Auth and Facebook Login using flutter

    READ MORE

    Share. Facebook Twitter LinkedIn WhatsApp Telegram Pinterest Reddit Email
    Previous ArticleSplash Login UI screen with Animation using flutter
    Next Article Animated Splash Screen with Flutter source code

    Related Posts

    Animated Backgrounds in Flutter: A Complete Guide

    FLUTTER 4 Mins Read

    How to Create Music Player UI screen with fully functional in flutter

    FLUTTER APP 3 Mins Read

    How to make ListView Builder Ui in flutter with Source Code

    FLUTTER UI 5 Mins Read

    How to create TabBar view in flutter with source code step wise

    FLUTTER UI 5 Mins Read

    Comments are closed.

    Recent Posts
    • Implementing a Dynamic FAQ Screen UI in Flutter Using ExpansionTile March 29, 2025
    • Creating an Instruction UI Screen in Flutter Application March 29, 2025
    • Animated Backgrounds in Flutter: A Complete Guide March 15, 2025
    • How to make Diary App using flutter stepwise using getx August 31, 2024
    • How to Create Music Player UI screen with fully functional in flutter August 30, 2024
    • How to make ListView Builder Ui in flutter with Source Code August 29, 2024
    • Create a TabBar View in flutter with fully functional stepwise August 28, 2024
    • How to create TabBar view in flutter with source code step wise August 27, 2024
    • How to make Heart rate measure app with Flutter stepwise August 26, 2024
    • How to make ChatGpt App in flutter with source code Stepwise August 25, 2024
    Facebook Twitter Instagram Pinterest YouTube
    • About
    • Contact
    • Disclaimer
    • Privacy Policy
    Copyright by DeepCrazyWorld © 2025

    Type above and press Enter to search. Press Esc to cancel.