refactor: global scroll

flutter/lib/desktop/pages/connection_page.dart

@@ -6,6 +6,7 @@ import 'dart:convert';
 import 'package:flutter/material.dart';
 import 'package:flutter_hbb/common/widgets/address_book.dart';
 import 'package:flutter_hbb/consts.dart';
+import 'package:flutter_hbb/desktop/widgets/scroll_wrapper.dart';
 import 'package:get/get.dart';
 import 'package:url_launcher/url_launcher_string.dart';
 
@@ -25,10 +26,14 @@ class ConnectionPage extends StatefulWidget {
 }
 
 /// State for the connection page.
-class _ConnectionPageState extends State<ConnectionPage> {
+class _ConnectionPageState extends State<ConnectionPage>
+    with SingleTickerProviderStateMixin {
   /// Controller for the id input bar.
   final _idController = IDTextEditingController();
 
+  /// Nested scroll controller
+  final _scrollController = ScrollController();
+
   Timer? _updateTimer;
 
   @override
@@ -51,15 +56,16 @@ class _ConnectionPageState extends State<ConnectionPage> {
 
   @override
   Widget build(BuildContext context) {
-    return Container(
-      child: Column(
-          mainAxisAlignment: MainAxisAlignment.start,
-          mainAxisSize: MainAxisSize.max,
-          crossAxisAlignment: CrossAxisAlignment.start,
-          children: <Widget>[
-            Expanded(
-              child: Column(
-                children: [
+    return Column(
+      children: [
+        Expanded(
+          child: DesktopScrollWrapper(
+            scrollController: _scrollController,
+            child: CustomScrollView(
+              controller: _scrollController,
+              slivers: [
+                SliverList(
+                    delegate: SliverChildListDelegate([
                   Row(
                     children: [
                       _buildRemoteIDTextField(context),
@@ -67,8 +73,10 @@ class _ConnectionPageState extends State<ConnectionPage> {
                   ).marginOnly(top: 22),
                   SizedBox(height: 12),
                   Divider(),
-                  Expanded(
-                      child: PeerTabPage(
+                ])),
+                SliverFillRemaining(
+                  hasScrollBody: false,
+                  child: PeerTabPage(
                     tabs: [
                       translate('Recent Sessions'),
                       translate('Favorites'),
@@ -89,14 +97,16 @@ class _ConnectionPageState extends State<ConnectionPage> {
                         menuPadding: EdgeInsets.only(left: 12.0, right: 3.0),
                       ),
                     ],
-                  )),
-                ],
-              ).marginSymmetric(horizontal: 22),
-            ),
-            const Divider(),
-            SizedBox(child: Obx(() => buildStatus()))
-                .paddingOnly(bottom: 12, top: 6),
-          ]),
+                  ),
+                )
+              ],
+            ).marginSymmetric(horizontal: 12.0),
+          ),
+        ),
+        const Divider(),
+        SizedBox(child: Obx(() => buildStatus()))
+            .paddingOnly(bottom: 12, top: 6),
+      ],
     );
   }
 

flutter/lib/desktop/pages/desktop_home_page.dart

@@ -7,6 +7,7 @@ import 'package:flutter_hbb/common.dart';
 import 'package:flutter_hbb/desktop/pages/connection_page.dart';
 import 'package:flutter_hbb/desktop/pages/desktop_setting_page.dart';
 import 'package:flutter_hbb/desktop/pages/desktop_tab_page.dart';
+import 'package:flutter_hbb/desktop/widgets/scroll_wrapper.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';
@@ -29,6 +30,8 @@ const borderColor = Color(0xFF2F65BA);
 
 class _DesktopHomePageState extends State<DesktopHomePage>
     with TrayListener, WindowListener, AutomaticKeepAliveClientMixin {
+  final _leftPaneScrollController = ScrollController();
+
   @override
   bool get wantKeepAlive => true;
   var updateUrl = '';
@@ -56,6 +59,7 @@ class _DesktopHomePageState extends State<DesktopHomePage>
   Widget build(BuildContext context) {
     super.build(context);
     return Row(
+      crossAxisAlignment: CrossAxisAlignment.start,
       children: [
         buildLeftPane(context),
         const VerticalDivider(
@@ -69,19 +73,25 @@ class _DesktopHomePageState extends State<DesktopHomePage>
     );
   }
 
-  buildLeftPane(BuildContext context) {
+  Widget buildLeftPane(BuildContext context) {
     return ChangeNotifierProvider.value(
       value: gFFI.serverModel,
       child: Container(
         width: 200,
         color: Theme.of(context).backgroundColor,
-        child: Column(
-          children: [
-            buildTip(context),
-            buildIDBoard(context),
-            buildPasswordBoard(context),
-            buildHelpCards(),
-          ],
+        child: DesktopScrollWrapper(
+          scrollController: _leftPaneScrollController,
+          child: SingleChildScrollView(
+            controller: _leftPaneScrollController,
+            child: Column(
+              children: [
+                buildTip(context),
+                buildIDBoard(context),
+                buildPasswordBoard(context),
+                buildHelpCards(),
+              ],
+            ),
+          ),
         ),
       ),
     );