웅재의 코딩세상
Shazam - view 만들어보기 4 본문
- 두번째 페이지에서 왼쪽으로 스와이프 하면 첫번째 화면이 나오고, 오른쪽으로 스와이트 하면 세번째 화면이 나오게 하기 위해 DefaultTabController를 사용해 TabBarView로 Page들을 넘길 수 있게 해주었다.
import 'package:flutter/material.dart';
import 'SecondPage.dart';
import 'ThildPage.dart';
import 'FirstPage.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Shazam',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: HomePage(),
);
}
}
class HomePage extends StatefulWidget {
const HomePage({Key? key}) : super(key: key);
@override
State<HomePage> createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
@override
Widget build(BuildContext context) {
return DefaultTabController(
initialIndex: 1,
length: 3,
child: Scaffold(
body: Stack(
children: [
TabBarView(
children: [
FirstPage(),
SecondPage(),
ThirdPage(),
],
),
SafeArea(
child: Container(
alignment: Alignment.topCenter,
))
],
),
),
);
}
}
반응형
'android 개발 > android 실습(flutter)' 카테고리의 다른 글
Shazam - view 만들어보기 3 (0) | 2023.05.20 |
---|---|
Shazam - view 만들어보기 2 (0) | 2023.05.20 |
Shazam - view 만들어보기 1 (0) | 2023.05.20 |
당근마켓 view 만들어보기 (0) | 2023.05.19 |
로그인 페이지 만들기 - 2 (0) | 2023.05.13 |