ColorPage

colorPage.dart

import 'package:flutter/material.dart';

class ExColorPage extends StatelessWidget {
  const ExColorPage({super.key});


  @override
  Widget build(BuildContext context) {

    return Scaffold(
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          ElevatedButton(onPressed: (){
            // name을 구성하는 곳은 MatrialApp()
            Navigator.pushNamed(context, '/red');
          }, child: Text("red page")),
          ElevatedButton(onPressed: (){
            Navigator.pushNamed(context, '/green');
          }, child: Text("blue page")),
          ElevatedButton(onPressed: (){
            Navigator.pushNamed(context, '/blue');
          }, child: Text("green page")),
        ],
      ),
    );
  }
}

red_page.dart

import 'package:flutter/material.dart';

class ExRedPage extends StatelessWidget {
  const ExRedPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        width: double.infinity,
        height: double.infinity,

        color: Colors.red,
      ),
    );
  }
}

green, blue도 비슷함

config 폴더
route_names.dart

import 'package:flutter_pagemove/screen/blue_page.dart';
import 'package:flutter_pagemove/screen/green_page.dart';
import 'package:flutter_pagemove/screen/red_page.dart';

class RouteNames {

  static String redPage = '/red';
  static const bluePage = '/blue';
  static const greenPage = '/green';

}

var nameMap = {
  RouteNames.redPage : (_) => ExRedPage(),
  RouteNames.bluePage : (_) => ExBluePage(),
  RouteNames.greenPage : (_) => ExGreenPage(),
};

main.dart

import 'package:flutter/material.dart';
import 'package:flutter_pagemove/colorPage.dart';
import 'package:flutter_pagemove/screen/blue_page.dart';
import 'package:flutter_pagemove/screen/green_page.dart';
import 'package:flutter_pagemove/screen/red_page.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // 라우트 지정
      routes: {
        // map 사용시 {}
        // key 값은 String
        // value 값은 function
        '/red' : (context) {return ExRedPage();},
        '/blue' : (context) {return ExBluePage();},
        '/green' : (context) {return ExGreenPage();},
      },
      
      home: ExColorPage(),
    );
  }
}