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/screens/ .
• 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<NewComponent> {
   . . .
   . . .

}

How to add new Stylesheet

Create a new file styles.dart, place it under /lib/screens/NewComponent/.

importnewly created StyleSheet into the Component.

import 'style.dart';
class NewComponent extends StatefulWidget {

    . . .
    . . .
}

How to navigate between screens

Create a file routes.dart , place it under /lib/.

importnewly created Screens into the Route Component.

import 'package:appname/screens/NewComponent/index.dart';
class Routes {
  var routes = <String, WidgetBuilder>{

    "/newComponent": (BuildContext context) => new NewComponent(),
  };

  Routes() {
    runApp(new MaterialApp(
     title: "Your app title",
      home: new NewComponent(),
      routes: routes,
    ));
  }
}