플러터 flutter 화면이동 기본 형태 + Back Button 막기

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      //routes: Routes.routes,
      home:EntrancePage(),
    );
  }
}

class EntrancePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Entrance Page'),
      ),
      body: Column(
        children: [
          
            ElevatedButton(
              child: Text('move!!'),
              onPressed: () {
                Navigator.push(context,
                    MaterialPageRoute(builder: (context) => ExitPage()));
              },
            ),
          ],
        )
    );
  }
}

class ExitPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Exit Page'),
      ),
      body: Container(
        child: Center(
          child: ElevatedButton(
            child: Text('Exit!!'),
            onPressed: () {
              Navigator.pop(context,
                  MaterialPageRoute(builder: (context) => EntrancePage()));
            },
          ),
        ),
      ),
    );
  }
}

메인에서 MyApp 클래스를 가져오고 

MyApp 클래스의 메터리얼 앱 홈에선 
home:EntrancePage()
클래스를 불러오고 
EntrancePage 클래스에는 Scaffold로 제목 본문 구분 후
본문에 ElevatedButton을 두고 
onPressed: 프레스 시 ExitPage() 클래스를 하위 페이지로 불러옴

ExitPage()를 불러올 때 제목 부분에 뒤로 가기 버튼이 생성된다. 

 

 

 

화면

버튼을 누르면 양쪽 화면을 왔다 갔다 이동한다. 

Entrance Page 부분은 Navigator.push를 통해 하위 페이지로 클래스를 불러왔지만 

Exit Page 부분은 Navigator.pop을 하고 홈으로 돌아오기 때문에 

돌아올 때는 제목 부분에 뒤로가기 화살표가 안생김 

 

Exit는 Entrance Page 를 호출하는 것이 아니라 자신을 삭제하고 원래 화면으로 돌아가기 때문으로 보임

 

 

++++

 

백 키 막기

이전 경로(Route)로 돌아가는 것을 막는 클래스 WillPopScope 사용
 Scaffold를 WillPopScope로 감싸는 방법을 사용하였다.

 

StatefulWidget 에는 잘되는데 StatelessWidget 위젯에서는 잘 안되었음

 

***** 백 키 막기 WillPopScope 코드 지원이 멈춘다고 합니다. 수정법 (tistory.com)

백 키 막기 WillPopScope 코드 지원이 멈춘다고 합니다. 수정법

 

class ClassName extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<ClassName> {
  String _msg = 'Welcome to WillPopScope World';

  @override
  initState() {
    super.initState();
  }
  @override
  Widget build(BuildContext context) {
    return WillPopScope(    // <-  WillPopScope로 감싼다.
      onWillPop: () {
        setState(() {
          _msg = "You can not get out of here! kkk";
        });
        return Future(() => false);
      },


      child: Scaffold(
        appBar: AppBar(
          title: Text('text'),
          automaticallyImplyLeading: false, // 뒤로가기 버튼 없애기
        ),
        body: Container(
          child: Text(''),
        ),
      ),


    );
  }
}