modify the main page.

lib/const/images_const.dart

@@ -23,15 +23,15 @@ class ImagePath {
 class MainImagePath {
   static const String image_path = "images/main";
   static const String image_app = "$image_path/ic_launcher.png";
-  static const String image_header= "$image_path/main_background.png";
-  static const String image_sign_up = "$image_path/main_background.png";
-  static const String image_walk_through = "$image_path/main_background.png";
-  static const String image_navigation = "$image_path/main_background.png";
-  static const String image_profile = "$image_path/main_background.png";
-  static const String image_feed = "$image_path/main_background.png";
-  static const String image_chat = "$image_path/main_background.png";
-  static const String image_shopping = "$image_path/main_background.png";
-  static const String image_statistic = "$image_path/main_background.png";
-  static const String image_media = "$image_path/main_background.png";
-  static const String image_camera = "$image_path/main_background.png";
+  static const String image_header = "$image_path/pic04.png";
+  static const String image_sign_up = "$image_path/pic03.png";
+  static const String image_walk_through = "$image_path/pic01.png";
+  static const String image_navigation = "$image_path/pic05.png";
+  static const String image_profile = "$image_path/pic06.png";
+  static const String image_feed = "$image_path/pic02.png";
+  static const String image_chat = "$image_path/pic08.png";
+  static const String image_shopping = "$image_path/pic09.png";
+  static const String image_statistic = "$image_path/pic10.png";
+  static const String image_media = "$image_path/pic11.png";
+  static const String image_camera = "$image_path/pic01.png";
 }

lib/main.dart

@@ -4,17 +4,19 @@ import 'const/string_const.dart';
 import 'const/color_const.dart';
 import 'const/page_str_const.dart';
 import "page/page_const.dart";
+import 'package:flutter/services.dart';
 
 void main() => runApp(MyApp());
 
 class MyApp extends StatelessWidget {
   // This widget is the root of your application.
   @override
   Widget build(BuildContext context) {
+    SystemChrome.setEnabledSystemUIOverlays([]);
     return MaterialApp(
       title: StringConst.APP_NAME,
       debugShowCheckedModeBanner: false,
-      theme: ThemeData(primaryColor: MAIN_COLOR, accentColor: MAIN_COLOR),
+      theme: ThemeData(primaryColor: BLUE, accentColor: TEXT_BLACK_LIGHT),
       home: HomePage(),
       routes: {
         SIGN_UP_PAGES[0]: (context) => SignPageOne(),

lib/page/home_page.dart

@@ -12,13 +12,15 @@ import 'package:flutter_ui_nice/const/size_const.dart';
 import 'package:flutter_ui_nice/const/images_const.dart';
 import 'package:flutter_ui_nice/const/color_const.dart';
 import 'package:flutter_ui_nice/util/SizeUtil.dart';
+import 'package:flutter_ui_nice/util/GradientUtil.dart';
 
 class HomePage extends StatelessWidget {
   final _scaffoldState = GlobalKey<ScaffoldState>();
 
   Widget _topBar() => SliverAppBar(
         elevation: 1.0,
         pinned: true,
+        backgroundColor: BLUE,
         expandedHeight: 150.0,
         flexibleSpace: FlexibleSpaceBar(
           title: Padding(
@@ -33,10 +35,10 @@ class HomePage extends StatelessWidget {
                 SizedBox(
                   width: 6.0,
                 ),
-                Text(
-                  StringConst.APP_NAME,
-                  style: TextStyle(color: Colors.white),
-                )
+                Text(StringConst.APP_NAME,
+                    style: TextStyle(
+                      color: TEXT_BLACK_LIGHT,
+                    ))
               ],
             ),
           ),
@@ -56,12 +58,8 @@ class HomePage extends StatelessWidget {
     return InkWell(
       child: Container(
         padding: EdgeInsets.symmetric(horizontal: 20.0),
-        decoration: BoxDecoration(boxShadow: [
-          BoxShadow(
-            color: Colors.grey[800],
-            offset: Offset(0.0, 2.0),
-          )
-        ]),
+        margin: EdgeInsets.only(bottom: 1.0),
+        decoration: BoxDecoration(gradient: GradientUtil.greenPurple()),
         constraints: BoxConstraints.expand(height: 60.0),
         child: Column(
             crossAxisAlignment: CrossAxisAlignment.start,
@@ -70,7 +68,7 @@ class HomePage extends StatelessWidget {
               Text(
                 item,
                 style: TextStyle(
-                    color: Colors.white,
+                    color: TEXT_BLACK_LIGHT,
                     fontSize: TEXT_NORMAL_SIZE,
                     fontWeight: FontWeight.w700),
               ),
@@ -83,7 +81,7 @@ class HomePage extends StatelessWidget {
             ),
       ),
       onTap: () {
-        Navigator.pop(context);
+//        Navigator.pop(context);
         Navigator.pushNamed(context, "$item");
       },
     );
@@ -103,10 +101,7 @@ class HomePage extends StatelessWidget {
       child: Container(
         padding: EdgeInsets.symmetric(horizontal: 20.0, vertical: 4.0),
         decoration: BoxDecoration(
-          gradient: LinearGradient(colors: [
-            PURPLE,
-            Colors.grey[900],
-          ]),
+          gradient: GradientUtil.yellowGreen(),
         ),
         constraints: BoxConstraints.expand(height: 80.0),
         child: Center(
@@ -121,8 +116,8 @@ class HomePage extends StatelessWidget {
               ),
               Text(
                 StringConst.CREATE_BY,
-                style:
-                    TextStyle(color: Colors.white, fontSize: TEXT_NORMAL_SIZE),
+                style: TextStyle(
+                    color: TEXT_BLACK_LIGHT, fontSize: TEXT_NORMAL_SIZE),
               ),
             ],
           ),
@@ -135,18 +130,22 @@ class HomePage extends StatelessWidget {
     showModalBottomSheet(
       context: context,
       builder: (context) => Material(
-            color: Colors.white,
+            color: GREEN,
             clipBehavior: Clip.antiAliasWithSaveLayer,
             shape: RoundedRectangleBorder(
-                borderRadius: BorderRadius.only(
-                    topLeft: Radius.circular(20.0),
-                    topRight: Radius.circular(20.0))),
+              borderRadius: BorderRadius.only(
+                topLeft: Radius.circular(20.0),
+                topRight: Radius.circular(20.0),
+              ),
+            ),
             child: Column(
               mainAxisAlignment: MainAxisAlignment.spaceAround,
               children: <Widget>[
                 _header(),
                 Expanded(
-                  child: _menuList(menu),
+                  child: Container(
+                    child: _menuList(menu),
+                  ),
                 ),
                 AboutMeTitle(),
               ],
@@ -155,7 +154,41 @@ class HomePage extends StatelessWidget {
     );
   }
 
-  Widget _gridItem(context, Menu menu) => InkWell(
+  LinearGradient _itemGradient(index) {
+    var gradient = GradientUtil.red(
+        begin: AlignmentDirectional.topStart,
+        end: AlignmentDirectional.bottomEnd,
+        opacity: 0.7);
+    switch (index % 4) {
+      case 0:
+        gradient = GradientUtil.red(
+            begin: AlignmentDirectional.topStart,
+            end: AlignmentDirectional.bottomEnd,
+            opacity: 0.7);
+        break;
+      case 1:
+        gradient = GradientUtil.greenPurple(
+            begin: AlignmentDirectional.topStart,
+            end: AlignmentDirectional.bottomEnd,
+            opacity: 0.7);
+        break;
+      case 2:
+        gradient = GradientUtil.greenRed(
+            begin: AlignmentDirectional.topStart,
+            end: AlignmentDirectional.bottomEnd,
+            opacity: 0.7);
+        break;
+      case 3:
+        gradient = GradientUtil.yellowBlue(
+            begin: AlignmentDirectional.topStart,
+            end: AlignmentDirectional.bottomEnd,
+            opacity: 0.7);
+        break;
+    }
+    return gradient;
+  }
+
+  Widget _gridItem(context, Menu menu, index) => InkWell(
         onTap: () {
           _clickMenu(context, menu);
         },
@@ -168,11 +201,7 @@ class HomePage extends StatelessWidget {
             ),
             Container(
               constraints: BoxConstraints.expand(),
-              decoration: BoxDecoration(
-                gradient: RadialGradient(
-                    colors: [PURPLE, Colors.grey[850].withOpacity(0.9)],
-                    radius: 0.3),
-              ),
+              decoration: BoxDecoration(gradient: _itemGradient(index)),
             ),
             Container(
               constraints: BoxConstraints.expand(),
@@ -183,15 +212,18 @@ class HomePage extends StatelessWidget {
                   children: <Widget>[
                     Icon(
                       menu.icon,
-                      color: Colors.white,
+                      color: TEXT_BLACK_LIGHT,
+                      size: 40.0,
                     ),
                     SizedBox(
                       height: 4.0,
                     ),
                     Text(
                       menu.title,
                       style: TextStyle(
-                          color: Colors.white, fontWeight: FontWeight.w700),
+                          color: TEXT_BLACK_LIGHT,
+                          fontWeight: FontWeight.w700,
+                          fontSize: 16.0),
                     )
                   ],
                 ),
@@ -205,11 +237,11 @@ class HomePage extends StatelessWidget {
         gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
             mainAxisSpacing: 4.0,
             crossAxisSpacing: 4.0,
-            childAspectRatio: 1.0,
+            childAspectRatio: 0.8,
             crossAxisCount: 2),
         delegate: SliverChildBuilderDelegate((context, index) {
           var menu = list[index];
-          return _gridItem(context, menu);
+          return _gridItem(context, menu, index);
         }, childCount: list.length),
       );
 
@@ -242,8 +274,6 @@ class HomePage extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     SizeUtil.size = MediaQuery.of(context).size;
-    var size = MediaQuery.of(context).size;
-    print("width :${size.width},height:${size.height}");
     return _showAndroid(context);
   }
 }

lib/util/GradientUtil.dart

@@ -7,14 +7,57 @@ import "package:flutter/material.dart";
 import 'package:flutter_ui_nice/const/color_const.dart';
 
 class GradientUtil {
-  static LinearGradient _getLinearGradient(left, right) =>
-      LinearGradient(colors: [left, right]);
+  static LinearGradient _getLinearGradient(Color left, Color right,
+          {begin = AlignmentDirectional.centerStart,
+          end = AlignmentDirectional.centerEnd,
+          opacity = 1.0}) =>
+      LinearGradient(
+        colors: [
+          left.withOpacity(opacity),
+          right.withOpacity(opacity),
+        ],
+        begin: begin,
+        end: end,
+      );
 
-  static LinearGradient yellowGreen() => _getLinearGradient(YELLOW, GREEN);
+  static LinearGradient yellowGreen(
+          {begin = AlignmentDirectional.centerStart,
+          end = AlignmentDirectional.centerEnd,
+          opacity = 1.0}) =>
+      _getLinearGradient(YELLOW, GREEN,
+          begin: begin, end: end, opacity: opacity);
 
-  static LinearGradient red() => _getLinearGradient(RED_LIGHT, RED);
+  static LinearGradient red(
+          {begin = AlignmentDirectional.centerStart,
+          end = AlignmentDirectional.centerEnd,
+          opacity = 1.0}) =>
+      _getLinearGradient(RED_LIGHT, RED,
+          begin: begin, end: end, opacity: opacity);
 
-  static LinearGradient yellowBlue() => _getLinearGradient(YELLOW, BLUE);
+  static LinearGradient yellowBlue(
+          {begin = AlignmentDirectional.centerStart,
+          end = AlignmentDirectional.centerEnd,
+          opacity = 1.0}) =>
+      _getLinearGradient(YELLOW, BLUE,
+          begin: begin, end: end, opacity: opacity);
 
-  static LinearGradient blue() => _getLinearGradient(BLUE_LIGHT, BLUE_DEEP);
+  static LinearGradient blue(
+          {begin = AlignmentDirectional.centerStart,
+          end = AlignmentDirectional.centerEnd,
+          opacity = 1.0}) =>
+      _getLinearGradient(BLUE_LIGHT, BLUE_DEEP,
+          begin: begin, end: end, opacity: opacity);
+
+  static LinearGradient greenRed(
+          {begin = AlignmentDirectional.centerStart,
+          end = AlignmentDirectional.centerEnd,
+          opacity = 1.0}) =>
+      _getLinearGradient(GREEN, RED, begin: begin, end: end, opacity: opacity);
+
+  static LinearGradient greenPurple(
+          {begin = AlignmentDirectional.centerStart,
+          end = AlignmentDirectional.centerEnd,
+          opacity = 1.0}) =>
+      _getLinearGradient(GREEN, PURPLE,
+          begin: begin, end: end, opacity: opacity);
 }

lib/view/AboutMeTitle.dart

@@ -6,23 +6,25 @@
 import "package:flutter/material.dart";
 import 'package:flutter_ui_nice/const/string_const.dart';
 import 'package:flutter_ui_nice/const/color_const.dart';
+import 'package:flutter_ui_nice/const/images_const.dart';
 
 class AboutMeTitle extends AboutListTile {
   AboutMeTitle()
       : super(
-            icon: FlutterLogo(
-              colors: Colors.deepPurple,
-              textColor: Colors.grey[900],
+            icon: Image.asset(
+              MainImagePath.image_app,
+              width: 40.0,
+              height: 40.0,
             ),
             applicationName: StringConst.APP_NAME,
-            applicationVersion: "1.0.1",
-            applicationLegalese: "Apache License 2.0",
+            applicationVersion: "1.0",
+            applicationLegalese: "MIT License 2.0",
             aboutBoxChildren: [
               Padding(
                 padding: EdgeInsets.symmetric(horizontal: 24.0, vertical: 4.0),
                 child: Text(
                   StringConst.CREATE_BY,
-                  style: TextStyle(color: BLUE),
+                  style: TextStyle(color: TEXT_BLACK_LIGHT),
                 ),
               )
             ]);