CODEWITHSUNDEEP
flutterflutter-layout
RicardoPons
RicardoPons

Reputation: 1353

Navigate between pages using Navigator issue

I am studying Flutter and building my first app using this framework.

Now I am facing a problem.

My scenario is very simple I want to navigate from the main screen to another screen.

this is the code of the from the home view

class HomeView extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return HomeViewState();
  }
}

class HomeViewState extends State<HomeView> {
...

and I want to navigate to to another screen using Navigator

@override
  Widget build(BuildContext context) {
    return Container(
        child: InkWell(
            onTap: () {
              Navigator.of(context).pushNamed('/userdetailsview');
            },
            child: Card(
...

this is my App.Dart

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.light(),
      home: Scaffold(
        body: Center(
          child: HomeView(),
        ),
      ),
      routes: <String,WidgetBuilder>{
        '/homeview': (BuildContext context) => new HomeView(),
        '/userdetailsview': (BuildContext context) => new UserDetails(),
      },
    );
  }
}

finally this is the code for the page I want to navigate 

class UserDetails extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Text('test');
  }

}

As you can see my scenario is very simple but this is the result .

enter image description here

As you can see for some reason the second page is overlapping the main page.

I am developer using Xamarin Forms and XAML applications Flutter is very easy to understand and I really like it but there is a lack of information about simple task like this one.

I would appreciate if someone could help to fix my issue

Thank you!.

Upvotes: 1

Views: 82

Answers (1)

Logemann
Logemann

Reputation: 2973

Try this in UserDetails.dart

class UserDetails extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
             body: Text('test');
    )
  }
}

Upvotes: 1

Related Questions