简体   繁体   中英

How to move page to another in Flutter

(First of all, sorry for bad English. I'm using translator)
Hello, I'm newbie in Flutter.
I am trying to move the page.(main to NewMemory), But it didn't work.
I'm using navigate & Route.
when I click image(or icon), there's nothing change. I really want to move to another page.

Here's my code. Could you give me some advice?

import 'package:flutter/material.dart';
import 'newmemory.dart';

var count = 0;
var height = 0.0;
var width = 0.0;
var devicePixelRatio = 0.0;

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: '행복저금통',
      theme: new ThemeData(scaffoldBackgroundColor: const Color(0xff3d56a9)),
      home: Scaffold(
        // appBar: AppBar(
        //   title: Text('main'),
        // ),
        body: Center(
          child: Stack(
            alignment: Alignment.center,
            children: <Widget>[
              Positioned(
                //공유버튼
                child: IconButton(
                  icon: Icon(Icons.share_outlined),
                  color: Colors.black,
                  iconSize: 50,
                  onPressed: () {},
                ),
                top: 30,
                left: 5,
              ),
              Positioned(
                //카운트
                child: Text("$count", //이후 함수로 변경
                    style: TextStyle(fontSize: 50, color: Colors.white)),
                top: 50,
              ),
              Positioned(
                //유리병
                child: InkWell(
                    onTap: () {
                      Navigator.push(
                          context,
                          MaterialPageRoute<void>(
                              builder: (context) => NewMemory())); //!!!here!!!
                    },
                    child: Container(
                        height: 350,
                        width: 350,
                        child: Image.asset('images/glass.png'))),
                top: 150,
              ),
              Positioned(
                //종이학
                child: InkWell(
                    onTap: () {
                      Navigator.push(
                          context,
                          MaterialPageRoute<void>(
                              builder: (context) => NewMemory()));
                    },
                    child: Container(
                        height: 300,
                        width: 300,
                        child: Image.asset('images/paper3.png'))),
                bottom: -150,
              ),
              Positioned(
                //우측 아이콘
                child: Column(
                  children: [
                    IconButton(
                        icon: Icon(Icons.settings),
                        color: Colors.black,
                        iconSize: 50,
                        onPressed: () {} //설정
                        ),
                    IconButton(
                        icon: Icon(Icons.add_circle_outline),
                        color: const Color(0xffb9dcb3),
                        iconSize: 50,
                        onPressed: () {} //유리병 추가
                        ),
                    IconButton(
                        icon: Icon(Icons.do_not_disturb),
                        color: Colors.redAccent,
                        iconSize: 50,
                        onPressed: () {} //유리병 삭제
                        ),
                  ],
                ),
                top: 30,
                right: 5,
              )
            ],
          ),
        ),
      ),
    );
  }
}

import 'package:flutter/material.dart';

class NewMemory extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
          child: Container(
              height: 300,
              width: 300,
              child: Image.asset('images/paper3.png'))),
    );
  }
}

Avoid putting your first screen widget in the same stateful/stateless widget as the the MaterialApp widget.

import 'package:flutter/material.dart';
import 'newmemory.dart';

var count = 0;
var height = 0.0;
var width = 0.0;
var devicePixelRatio = 0.0;

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: '행복저금통',
      theme: new ThemeData(scaffoldBackgroundColor: const Color(0xff3d56a9)),
      home: FirstPage(),
    );
  }
}

Make another Widget in the same file

class FirstPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        // appBar: AppBar(
        //   title: Text('main'),
        // ),
        body: Center(
          child: Stack(
            alignment: Alignment.center,
            children: <Widget>[
              Positioned(
                //공유버튼
                child: IconButton(
                  icon: Icon(Icons.share_outlined),
                  color: Colors.black,
                  iconSize: 50,
                  onPressed: () {},
                ),
                top: 30,
                left: 5,
              ),
              Positioned(
                //카운트
                child: Text("$count", //이후 함수로 변경
                    style: TextStyle(fontSize: 50, color: Colors.white)),
                top: 50,
              ),
              Positioned(
                //유리병
                child: InkWell(
                    onTap: () {
                      Navigator.push(
                          context,
                          MaterialPageRoute(
                              builder: (context) => NewMemory())); //!!!here!!!
                    },
                    child: Container(
                        height: 350,
                        width: 350,
                        child: Image.asset('images/glass.png'))),
                top: 150,
              ),
              Positioned(
                //종이학
                child: InkWell(
                    onTap: () {
                      Navigator.push(
                          context,
                          MaterialPageRoute(
                              builder: (context) => NewMemory()));
                    },
                    child: Container(
                        height: 300,
                        width: 300,
                        child: Image.asset('images/paper3.png'))),
                bottom: -150,
              ),
              Positioned(
                //우측 아이콘
                child: Column(
                  children: [
                    IconButton(
                        icon: Icon(Icons.settings),
                        color: Colors.black,
                        iconSize: 50,
                        onPressed: () {} //설정
                        ),
                    IconButton(
                        icon: Icon(Icons.add_circle_outline),
                        color: const Color(0xffb9dcb3),
                        iconSize: 50,
                        onPressed: () {} //유리병 추가
                        ),
                    IconButton(
                        icon: Icon(Icons.do_not_disturb),
                        color: Colors.redAccent,
                        iconSize: 50,
                        onPressed: () {} //유리병 삭제
                        ),
                  ],
                ),
                top: 30,
                right: 5,
              )
            ],
          ),
        ),
      );
  }
}

As per the documentation the navigation syntax is:

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

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM