Start Building Your App

This App guides you throughout building your app, providing the steps and procedure to customize.
Contents discussed in this section:
  • How to add new Component?
  • How to add new Stylesheet?
  • How to navigate between screens?
How to add new Component
  • Create a new folder, say NewComponent and place it under /lib/views/ .
  • Create a new file index.dart within this folder.
  • Name the class same as that of folder name.
class NewComponent extends StatefulWidget { @override NewComponentState createState() => new NewComponentState(); . . . . . .}class NewComponentState extends State { . . . . . .​}

How to navigate between screens

Create a new static variable for the new screen you want to route/navigate to in the /lib/constants/app_routes.dart
class AppRoutes {
static const newComponentViewRoute = "new_component_view_route";
Then go to /lib/utils/router.dart , and add the page class to route to
import 'package:appname/views/NewComponent/index.dart';​
import 'package:foodie/constants/app_routes.dart';
​Route generateRoute(RouteSettings settings) {
switch ( {
case AppRoutes.newComponentViewRoute :
return MaterialPageRoute(builder: (_) => NewComponent());