상식닷컴
로그인
가입하기
2026년 상식닷컴 선정 식당 & 카페 리스트
2025년 2026년 신상 호텔 리스트
최근에 오픈한 호텔을 찾는다면 살펴보세요
일주일 식단표 어플
자동 일주일 식단표 어플
안드로이드
아이폰
주식 & 코인 차트의 신
1000만원으로 2000만원 만들기 프로젝트
수정하기 - 플러터에서 라우팅을 설정하는 방법은 무엇인가요?
닉네임
비밀번호
제목
내용
[이미지 업로드는 권한이 있는 사람만 가능. 하단 카톡으로 연락]
플러터에서 라우팅을 설정하는 방법은 애플리케이션의 구조와 사용자 경험을 정의하는 중요한 부분입니다. 라우팅은 사용자가 앱 내에서 다양한 화면(위젯) 간에 이동할 수 있도록 해줍니다. 플러터에서는 기본적으로 두 가지 라우팅 방법을 제공합니다: 명명된 라우트(named routes)와 비동기 라우트(anonymous routes). 아래에서는 이 두 가지 방법을 포함하여 라우팅을 설정하는 방법을 자세히 설명하겠습니다. 1. 기본적인 라우팅 설정 플러터에서 라우팅을 설정하기 위해서는 `MaterialApp` 위젯을 사용합니다. `MaterialApp`은 앱의 최상위 위젯으로, 라우팅을 포함한 여러 설정을 관리합니다. ```dart import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends <a href='https://sangseek.com/sangseeks/StatelessWidget/ko'>StatelessWidget</a> { @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Routing Demo', initialRoute: '/', routes: { '/': (context) => HomeScreen(), '/second': (context) => SecondScreen(), }, ); } } class HomeScreen extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: Text('Home Screen')), body: Center( child: ElevatedButton( onPressed: () { Navigator.pushNamed(context, '/second'); }, child: Text('Go to Second Screen'), ), ), ); } } class SecondScreen extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: Text('Second Screen')), body: Center( child: ElevatedButton( onPressed: () { Navigator.pop(context); }, child: Text('Back to Home Screen'), ), ), ); } } ``` 2. 명명된 라우트(Named Routes) 위의 예제에서 보듯이, `routes` 속성을 사용하여 명명된 라우트를 설정할 수 있습니다. 각 라우트는 문자열 키와 해당 라우트에 대한 빌더 함수를 매핑합니다. `Navigator.pushNamed` 메서드를 사용하여 특정 라우트로 이동할 수 있습니다. 3. 비동기 라우트(Anonymous Routes) 비동기 라우트는 라우트를 정의하지 않고 직접 위젯을 생성하여 이동하는 방법입니다. 이 방법은 라우트가 동적으로 생성될 때 유용합니다. ```dart Navigator.push( context, Ma<a href='https://sangseek.com/sangseeks/terialPageRoute/ko'>terialPageRoute</a>(builder: (context) => SecondScreen()), ); ``` 4. 라우트 매개변수 전달 라우트 간에 데이터를 전달하려면, `Navigator.pushNamed` 메서드의 `<a href='https://sangseek.com/sangseeks/arguments/ko'>arguments</a>` 매개변수를 사용할 수 있습니다. 수신 측에서는 `ModalRoute.of(context).settings.arguments`를 통해 데이터를 받을 수 있습니다. ```dart // 데이터 전달 Navigator.pushNamed( context, '/second', arguments: 'Hello from Home Screen', ); // SecondScreen에서 데이터 수신 class SecondScreen extends StatelessWidget { @override Widget build(BuildContext context) { final String message = ModalRoute.of(context)!.settings.arguments as String; return Scaffold( appBar: AppBar(title: Text('Second Screen')), body: Center( child: Text(message), ), ); } } ``` 5. 라우트 생성 및 관리 플러터에서는 `onGenerateRoute` 속성을 사용하여 라우트를 동적으로 생성할 수 있습니다. 이 방법은 라우트가 많아질 경우 유용합니다. ```dart MaterialApp( onGenerateRoute: (settings) { switch (settings.name) { case '/': return MaterialPageRoute(builder: (context) => HomeScreen()); case '/second': return MaterialPageRoute(builder: (context) => SecondScreen()); default: return null; } }, ); ``` 6. 네비게이션 스택 관리 플러터의 네비게이션은 스택 기반입니다. 사용자가 화면을 이동할 때마다 새로운 화면이 스택에 추가되고, 뒤로 가기를 누르면 스택에서 제거됩니다. `Navigator.pop(context)`를 사용하여 이전 화면으로 돌아갈 수 있습니다. 7. 라우트 전환 애니메이션 플러터는 기본적으로 화면 전환 애니메이션을 제공합니다. 필요에 따라 커스텀 애니메이션을 추가할 수도 있습니다. `PageRouteBuilder`를 사용하여 사용자 정의 전환 애니메이션을 만들 수 있습니다. ```dart Navigator.push( context, PageRouteBuilder( pageBuilder: (context, animation, secondaryAnimation) => SecondScreen(), transitionsBuilder: (context, animation, secondaryAnimation, child) { const begin = Offset(1.0, 0.0); const end = Offset.zero; const curve = Curves.easeInOut; var tween = Tween(begin: begin, end: end).chain(CurveTween(curve: curve)); var offsetAnimation = animation.drive(tween); return SlideTransition( position: offsetAnimation, child: child, ); }, ), ); ``` 결론 플러터에서 라우팅을 설정하는 것은 애플리케이션의 사용자 경험을 정의하는 중요한 요소입니다. 명명된 라우트, 비동기 라우트, 라우트 매개변수 전달, 동적 라우트 생성 등 다양한 방법을 통해 유연하게 라우팅을 관리할 수 있습니다. 이러한 기능들을 활용하여 사용자에게 매끄럽고 직관적인 네비게이션 경험을 제공할 수 있습니다.
이용안내
커뮤니티 이용안내
×
- 게시한 게시글로 발생하는 문제는 게시자에게 책임이 있습니다.
- 게시글이 타인/타업체의 저작권을 침해할 경우 모든 책임은 게시자에게 있습니다. 게시자가 모든 손해를 부담해야 합니다.
- 상식닷컴 운영자는 게시자와 상의하지 않고 게시글을 수정 또는 삭제할 수 있습니다.
- 상식닷컴 운영자는 깨끗한 커뮤니티 공간을 만드는 것이 1순위입니다.
수정하기
취소하기