refactor tabbar: Homepage adaptation

1. remove redundant MaterialApp in GetMaterialApp
2. unified background color

Signed-off-by: 21pages <pages21@163.com>

flutter/lib/desktop/pages/connection_page.dart

@@ -57,7 +57,6 @@ class _ConnectionPageState extends State<ConnectionPage> {
   @override
   Widget build(BuildContext context) {
     return Container(
-      decoration: BoxDecoration(color: isDarkTheme() ? null : MyTheme.grayBg),
       child: Column(
           mainAxisAlignment: MainAxisAlignment.start,
           mainAxisSize: MainAxisSize.max,

flutter/lib/desktop/pages/connection_tab_page.dart

@@ -84,11 +84,14 @@ class _ConnectionTabPageState extends State<ConnectionTabPage>
         children: [
           Obx(() => DesktopTabBar(
                 controller: tabController,
-                tabs: connectionIds.toList(),
+                tabs: connectionIds
+                    .map((e) =>
+                        TabInfo(label: e, icon: Icons.desktop_windows_sharp))
+                    .toList(),
                 onTabClose: onRemoveId,
-                tabIcon: Icons.desktop_windows_sharp,
                 selected: _selected,
                 dark: isDarkTheme(),
+                mainTab: false,
               )),
           Expanded(
               child: Obx(() => TabBarView(

flutter/lib/desktop/pages/desktop_home_page.dart

@@ -6,7 +6,6 @@ import 'package:flutter/material.dart' hide MenuItem;
 import 'package:flutter/services.dart';
 import 'package:flutter_hbb/common.dart';
 import 'package:flutter_hbb/desktop/pages/connection_page.dart';
-import 'package:flutter_hbb/desktop/widgets/titlebar_widget.dart';
 import 'package:flutter_hbb/models/platform_model.dart';
 import 'package:flutter_hbb/models/server_model.dart';
 import 'package:flutter_hbb/utils/multi_window_manager.dart';
@@ -46,38 +45,17 @@ class _DesktopHomePageState extends State<DesktopHomePage>
 
   @override
   Widget build(BuildContext context) {
-    return Scaffold(
-      body: Column(
-        children: [
-          DesktopTitleBar(
-            child: Center(
-              child: Text(
-                "RustDesk",
-                style: TextStyle(
-                    color: Colors.white,
-                    fontSize: 20,
-                    fontWeight: FontWeight.bold),
-              ),
-            ),
-          ),
-          Expanded(
-            child: Container(
-              child: Row(
-                children: [
-                  Flexible(
-                    child: buildServerInfo(context),
-                    flex: 1,
-                  ),
-                  Flexible(
-                    child: buildServerBoard(context),
-                    flex: 4,
-                  ),
-                ],
-              ),
-            ),
-          ),
-        ],
-      ),
+    return Row(
+      children: [
+        Flexible(
+          child: buildServerInfo(context),
+          flex: 1,
+        ),
+        Flexible(
+          child: buildServerBoard(context),
+          flex: 4,
+        ),
+      ],
     );
   }
 

flutter/lib/desktop/pages/desktop_setting_page.dart

@@ -0,0 +1,15 @@
+import 'package:flutter/cupertino.dart';
+
+class DesktopSettingPage extends StatefulWidget {
+  DesktopSettingPage({Key? key}) : super(key: key);
+
+  @override
+  State<DesktopSettingPage> createState() => _DesktopSettingPageState();
+}
+
+class _DesktopSettingPageState extends State<DesktopSettingPage> {
+  @override
+  Widget build(BuildContext context) {
+    return Text("Settings");
+  }
+}

flutter/lib/desktop/pages/desktop_tab_page.dart

@@ -0,0 +1,88 @@
+import 'dart:math';
+
+import 'package:flutter/material.dart';
+import 'package:flutter_hbb/common.dart';
+import 'package:flutter_hbb/consts.dart';
+import 'package:flutter_hbb/desktop/pages/desktop_home_page.dart';
+import 'package:flutter_hbb/desktop/pages/desktop_setting_page.dart';
+import 'package:flutter_hbb/desktop/widgets/tabbar_widget.dart';
+import 'package:get/get.dart';
+
+class DesktopTabPage extends StatefulWidget {
+  const DesktopTabPage({Key? key}) : super(key: key);
+
+  @override
+  State<DesktopTabPage> createState() => _DesktopTabPageState();
+}
+
+class _DesktopTabPageState extends State<DesktopTabPage>
+    with TickerProviderStateMixin {
+  late Rx<TabController> tabController;
+  late RxList<TabInfo> tabs;
+  static final Rx<int> _selected = 0.obs;
+
+  @override
+  void initState() {
+    super.initState();
+    tabs = RxList.from([
+      TabInfo(label: kTabLabelHomePage, icon: Icons.home_sharp, closable: false)
+    ], growable: true);
+    tabController =
+        TabController(length: tabs.length, vsync: this, initialIndex: 0).obs;
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      body: Column(
+        children: [
+          Obx((() => DesktopTabBar(
+                controller: tabController,
+                tabs: tabs.toList(),
+                onTabClose: onTabClose,
+                selected: _selected,
+                dark: isDarkTheme(),
+                mainTab: true,
+                onMenu: onTabbarMenu,
+              ))),
+          Obx((() => Expanded(
+                child: TabBarView(
+                    controller: tabController.value,
+                    children: tabs.map((tab) {
+                      switch (tab.label) {
+                        case kTabLabelHomePage:
+                          return DesktopHomePage(key: ValueKey(tab.label));
+                        case kTabLabelSettingPage:
+                          return DesktopSettingPage(key: ValueKey(tab.label));
+                        default:
+                          return Container();
+                      }
+                    }).toList()),
+              ))),
+        ],
+      ),
+    );
+  }
+
+  void onTabClose(String label) {
+    tabs.removeWhere((tab) => tab.label == label);
+    tabController.value = TabController(
+        length: tabs.length,
+        vsync: this,
+        initialIndex: max(0, tabs.length - 1));
+  }
+
+  void onTabbarMenu() {
+    int index = tabs.indexWhere((tab) => tab.label == kTabLabelSettingPage);
+    if (index >= 0) {
+      tabController.value.animateTo(index, duration: Duration.zero);
+      _selected.value = index;
+    } else {
+      tabs.add(TabInfo(label: kTabLabelSettingPage, icon: Icons.settings));
+      tabController.value = TabController(
+          length: tabs.length, vsync: this, initialIndex: tabs.length - 1);
+      tabController.value.animateTo(tabs.length - 1, duration: Duration.zero);
+      _selected.value = tabs.length - 1;
+    }
+  }
+}

flutter/lib/desktop/pages/file_manager_page.dart

@@ -73,7 +73,6 @@ class _FileManagerPageState extends State<FileManagerPage>
                 return false;
               },
               child: Scaffold(
-                backgroundColor: isDarkTheme() ? MyTheme.dark : MyTheme.grayBg,
                 body: Row(
                   children: [
                     Flexible(flex: 3, child: body(isLocal: true)),

flutter/lib/desktop/pages/file_manager_tab_page.dart

@@ -82,11 +82,13 @@ class _FileManagerTabPageState extends State<FileManagerTabPage>
           Obx(
             () => DesktopTabBar(
               controller: tabController,
-              tabs: connectionIds.toList(),
+              tabs: connectionIds
+                  .map((e) => TabInfo(label: e, icon: Icons.file_copy_sharp))
+                  .toList(),
               onTabClose: onRemoveId,
-              tabIcon: Icons.file_copy_sharp,
               selected: _selected,
               dark: isDarkTheme(),
+              mainTab: false,
             ),
           ),
           Expanded(

flutter/lib/desktop/pages/remote_page.dart

@@ -263,7 +263,6 @@ class _RemotePageState extends State<RemotePage>
             OverlayEntry(builder: (context) {
               _ffi.chatModel.setOverlayState(Overlay.of(context));
               return Container(
-                  color: Colors.black,
                   child: getRawPointerAndKeyBody(getBodyForDesktop(keyboard)));
             })
           ],
@@ -500,25 +499,20 @@ class _RemotePageState extends State<RemotePage>
 
   Widget getBodyForDesktop(bool keyboard) {
     var paints = <Widget>[
-      MouseRegion(
-          onEnter: (evt) {
-            bind.hostStopSystemKeyPropagate(stopped: false);
-          },
-          onExit: (evt) {
-            bind.hostStopSystemKeyPropagate(stopped: true);
-          },
-          child: Container(
-            color: MyTheme.canvasColor,
-            child: LayoutBuilder(builder: (context, constraints) {
-              Future.delayed(Duration.zero, () {
-                Provider.of<CanvasModel>(context, listen: false)
-                    .updateViewStyle();
-              });
-              return ImagePaint(
-                id: widget.id,
-              );
-            }),
-          ))
+      MouseRegion(onEnter: (evt) {
+        bind.hostStopSystemKeyPropagate(stopped: false);
+      }, onExit: (evt) {
+        bind.hostStopSystemKeyPropagate(stopped: true);
+      }, child: Container(
+        child: LayoutBuilder(builder: (context, constraints) {
+          Future.delayed(Duration.zero, () {
+            Provider.of<CanvasModel>(context, listen: false).updateViewStyle();
+          });
+          return ImagePaint(
+            id: widget.id,
+          );
+        }),
+      ))
     ];
     final cursor = bind.getSessionToggleOptionSync(
         id: widget.id, arg: 'show-remote-cursor');