X

Saturday, April 15, 2023

Flutter : Membuat Splash Screen

 1. main.dart 



    import 'package:first_app/bloc/user_bloc.dart';
    import 'package:first_app/ui/splash_screen/splash_screen.dart';
    import 'package:flutter/material.dart';
    
    void main() => runApp(MyApp());
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          debugShowCheckedModeBanner: false,
          home: SplashScreen(),
        );
      }
    }
2. splash_screen.dart 

    import 'dart:async';

import 'package:first_app/ui/main_page.dart';
import 'package:flutter/material.dart';

class SplashScreen extends StatefulWidget {
  @override
  _SplashScreen createState() => _SplashScreen();
}

class _SplashScreen extends State<SplashScreen> {
  @override
  void initState(){
    super.initState();
    Timer(Duration(seconds: 1),
      () => Navigator.pushReplacement(context, MaterialPageRoute(builder:(context)=> MainPage())));
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: null,
      body: Center(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Image.network(
              "URL_IMAGE",
              fit: BoxFit.contain,
              alignment: Alignment.center,
            )
          ],
        )
      ),
    );
  }
}

3. main_page.dart 

    import 'package:first_app/bloc/user_bloc.dart';
import 'package:first_app/model/user.dart';
import 'package:first_app/ui/user_card.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

class MainPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(backgroundColor: Colors.blue[400], 
      title: Text("App Baru"),
      ),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.center,  
        children: <Widget> [
          TextButton(
              style: TextButton.styleFrom(
                primary: Colors.blue,
              ),
              onPressed: () { },
              child: Text('Submit'),
            ),
            BlocBuilder<UserBloc, User>(builder: (context, user) => UserCard(user))

        ],
      ),
    );
  }
}

Read More