개발노트/Flutter
[Flutter] Intro, Launcher 화면 생성하기
전지적진영시점
2023. 2. 25. 14:53
반응형
개발 환경
---------------------------------
OS : Mac
개발 툴 : android studio
개발 언어 : dart
---------------------------------
안녕하세요 전진시입니다.
이번 포스팅에서는 Flutter에서 Intro 화면을 생성할거에요
저는 일단 intro.dart 파일을 하나 생성했습니다.
화면 이동 구성은
** intro 화면 -> webView 화면으로 넘어가게 할거에요
1. Intro에 넣을 이미지 셋팅
이미지 파일 하나 구해서 assets 폴더 하나 생성하여 이미지 파일을 넣어주세요.
2. intro,dart 파일에 원하는 위치에 Timer 메서드를 넣어주세요.
저는 3초 후 이동하게 했고 initState()에 넣었습니다.
@override
void initState() {
super.initState();
Timer(const Duration(seconds:3), () {
Navigator.push(context, MaterialPageRoute(builder: (context) => WebViewPage()));
});
}
<전체 코드>
class IntroPage extends StatefulWidget {
const IntroPage({Key? key}):super(key:key);
@override
State<IntroPage> createState() => _SplashScreenState();
}
class _SplashScreenState extends State<IntroPage> {
@override
void initState() {
super.initState();
Timer(const Duration(seconds:3), () {
Navigator.push(context, MaterialPageRoute(builder: (context) => WebViewPage()));
});
}
@override
Widget build(BuildContext context){
return Scaffold(
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children:[
Container(
margin: const EdgeInsets.symmetric(horizontal:120),
child: Image.asset('assets/testImg.jpeg')
),
]
),
),
);
}
}
반응형