a

lib/list.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart';
+// import 'package:intl/intl.dart';
 
 class ListPage extends StatelessWidget {
   const ListPage({Key? key}) : super(key: key);
@@ -42,6 +43,7 @@ class ListPage extends StatelessWidget {
           automaticallyImplyLeading: false,
           toolbarHeight: 44,
           title: Text(
+            // date,
             '${date.hour}:${date.minute}',
             style: TextStyle(color: Colors.white, fontSize: 15),
           ),
@@ -140,6 +142,8 @@ class Data {
   Data({required this.type, required this.color, required this.image});
 }
 
+// DateTime now = DateTime.now();
+// String date = DateFormat('kk:mm').format(now);
 var date = DateTime.now();
 
 class AvailableMenu extends StatelessWidget {

lib/listblock.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+// import 'package:flutter_layout_grid/flutter_layout_grid.dart';
 
 class ListBlockPage extends StatelessWidget {
   const ListBlockPage({Key? key}) : super(key: key);
@@ -66,43 +67,47 @@ class ListBlockPage extends StatelessWidget {
           Container(
             decoration: BoxDecoration(color: Color(0xff078C84)),
           ),
-          SingleChildScrollView(
-            child: Container(
-              decoration: BoxDecoration(
-                  color: Colors.white,
-                  borderRadius: BorderRadius.only(
-                      topLeft: Radius.circular(16),
-                      topRight: Radius.circular(16)),
-                  border: Border.all(color: Color(0xff078C84))),
-              child: Column(
-                children: [
-                  TopMenu(),
-                  Column(
-                    children: List.generate(
-                        items.length,
-                        (i) => SizedBox(
-                              child: ListTile(
-                                leading: gambar(items[i]),
-                                title: Text(items[i].type),
-                              ),
-                            )),
+          Container(
+            decoration: BoxDecoration(
+                color: Colors.white,
+                borderRadius: BorderRadius.only(
+                    topLeft: Radius.circular(16),
+                    topRight: Radius.circular(16)),
+                border: Border.all(color: Color(0xff078C84))),
+            child: Column(
+              children: [
+                TopMenu(),
+                GridView.builder(
+                  shrinkWrap: true,
+                  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+                      crossAxisCount: 4, childAspectRatio: 16 / 9),
+                  itemBuilder: (context, index) => Column(
+                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+                    children: [
+                      gambar(items[index]),
+                      Text(items[index].type),
+                    ],
                   ),
-                  Divider(
-                    thickness: 8,
+                  itemCount: items.length,
+                ),
+                // Divider(
+                //   thickness: 8,
+                // ),
+                AvailableMenu(),
+                GridView.builder(
+                  shrinkWrap: true,
+                  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
+                      crossAxisCount: 4, childAspectRatio: 16 / 9),
+                  itemBuilder: (context, index) => Column(
+                    mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+                    children: [
+                      gambar(items[index]),
+                      Text(items[index].type),
+                    ],
                   ),
-                  AvailableMenu(),
-                  Column(
-                    children: List.generate(
-                        items.length,
-                        (i) => SizedBox(
-                              child: ListTile(
-                                leading: gambar(items[i]),
-                                title: Text(items[i].type),
-                              ),
-                            )),
-                  )
-                ],
-              ),
+                  itemCount: items.length,
+                ),
+              ],
             ),
           ),
         ]));
@@ -175,15 +180,26 @@ class TopMenu extends StatelessWidget {
             style: TextStyle(
                 fontWeight: FontWeight.bold, color: Color(0xff292D32)),
           ),
-          Expanded(child: Container()),
+          Expanded(
+            child: Column(
+              mainAxisAlignment: MainAxisAlignment.center,
+              children: [
+                Container(
+                  color: Color(0xff292D32).withOpacity(0.15),
+                  height: 1,
+                  width: 24,
+                ),
+              ],
+            ),
+          ),
           ElevatedButton(
               style: ElevatedButton.styleFrom(
                   backgroundColor: Color(0xff078C84).withOpacity(0.1)),
               onPressed: () {
-                print('Done');
+                print('Customize');
               },
               child: Text(
-                'Done',
+                'Customize',
                 style: TextStyle(
                     color: Color(0xff078C84), fontWeight: FontWeight.w300),
               ))

lib/main.dart

@@ -4,6 +4,7 @@ import 'package:namer_app/list.dart';
 import 'package:namer_app/login.dart';
 import 'package:namer_app/lang.dart';
 import 'package:namer_app/listblock.dart';
+import 'package:flutter/rendering.dart';
 
 void main() {
   runApp(MyApp());
@@ -19,6 +20,12 @@ final _router = GoRouter(
       GoRoute(
         path: 'list',
         builder: (context, state) => ListPage(),
+        // routes: [
+        //   GoRoute(
+        //     path: 'listblock',
+        //     builder: (context, state) => ListBlockPage(),
+        //   )
+        // ],
       ),
       GoRoute(
         path: 'listblock',
@@ -47,6 +54,7 @@ class MyApp extends StatelessWidget {
 class MyHomePage extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
+    debugPaintSizeEnabled = false;
     return Scaffold(
       body: Container(
         decoration: BoxDecoration(

pubspec.lock

@@ -62,6 +62,14 @@ packages:
     description: flutter
     source: sdk
     version: "0.0.0"
+  flutter_layout_grid:
+    dependency: "direct main"
+    description:
+      name: flutter_layout_grid
+      sha256: "86c1b21520612edfbb93f189b3ec05058470570f3a5c08ce10c92cc76a6e814e"
+      url: "https://pub.dev"
+    source: hosted
+    version: "1.0.6"
   flutter_lints:
     dependency: "direct dev"
     description:
@@ -160,6 +168,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "6.0.5"
+  quiver:
+    dependency: transitive
+    description:
+      name: quiver
+      sha256: b1c1ac5ce6688d77f65f3375a9abb9319b3cb32486bdc7a1e0fdf004d7ba4e47
+      url: "https://pub.dev"
+    source: hosted
+    version: "3.2.1"
   sky_engine:
     dependency: transitive
     description: flutter

pubspec.yaml

@@ -15,6 +15,8 @@ dependencies:
   english_words: ^4.0.0
   provider: ^6.0.0
   go_router: ^6.0.2
+  flutter_layout_grid: ^1.0.3
+  # intl: ^0.15.7
 
 dev_dependencies:
   flutter_test: