完成Layout布局

netrain_flutter_app/lib/common/Images.dart

@@ -20,4 +20,5 @@ class Images{
   static const ic_back_black = "${imagesPath}ic_back_black.png";
   static const ic_login_button = "${imagesPath}login_button.png";
   static const ic_doctor_avatar = "${imagesPath}ic_doctor_avatar.png";
+  static const lake = "${imagesPath}lake.png";
 }
\ No newline at end of file

netrain_flutter_app/lib/main.dart

@@ -16,6 +16,7 @@ import 'zhangfeng/LoginPage.dart';
 import 'zhangfeng/CustomTabPage.dart';
 import 'zhangfeng/TestPage.dart';
 import 'zhangfeng/TabBarPage.dart';
+import 'zhangfeng/LayoutDemo.dart';
 
 import 'jishuaishuai/firstVC.dart';
 
@@ -56,6 +57,7 @@ class MyApp extends StatelessWidget {
             "CustomTabPage":(context) => TabBarPage(),
             "LoginRequestPage":(context) => LoginRequestPage(),
             "PageView":(context) => SampleAppPage(),
+            "LayoutDemo":(context) => LayoutDemo(),
             "main": (context) => mainPage(),
             "firstVC":(context) => jssPageDemo(),
             "car_details":(context) =>CarDetailsPage(),
@@ -113,6 +115,7 @@ class _RouterNavigatorState extends State<RouterNavigator> {
           _item("登录网络请求", LoginRequestPage(), 'LoginRequestPage'),
           _item("CustomTabPage",TabBarPage(),'CustomTabPage'),
           _item("PageView",SampleAppPage(),'PageView'),
+          _item("LayoutDemo", LayoutDemo(), 'LayoutDemo'),
           _item("listview页面",List_Page(),'listPage'),
           _item("jssDemo", jssPageDemo(), 'firstVC'),
           _item("jssDemo", jssPageDemo(), 'student'),

netrain_flutter_app/lib/zhangfeng/LayoutDemo.dart

+import 'package:flutter/material.dart';
+import 'package:netrain_flutter_app/common/Images.dart';
+
+class LayoutDemo extends StatelessWidget {
+  LayoutDemo({Key key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    // TODO: implement build
+    return MaterialApp(
+      theme: new ThemeData(
+        primarySwatch: Colors.blue,
+      ),
+      home: Scaffold(
+        appBar: AppBar(
+          title: Text("Layout Demo"),
+        ),
+        body: new ListView(
+          children: [
+            new Image.asset(
+              Images.lake,
+              height: 240,
+              fit: BoxFit.cover,
+            ),
+            titleSection,
+            buttonSection(),
+            textSection,
+          ],
+        ),
+      ),
+    );
+  }
+
+  Widget titleSection = new Container(
+    padding: const EdgeInsets.all(32),
+    child: Row(
+      children: [
+        new Expanded(
+          child: new Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              new Container(
+                padding: const EdgeInsets.only(bottom: 8),
+                child: new Text(
+                  'Oeschine Lake Campground',
+                  style: new TextStyle(
+                    fontWeight: FontWeight.bold,
+                  ),
+                ),
+              ),
+              new Text(
+                'Kandersteg, Switzerland',
+                style: new TextStyle(
+                  color: Colors.grey[500],
+                ),
+              ),
+            ],
+          ),
+        ),
+        new Icon(
+          Icons.star,
+          color: Colors.red[500],
+        ),
+        new Text('41'),
+      ],
+    ),
+  );
+
+  Widget buttonSection(){
+    return new Container(
+      child: new Row(
+        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+        children: [
+          buildButtonColumn(Icons.call, 'CALL'),
+          buildButtonColumn(Icons.near_me, 'ROUTE'),
+          buildButtonColumn(Icons.share, 'SHARE'),
+        ],
+      ),
+    );
+  }
+
+  Column buildButtonColumn(IconData icon, String label) {
+    Color color = Colors.blue;
+    return new Column(
+      mainAxisSize: MainAxisSize.min,
+      mainAxisAlignment: MainAxisAlignment.center,
+      children: [
+        new Icon(icon, color: color),
+        new Container(
+          margin: const EdgeInsets.only(top: 8.0),
+          child: new Text(
+            label,
+            style: new TextStyle(
+              fontSize: 12.0,
+              fontWeight: FontWeight.w400,
+              color: color,
+            ),
+          ),
+        ),
+      ],
+    );
+  }
+
+  Widget textSection = new Container(
+    padding: const EdgeInsets.all(32),
+    child: new Text(
+      '''
+        Lake Oeschinen lies at the foot of the Blüemlisalp in the Bernese Alps. Situated 1,578 meters above sea level, it is one of the larger Alpine Lakes. A gondola ride from Kandersteg, followed by a half-hour walk through pastures and pine forest, leads you to the lake, which warms to 20 degrees Celsius in the summer. Activities enjoyed here include rowing, and riding the summer toboggan run.
+        ''',
+      softWrap: true,
+    ),
+  );
+}