界面整合v1

lib/guess/guess_page.dart

@@ -6,9 +6,7 @@ import 'guess_app_bar.dart';
 import 'result_notice.dart';
 
 class GuessPage extends StatefulWidget {
-  const GuessPage({super.key, required this.title});
+  const GuessPage({super.key});
-
-  final String title;
 
   @override
   State<GuessPage> createState() => _GuessPageState();

lib/main.dart

@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 import 'counter/counter_page.dart';
 import 'guess/guess_page.dart';
 import 'muyu/muyu_page.dart';
+import 'navigation/app_navigation.dart';
 import 'paper/paper.dart';
 
 void main() {
@@ -20,7 +21,7 @@ class MyApp extends StatelessWidget {
       theme: ThemeData(
         primarySwatch: Colors.blue,
       ),
-      home: const Paper(),
+      home: const AppNavigation(),
     );
   }
 }

lib/muyu/muyu_app_bar.dart

@@ -13,6 +13,7 @@ class MuyuAppBar extends StatelessWidget implements PreferredSizeWidget {
   Widget build(BuildContext context) {
     return AppBar(
       elevation: 0,
+      centerTitle: true,
       systemOverlayStyle: const SystemUiOverlayStyle(
           statusBarIconBrightness: Brightness.dark,
           statusBarColor: Colors.transparent),

lib/navigation/app_bottom_bar.dart

@@ -0,0 +1,52 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+class MenuData {
+  // 标签
+  final String label;
+
+  // 图标数据
+  final IconData icon;
+
+  const MenuData({
+    required this.label,
+    required this.icon,
+  });
+}
+
+class AppBottomBar extends StatelessWidget {
+  final int currentIndex;
+  final List<MenuData> menus;
+  final ValueChanged<int>? onItemTap;
+
+  const AppBottomBar({
+    Key? key,
+    this.onItemTap,
+    this.currentIndex = 0,
+    required this.menus,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return BottomNavigationBar(
+      backgroundColor: Colors.white,
+      onTap: onItemTap,
+      currentIndex: currentIndex,
+      elevation: 3,
+      type: BottomNavigationBarType.fixed,
+      iconSize: 22,
+      selectedItemColor: Theme.of(context).primaryColor,
+      selectedLabelStyle: const TextStyle(fontWeight: FontWeight.bold),
+      showUnselectedLabels: true,
+      showSelectedLabels: true,
+      items: menus.map(_buildItemByMenuMeta).toList(),
+    );
+  }
+
+  BottomNavigationBarItem _buildItemByMenuMeta(MenuData menu) {
+    return BottomNavigationBarItem(
+      label: menu.label,
+      icon: Icon(menu.icon),
+    );
+  }
+}

lib/navigation/app_navigation.dart

@@ -0,0 +1,59 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_first_station/guess/guess_page.dart';
+import 'package:flutter_first_station/muyu/muyu_page.dart';
+import 'package:flutter_first_station/paper/paper.dart';
+
+import 'app_bottom_bar.dart';
+
+class AppNavigation extends StatefulWidget {
+  const AppNavigation({Key? key}) : super(key: key);
+
+  @override
+  State<AppNavigation> createState() => _AppNavigationState();
+}
+
+class _AppNavigationState extends State<AppNavigation> {
+  int _index = 0;
+
+  final List<MenuData> menus = const [
+    MenuData(label: '猜数字', icon: Icons.question_mark),
+    MenuData(label: '电子木鱼', icon: Icons.my_library_music_outlined),
+    MenuData(label: '白板绘制', icon: Icons.palette_outlined),
+  ];
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      children: [
+        Expanded(
+          child: _buildContent(_index),
+        ),
+        AppBottomBar(
+          currentIndex: _index,
+          onItemTap: _onChangePage,
+          menus: menus,
+        )
+      ],
+    );
+  }
+
+  void _onChangePage(int index) {
+    setState(() {
+      _index = index;
+    });
+  }
+
+  Widget _buildContent(int index) {
+    switch(index){
+      case 0:
+       return const GuessPage();
+      case 1:
+        return const MuyuPage();
+      case 2:
+        return const Paper();
+      default:
+        return const SizedBox.shrink();
+    }
+  }
+}
+

lib/paper/paper.dart

@@ -181,7 +181,7 @@ class PaperPainter extends CustomPainter {
   void drawLine(Canvas canvas, Line line) {
     _paint.color = line.color;
     _paint.strokeWidth = line.strokeWidth;
-    canvas.drawPoints(PointMode.points, line.points, _paint);
+    canvas.drawPoints(PointMode.polygon, line.points, _paint);
   }
 
   @override