【Flutter】画面遷移/ページ遷移:Navigator使い方を3分で解説!（サンプルコードあり）

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: ScreenMoveDemo(),
    );
  }
}

class ScreenMoveDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('【画面遷移デモ】1ページ')),
      body: Center(
        child: ElevatedButton(
          child: Text('次ページ'),
          onPressed: () {
            Navigator.push(
                context, MaterialPageRoute(builder: (context) => NextPage()));
          },
        ),
      ),
    );
  }
}

class NextPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('【画面遷移デモ】2ページ'),
        backgroundColor: Colors.red,
      ),
      body: Center(
        child: ElevatedButton(
          child: Text("戻る"),
          onPressed: () {
            Navigator.pop(context);
          },
        ),
      ),
    );
  }
}

       

Navigator.push(
   context, MaterialPageRoute(builder: (context) => NextPage()));

Navigator.pop(context);