Flutter 앱에 스플래시 화면을 추가하는 방법은 무엇입니까? 다른 내용보다 먼저로드하여 표시해야합니다. 현재 Scaffold (home : X) 위젯이로드되기 전에 짧은 색상의 플래시가 있습니다.
Flutter 앱에 스플래시 화면을 추가하는 방법은 무엇입니까? 다른 내용보다 먼저로드하여 표시해야합니다. 현재 Scaffold (home : X) 위젯이로드되기 전에 짧은 색상의 플래시가 있습니다.
답변:
Flutter에서 스플래시 화면을 실제로 수행하는 방법에 대해 더 많은 정보를 얻고 싶습니다.
나는 여기에서 약간의 흔적을 따랐고 Flutter의 Splash Screen에 대해 상황이 그렇게 나쁘지 않은 것을 보았습니다.
어쩌면 대부분의 개발자 (예 : 나와 같은)는 Flutter에 기본적으로 스플래시 화면이 없으며 그것에 대해 무언가를해야한다고 생각합니다. 스플래시 화면이 있지만 흰색 배경으로 기본적으로 이미 iOS 및 Android 용 스플래시 화면이 있다는 것을 아무도 알 수 없습니다.
개발자가해야 할 유일한 일은 브랜딩 이미지를 올바른 위치에 놓는 것입니다. 그러면 스플래시 화면이 그대로 작동하기 시작합니다.
단계별로 수행하는 방법은 다음과 같습니다.
안드로이드에서 첫 번째 (내가 가장 좋아하는 플랫폼이기 때문에) :)
Flutter 프로젝트에서 "android"폴더를 찾으십시오.
앱-> src-> main-> res 폴더로 이동하여 브랜딩 이미지의 모든 변형을 해당 폴더에 배치하십시오. 예를 들면 다음과 같습니다.
기본적으로 안드로이드 폴더에는 drawable-mdpi, drawable-hdpi 등이 없지만 원하는 경우 만들 수 있습니다. 이 때문에 이미지는 밉맵 폴더에 배치해야합니다. 또한 스플래시 화면 (Android)에 대한 기본 XML 코드는 @drawable 리소스 대신 @mipmap을 사용합니다 (원하는 경우 변경할 수 있음).
Android의 마지막 단계는 drawable / launch_background.xml 파일에서 일부 XML 코드의 주석 처리를 제거하는 것입니다. app-> src-> main-> res-> drawable을 찾아 launch_background.xml을여십시오. 이 파일 안에 슬래시 화면 배경이 흰색 인 이유를 알 수 있습니다. 2 단계에서 배치 한 브랜딩 이미지를 적용하려면 launch_background.xml 파일에서 일부 XML 코드의 주석 처리를 제거해야합니다. 변경 후 코드는 다음과 같아야합니다.
<!--<item android:drawable="@android:color/white" />-->
<item>
<bitmap
android:gravity="center"
android:src="@mipmap/your_image_name" />
</item>
흰색 배경의 XML 코드를 주석 처리하고 밉맵 이미지에 대한 코드의 주석 처리를 제거하십시오. 누군가 관심이 있다면 launch_background.xml 파일이 styles.xml 파일에 사용됩니다.
iOS에서 두 번째 :
Flutter 프로젝트에서 "ios"폴더를 찾으십시오.
러너-> Assets.xcassets-> LaunchImage.imageset을 찾으십시오. LaunchImage.png, LaunchImage@2x.png 등이 있어야합니다. 이제이 이미지를 브랜딩 이미지 변형으로 바꿔야합니다. 예를 들면 다음과 같습니다.
내가 틀렸다면 LaunchImage@4x.png가 기본적으로 존재하지 않지만 쉽게 만들 수 있습니다. LaunchImage@4x.png가 없으면 이미지와 같은 디렉토리에있는 Contents.json 파일에서도 선언해야합니다. 변경 후 내 Contents.json 파일은 다음과 같습니다.
{
"images" : [
{
"idiom" : "universal",
"filename" : "LaunchImage.png",
"scale" : "1x"
},
{
"idiom" : "universal",
"filename" : "LaunchImage@2x.png",
"scale" : "2x"
},
{
"idiom" : "universal",
"filename" : "LaunchImage@3x.png",
"scale" : "3x"
},
{
"idiom" : "universal",
"filename" : "LaunchImage@4x.png",
"scale" : "4x"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}
다음에 앱을 실행할 때 필요한 모든 것이 안드로이드 또는 iOS에서 추가 한 브랜딩 이미지가 포함 된 올바른 스플래시 화면이 있어야합니다.
감사
Cannot resolve symbol '@mipmap/ic_launcher'
Android Studio 3.1.1에서 오류가 발생 했지만 (캐시를 다시 빌드 한 후에도) 앱이 오류없이 컴파일되어 실행되었으며 실행기 그래픽이 표시되었습니다.
당신이 경우 flutter create
프로젝트를 개발, 당신은 단계를 수행 할 수 https://flutter.io/assets-and-images/#updating-the-launch-screen을 .
Flutter는 실제로 응용 프로그램에 스플래시 화면을 추가하는 더 간단한 방법을 제공합니다. 다른 앱 화면을 디자인 할 때 먼저 기본 페이지를 디자인해야합니다. 몇 초 후에 상태가 변경되므로 StatefulWidget 으로 만들어야합니다 .
import 'dart:async';
import 'package:flutter/material.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: 3),
() => Navigator.of(context).pushReplacement(MaterialPageRoute(
builder: (BuildContext context) => HomeScreen())));
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
body: Center(
child: Image.asset('assets/splash.png'),
),
);
}
}
논리 initState () 내부에서 원하는 기간 으로 Timer () 를 호출 합니다. 원하는대로 탐색기를 응용 프로그램의 홈 화면으로 푸시하면 3 초가 걸립니다.
참고 : 응용 프로그램은 스플래시 화면을 한 번만 표시해야하며 사용자는 뒤로 버튼을 눌러도 다시 스플래시 화면으로 돌아 가지 않아야합니다. 이를 위해 Navigator.pushReplacement ()를 사용 합니다. 새 화면으로 이동하고 탐색 기록 스택에서 이전 화면을 제거합니다.
더 잘 이해하려면 Flutter : 자신 만의 스플래시 화면 디자인을 방문하십시오 .
이에 대한 좋은 예는 아직 없지만 각 플랫폼의 기본 도구를 사용하여 직접 수행 할 수 있습니다.
iOS : https://docs.nativescript.org/publishing/creating-launch-screens-ios
안드로이드 : https://www.bignerdranch.com/blog/splash-screens-the-right-way/
스플래시 화면의 예제 코드 업데이트에 대해서는 8147 호를 구독하십시오 . 스플래시 화면과 iOS의 앱간에 검은 색 깜박임이 발생하면 업데이트 8127 문제를 구독하십시오 .
편집 : 2017 년 8 월 31 일부터 이제 새 프로젝트 템플릿에서 스플래시 화면에 대한 지원이 개선되었습니다. # 11505를 참조하십시오 .
Android의 경우 android> app> src> main> res> drawable> launcher_background.xml로 이동하십시오.
이제 주석 처리를 제거하고 @ mipmap / launch_image 를 이미지 위치로 바꾸 십시오.
<item>
<bitmap
android:gravity="center"
android:src="@mipmap/launch_image" />
</item>
여기에서 화면 색상을 변경할 수 있습니다.
<item android:drawable="@android:color/white" />
flutter에 스플래시 화면을 추가하는 가장 쉬운 방법은이 패키지를 imho하는 것입니다 : https://pub.dev/packages/flutter_native_splash
프로젝트의 pubspec.yaml 파일에 설정을 추가하거나 루트 프로젝트 폴더에 flutter_native_splash.yaml이라는 파일을 설정으로 만듭니다.
flutter_native_splash:
image: assets/images/splash.png
color: "42a5f5"
이미지는 png 파일이어야합니다.
#을 컬러로도 사용할 수 있습니다. color : "# 42a5f5"특정 플랫폼의 스플래시 화면을 만들지 않으려는 경우 android 또는 ios를 false로 설정할 수도 있습니다.
flutter_native_splash:
image: assets/images/splash.png
color: "42a5f5"
android: false
이미지에서 사용 가능한 모든 화면 (너비 및 높이)을 사용해야하는 경우 채우기 속성을 사용할 수 있습니다.
flutter_native_splash:
image: assets/images/splash.png
color: "42a5f5"
fill: true
참고 : fill 속성은 아직 iOS 스플래시 화면에 구현되지 않았습니다.
Android에서 전체 화면 스플래시 화면을 사용하지 않으려면 android_disable_fullscreen 속성을 사용할 수 있습니다.
flutter_native_splash:
image: assets/images/splash.png
color: "42a5f5"
android_disable_fullscreen: true
설정을 추가 한 후 다음을 사용하여 패키지를 실행하십시오.
flutter pub pub run flutter_native_splash:create
패키지 실행이 완료되면 스플래시 화면이 준비됩니다.
아래 코드를 시도하고 나를 위해 일했습니다.
import 'dart:async';
import 'package:attendance/components/appbar.dart';
import 'package:attendance/homepage.dart';
import 'package:flutter/material.dart';
class _SplashScreenState extends State<SplashScreen>
with SingleTickerProviderStateMixin {
void handleTimeout() {
Navigator.of(context).pushReplacement(new MaterialPageRoute(
builder: (BuildContext context) => new MyHomePage()));
}
startTimeout() async {
var duration = const Duration(seconds: 3);
return new Timer(duration, handleTimeout);
}
@override
void initState() {
// TODO: implement initState
super.initState();
_iconAnimationController = new AnimationController(
vsync: this, duration: new Duration(milliseconds: 2000));
_iconAnimation = new CurvedAnimation(
parent: _iconAnimationController, curve: Curves.easeIn);
_iconAnimation.addListener(() => this.setState(() {}));
_iconAnimationController.forward();
startTimeout();
}
@override
Widget build(BuildContext context) {
return new Scaffold(
body: new Scaffold(
body: new Center(
child: new Image(
image: new AssetImage("images/logo.png"),
width: _iconAnimation.value * 100,
height: _iconAnimation.value * 100,
)),
),
);
}
}
이미지와 같은 오류가 발생하는 사람은 당신이 추가되어 있는지 검증 응답 메이크업을 적용한 후 발견되지 @ 밉맵 / ic_launcher 대신 @ 밉맵 / ic_launcher.png
@Collin Jackson과 @Sniper가 모두 맞습니다. 다음 단계에 따라 Android 및 iOS에서 각각 시작 이미지를 설정할 수 있습니다. 그런 다음 MyApp (), initState ()에서 Future.delayed를 사용하여 타이머를 설정하거나 API를 호출 할 수 있습니다. Future에서 응답이 반환 될 때까지 시작 아이콘이 표시되고 응답이 오면 시작 화면 후 이동하려는 화면으로 이동할 수 있습니다. 이 링크를 볼 수 있습니다 : Flutter Splash Screen
아래와 같은 페이지를 추가하고 라우팅하면 도움이 될 수 있습니다.
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutkart/utils/flutkart.dart';
import 'package:flutkart/utils/my_navigator.dart';
class SplashScreen extends StatefulWidget {
@override
_SplashScreenState createState() => _SplashScreenState();
}
class _SplashScreenState extends State<SplashScreen> {
@override
void initState() {
// TODO: implement initState
super.initState();
Timer(Duration(seconds: 5), () => MyNavigator.goToIntro(context));
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Stack(
fit: StackFit.expand,
children: <Widget>[
Container(
decoration: BoxDecoration(color: Colors.redAccent),
),
Column(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Expanded(
flex: 2,
child: Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
CircleAvatar(
backgroundColor: Colors.white,
radius: 50.0,
child: Icon(
Icons.shopping_cart,
color: Colors.greenAccent,
size: 50.0,
),
),
Padding(
padding: EdgeInsets.only(top: 10.0),
),
Text(
Flutkart.name,
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 24.0),
)
],
),
),
),
Expanded(
flex: 1,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
CircularProgressIndicator(),
Padding(
padding: EdgeInsets.only(top: 20.0),
),
Text(
Flutkart.store,
softWrap: true,
textAlign: TextAlign.center,
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 18.0,
color: Colors.white),
)
],
),
)
],
)
],
),
);
}
}
팔로우하려면 https://www.youtube.com/watch?v=FNBuo-7zg2Q를 참조하십시오.
여러 가지 방법 으로이 작업을 수행 할 수 있지만 사용하는 가장 쉬운 방법은 다음과 같습니다.
Launch Icons의 경우 flutter 라이브러리를 사용합니다. Flutter Launcher Icon
사용자 정의 스플래시 화면의 경우 다른 화면 해상도를 만든 다음 Android의 해상도에 따라 밉맵 폴더에 스플래시 이미지를 추가합니다.
마지막 부분은 안드로이드 res 폴더의 드로어 블 폴더에서 launch_background.xml을 조정하는 것입니다.
다음과 같이 코드를 변경하십시오.
<?xml version="1.0" encoding="utf-8"?>
<!-- Modify this file to customize your launch splash screen -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- <item android:drawable="@android:color/white" />
<item android:drawable="@drawable/<splashfilename>" /> --> -->
<!-- You can insert your own image assets here -->
<item>
<bitmap
android:gravity="center"
android:src="@mipmap/<Your splash image name here as per the mipmap folder>"/>
</item>
</layer-list>
스플래시를 드로어 블로 추가하는 것을 보지 못한 개발자는 거의 없었지만 Flutter 1.0.0 및 Dart SDK 2.0 이상에서는 빌드가 실패했습니다. 따라서 비트 맵 섹션에 스플래시를 추가하는 것을 선호합니다.
iOS 스플래시 화면 생성이 훨씬 간단합니다.
iOS의 Runner 폴더에서 LaunchImage.png @ 2x, @ 3x, @ 4x와 동일한 이름의 사용자 정의 스플래시 화면 이미지로 LaunchImage.png 파일을 업데이트하십시오.
추가로 LaunchImage.imageset에 4x 이미지가있는 것이 좋습니다. 4x 스케일 옵션을 추가하려면 3x 스케일 아래의 다음 행으로 Content.json에서 코드를 업데이트하십시오.
{
"idiom" : "universal",
"filename" : "LaunchImage@4x.png",
"scale" : "4x"
}
당신의 머티리얼 앱을 이렇게 만드십시오
=> 의존성 추가
=> 가져 오기 가져 오기 'package : splashscreen / splashscreen.dart';
import 'package:flutter/material.dart';
import 'package:splashscreen/splashscreen.dart';
import 'package:tic_tac_toe/HomePage.dart';
void main(){
runApp(
MaterialApp(
darkTheme: ThemeData.dark(),
debugShowCheckedModeBanner: false,
home: new MyApp(),
)
);
}
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => new _MyAppState();
}
class _MyAppState extends State<MyApp> {
@override
Widget build(BuildContext context) {
return new SplashScreen(
seconds: 6,
navigateAfterSeconds: new HomePage(),
title: new Text('Welcome',
style: new TextStyle(
fontWeight: FontWeight.bold,
fontSize: 26.0,
color: Colors.purple,
),
),
image: Image.asset("images/pic9.png"),
backgroundColor: Colors.white,
photoSize: 150.0,
);
}
}
이와 같은 최종 화면 출력은 요구 사항에 따라 두 번째로 변경할 수 있습니다. 원은 원형입니다.
Flutter에서 동적 스플래시 화면을 추가하는 가장 좋은 방법은 오류가 없습니다.
MAIN.DART
import 'package:flutter/material.dart';
import 'constant.dart';
void main() => runApp(MaterialApp(
title: 'GridView Demo',
home: SplashScreen(),
theme: ThemeData(
primarySwatch: Colors.red,
accentColor: Color(0xFF761322),
),
routes: <String, WidgetBuilder>{
SPLASH_SCREEN: (BuildContext context) => SplashScreen(),
HOME_SCREEN: (BuildContext context) => BasicTable(),
//GRID_ITEM_DETAILS_SCREEN: (BuildContext context) => GridItemDetails(),
},
));
SPLASHSCREEN.DART
import 'dart:async';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:app_example/constants.dart';
class SplashScreen extends StatefulWidget {
@override
SplashScreenState createState() => new SplashScreenState();
}
class SplashScreenState extends State<SplashScreen>
with SingleTickerProviderStateMixin {
var _visible = true;
AnimationController animationController;
Animation<double> animation;
startTime() async {
var _duration = new Duration(seconds: 3);
return new Timer(_duration, navigationPage);
}
void navigationPage() {
Navigator.of(context).pushReplacementNamed(HOME_SCREEN);
}
@override
dispose() {
animationController.dispose();
super.dispose();
}
@override
void initState() {
super.initState();
animationController = new AnimationController(
vsync: this,
duration: new Duration(seconds: 2),
);
animation =
new CurvedAnimation(parent: animationController, curve: Curves.easeOut);
animation.addListener(() => this.setState(() {}));
animationController.forward();
setState(() {
_visible = !_visible;
});
startTime();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Stack(
fit: StackFit.expand,
children: <Widget>[
new Column(
mainAxisAlignment: MainAxisAlignment.end,
mainAxisSize: MainAxisSize.min,
children: <Widget>[
Padding(
padding: EdgeInsets.only(bottom: 30.0),
child: new Image.asset(
'assets/images/powered_by.png',
height: 25.0,
fit: BoxFit.scaleDown,
),
)
],
),
new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Image.asset(
'assets/images/logo.png',
width: animation.value * 250,
height: animation.value * 250,
),
],
),
],
),
);
}
}
CONSTANTS.DART
String SPLASH_SCREEN='SPLASH_SCREEN';
String HOME_SCREEN='HOME_SCREEN';
HOMESCREEN.DART
import 'package:flutter/material.dart';
class BasicTable extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("Table Widget")),
body: Center(child: Text("Table Widget")),
);
}
}
Jaldhi Bhatt의 코드는 저에게 효과적이지 않습니다.
Flutter는 ' 네비게이터가 포함되지 않은 컨텍스트로 요청 된 네비게이터 작업 '을 발생시킵니다.
이 기사 에서 언급 한 것처럼 경로를 사용하여 네비게이터 컨텍스트를 초기화하는 다른 구성 요소 안에 네비게이터 소비자 구성 요소를 래핑하는 코드를 수정했습니다 .
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:my-app/view/main-view.dart';
class SplashView extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
home: Builder(
builder: (context) => new _SplashContent(),
),
routes: <String, WidgetBuilder>{
'/main': (BuildContext context) => new MainView()}
);
}
}
class _SplashContent extends StatefulWidget{
@override
_SplashContentState createState() => new _SplashContentState();
}
class _SplashContentState extends State<_SplashContent>
with SingleTickerProviderStateMixin {
var _iconAnimationController;
var _iconAnimation;
startTimeout() async {
var duration = const Duration(seconds: 3);
return new Timer(duration, handleTimeout);
}
void handleTimeout() {
Navigator.pushReplacementNamed(context, "/main");
}
@override
void initState() {
super.initState();
_iconAnimationController = new AnimationController(
vsync: this, duration: new Duration(milliseconds: 2000));
_iconAnimation = new CurvedAnimation(
parent: _iconAnimationController, curve: Curves.easeIn);
_iconAnimation.addListener(() => this.setState(() {}));
_iconAnimationController.forward();
startTimeout();
}
@override
Widget build(BuildContext context) {
return new Center(
child: new Image(
image: new AssetImage("images/logo.png"),
width: _iconAnimation.value * 100,
height: _iconAnimation.value * 100,
)
);
}
}
기본 스플래시 화면 다음에 보조 스플래시 화면을 원할 경우 작동하는 간단한 예는 다음과 같습니다.
class SplashPage extends StatelessWidget {
SplashPage(BuildContext context) {
Future.delayed(const Duration(seconds: 3), () {
// Navigate here to next screen
});
}
@override
Widget build(BuildContext context) {
return Text('Splash screen here');
}
}
Flutter는 기본적으로 스플래시 화면을 제공하는 기능을 제공하지만 작업을 수행 할 수있는 많은 플러그인이 있습니다. 작업에 플러그인을 사용하지 않으려는 경우 새 플러그인을 추가하면 앱 크기에 영향을 줄 수 있습니다. 그러면 이렇게 할 수 있습니다.
안드로이드
launch_background.xml을 연 다음 스플래시 화면 이미지 또는 원하는 그라디언트 색상을 넣을 수 있습니다. 사용자가 앱을 열 때 가장 먼저 보게됩니다.
iOS 용
Xcode를 사용하여 앱을 열고 Runner> Assest.xcassets> LaunchImage를 클릭하십시오. 여기에서 이미지를 추가 할 수 있습니다. 시작 화면 이미지의 위치 또는 편집 위치를 편집하려면 LaunchScreen.storyboard에서 편집 할 수 있습니다.
다음은 Flutter 앱용 IOS 및 Android 플랫폼에서 스플래시 화면을 구성하는 단계입니다.
iOS 플랫폼
Apple App Store에 제출 된 모든 앱은 Xcode 스토리 보드를 사용하여 앱의 시작 화면을 제공해야합니다. 이것을 3 단계로하자 :-
1 단계 : 앱 디렉토리의 루트에서 ios / Runner.xcworkspace를 엽니 다.
2 단계 : 프로젝트 탐색기에서 Runner / Assets.xcassets를 선택하고 모든 크기 (2x, 3x 등)의 시작 이미지를 드래그합니다. https://appicon.co/#image-sets 에서 다른 크기의 이미지를 생성 할 수도 있습니다.
3 단계 : LaunchScreen.storyboard 파일에 제공된 이미지가 표시되는 것을 볼 수 있습니다. 여기서 이미지를 드래그하여 이미지의 위치를 변경할 수도 있습니다. 자세한 내용은 공식 설명서 https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/launch-screen/ 를 참조 하십시오.
안드로이드 플랫폼
Android에서는 Android 앱이 초기화되는 동안 시작 화면이 표시됩니다. 이 시작 화면을 3 단계로 설정해 보겠습니다.
1 단계 : android / app / src / main / res / drawable / launch_background.xml 파일을 엽니 다.
2 단계 : 4 번 줄에서 원하는 색상을 선택할 수 있습니다.
<item android:drawable="@android:color/white" />
3 단계 : 10 번 줄에서 이미지를 변경할 수 있습니다.
android:src="@mipmap/launch_image"
그게 다야, 끝났어! 행복한 코딩 :)
Android
앱-> src-> main-> res-> drawble-> launch_background.xml의 경우 주석 처리 된 블록의 주석 처리를 제거하십시오.
<item>
<bitmap
android:gravity="center"
android:src="@mipmap/launch_image" /></item>
이처럼 코딩 한 후 오류가 발생
합니까? 안드로이드 스튜디오에서 시스템과 동기화 사용 또는 캐시 및 재설정을 무효화하십시오. 이 문제를 해결했습니다. 플러터 디버그 모드에서 스플래시 화면에 약간의 시간이 걸립니다. 빌드 후 네이티브 안드로이드처럼 줄어 듭니다.
Flutter.dev는 이미 최선의 답변을 제공합니다. 버그도 아니고 문제도 아닙니다. 시간을 내면 모든 것이 해결됩니다. 좋은 하루 되세요.
https://flutter.dev/docs/development/ui/advanced/splash-screen
SplashScreen(
seconds: 3,
navigateAfterSeconds: new MyApp(),
// title: new Text(
// 'Welcome In SplashScreen',
// style: new TextStyle(fontWeight: FontWeight.bold, fontSize: 20.0),
// ),
image: new Image.network('https://upload.wikimedia.org/wikipedia/commons/thumb/b/bd/Tesla_Motors.svg/1200px-Tesla_Motors.svg.png'),
backgroundColor: Colors.white,
styleTextUnderTheLoader: new TextStyle(),
photoSize: 150.0,
loaderColor: Colors.black),
),
);