Flutter – How to create a screen?

Screen header

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
class MyFlutterApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
// TODO: implement build
return MaterialApp(
debugShowCheckedModeBanner: false,
title: "My app",
home: Scaffold(
appBar: AppBar(title: Text("Home"),), // APP BAR
body: HomeScreen() // SCREEN BODY
)
);
}
}
class MyFlutterApp extends StatelessWidget { @override Widget build(BuildContext context) { // TODO: implement build return MaterialApp( debugShowCheckedModeBanner: false, title: "My app", home: Scaffold( appBar: AppBar(title: Text("Home"),), // APP BAR body: HomeScreen() // SCREEN BODY ) ); } }
class MyFlutterApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
      return MaterialApp(
          debugShowCheckedModeBanner: false,
          title: "My app",
          home: Scaffold(
              appBar: AppBar(title: Text("Home"),),    // APP BAR
              body: HomeScreen()                       // SCREEN BODY
          )
      );
  }
}

Screen body

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
class HomeScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Material(
color: Colors.lightBlueAccent, // BACKGROUND COLOR
child: Center(
child: new ImageAsset() // CHILD ELEMENT
)
);
}
}
class HomeScreen extends StatelessWidget { @override Widget build(BuildContext context) { return Material( color: Colors.lightBlueAccent, // BACKGROUND COLOR child: Center( child: new ImageAsset() // CHILD ELEMENT ) ); } }
class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
      return Material(
          color: Colors.lightBlueAccent,     // BACKGROUND COLOR
          child: Center(
              child: new ImageAsset()        // CHILD ELEMENT
          )
      );
  }
}

Image element

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
class ImageAsset extends StatelessWidget {
@override
Widget build(BuildContext context) {
Image image = Image(image: AssetImage('images/1208/1/1.jpg')); // RESOURCE FILE
return Container(child: image);
}
}
class ImageAsset extends StatelessWidget { @override Widget build(BuildContext context) { Image image = Image(image: AssetImage('images/1208/1/1.jpg')); // RESOURCE FILE return Container(child: image); } }
class ImageAsset extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    Image image = Image(image: AssetImage('images/1208/1/1.jpg'));   // RESOURCE FILE
    return Container(child: image);
  }
}

Be the first to comment

Leave a Reply

Your email address will not be published.


*