Check drawer state when back.

README.md

@@ -1,31 +1,38 @@
 # Server Monitor & Toolbox
 
-A new Flutter project which provide a chart view to display server status data.
+A new Flutter project which provide a chart view to display server status data and a manager toolbox.
 
 ## ScreenShots
 <table>
   <tr>
     <td>
-	    <img width="200px" src="https://raw.githubusercontent.com/LollipopKit/flutter_server_monitor_toolbox/main/screenshots/IMG_3327.PNG">
+	    <img width="200px" src="https://raw.githubusercontent.com/LollipopKit/flutter_server_monitor_toolbox/main/screenshots/server.jpg">
     </td>
     <td>
-	    <img width="200px" src="https://raw.githubusercontent.com/LollipopKit/flutter_server_monitor_toolbox/main/screenshots/IMG_3347.PNG">
+	    <img width="200px" src="https://raw.githubusercontent.com/LollipopKit/flutter_server_monitor_toolbox/main/screenshots/server_detail.jpg">
     </td>
     <td>
-	    <img width="200px" src="https://raw.githubusercontent.com/LollipopKit/flutter_server_monitor_toolbox/main/screenshots/detail.jpg">
+	    <img width="200px" src="https://raw.githubusercontent.com/LollipopKit/flutter_server_monitor_toolbox/main/screenshots/server_edit.jpg">
     </td>
   </tr>
 </table>
 <table>
   <tr>
     <td>
-	    <img width="200px" src="https://raw.githubusercontent.com/LollipopKit/flutter_server_monitor_toolbox/main/screenshots/IMG_3330.PNG">
+	    <img width="200px" src="https://raw.githubusercontent.com/LollipopKit/flutter_server_monitor_toolbox/main/screenshots/convert.jpg">
     </td>
     <td>
-	    <img width="200px" src="https://raw.githubusercontent.com/LollipopKit/flutter_server_monitor_toolbox/main/screenshots/IMG_3331.PNG">
+	    <img width="200px" src="https://raw.githubusercontent.com/LollipopKit/flutter_server_monitor_toolbox/main/screenshots/ping.jpg">
     </td>
     <td>
-	    <img width="200px" src="https://raw.githubusercontent.com/LollipopKit/flutter_server_monitor_toolbox/main/screenshots/IMG_3346.PNG">
+	    <img width="200px" src="https://raw.githubusercontent.com/LollipopKit/flutter_server_monitor_toolbox/main/screenshots/setting.jpg">
+    </td>
+  </tr>
+</table>
+<table>
+  <tr>
+    <td>
+	    <img width="200px" src="https://raw.githubusercontent.com/LollipopKit/flutter_server_monitor_toolbox/main/screenshots/drawer.jpg">
     </td>
   </tr>
 </table>
@@ -41,22 +48,22 @@ Support, but not tested|Windows/Linux
 - [x] Server info store
 - [x] Status chart view
 - [x] Base64/Url En/Decode
-- [x] Private key store
 - [x] Server status detail page
 - [x] Theme switch
-- [x] Execute snippet
 - [x] Migrate from `ssh2` to `dartssh2`
 - [x] Desktop support
+- [ ] Apt manager
+- [ ] SFTP
+- [ ] Snippet market
+- [ ] Docker manager
+- [ ] SSH terminal
 
 ## Build
 Please use `make.dart` to build.
 ```shell
 # build android apk
 ./make.dart build android
-# due to pub package 'ssh2' incompatibility
+# Run in release mode
-# can't build ios ipa through './make.dart build ios'
-# more info: [https://github.com/jda258/flutter_ssh2/issues/8]
-# please run below cmd to run on ios device
 ./make.dart run release
 ```
 

android/app/build.gradle

@@ -32,7 +32,7 @@ apply plugin: 'kotlin-android'
 apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle"
 
 android {
-    compileSdkVersion 30
+    compileSdkVersion 31
 
     compileOptions {
         sourceCompatibility JavaVersion.VERSION_1_8

android/build.gradle

@@ -1,5 +1,5 @@
 buildscript {
-    ext.kotlin_version = '1.3.50'
+    ext.kotlin_version = '1.6.10'
     repositories {
         google()
         mavenCentral()

ios/Runner.xcodeproj/project.pbxproj

@@ -354,7 +354,7 @@
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
-				CURRENT_PROJECT_VERSION = 85;
+				CURRENT_PROJECT_VERSION = 88;
 				DEVELOPMENT_TEAM = BA88US33G6;
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = Runner/Info.plist;
@@ -362,7 +362,7 @@
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 1.0.85;
+				MARKETING_VERSION = 1.0.88;
 				PRODUCT_BUNDLE_IDENTIFIER = com.lollipopkit.toolbox;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
@@ -484,7 +484,7 @@
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
-				CURRENT_PROJECT_VERSION = 85;
+				CURRENT_PROJECT_VERSION = 88;
 				DEVELOPMENT_TEAM = BA88US33G6;
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = Runner/Info.plist;
@@ -492,7 +492,7 @@
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 1.0.85;
+				MARKETING_VERSION = 1.0.88;
 				PRODUCT_BUNDLE_IDENTIFIER = com.lollipopkit.toolbox;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
@@ -508,7 +508,7 @@
 			buildSettings = {
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
-				CURRENT_PROJECT_VERSION = 85;
+				CURRENT_PROJECT_VERSION = 88;
 				DEVELOPMENT_TEAM = BA88US33G6;
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = Runner/Info.plist;
@@ -516,7 +516,7 @@
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 1.0.85;
+				MARKETING_VERSION = 1.0.88;
 				PRODUCT_BUNDLE_IDENTIFIER = com.lollipopkit.toolbox;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";

lib/data/model/app/menu_item.dart

@@ -0,0 +1,35 @@
+import 'package:flutter/material.dart';
+
+class MenuItem {
+  final String text;
+  final IconData icon;
+
+  const MenuItem({
+    required this.text,
+    required this.icon,
+  });
+}
+
+class MenuItems {
+  static const List<MenuItem> firstItems = [sftp, snippet, apt];
+  static const List<MenuItem> secondItems = [edit];
+
+  static const sftp = MenuItem(text: 'SFTP', icon: Icons.file_present);
+  static const snippet = MenuItem(text: 'Snippet', icon: Icons.label);
+  static const apt = MenuItem(text: 'Apt', icon: Icons.system_security_update);
+  static const edit = MenuItem(text: 'Edit', icon: Icons.settings);
+
+  static Widget buildItem(MenuItem item) {
+    return Row(
+      children: [
+        Icon(item.icon),
+        const SizedBox(
+          width: 10,
+        ),
+        Text(
+          item.text,
+        ),
+      ],
+    );
+  }
+}

lib/data/model/app/navigation_item.dart

@@ -0,0 +1,8 @@
+import 'package:flutter/material.dart';
+
+class NavigationItem {
+  final IconData icon;
+  final String title;
+
+  NavigationItem(this.icon, this.title);
+}

lib/data/model/server/server.dart

@@ -9,6 +9,5 @@ class ServerInfo {
   SSHClient? client;
   ServerConnectionState connectionState;
 
-  ServerInfo(
+  ServerInfo(this.info, this.status, this.client, this.connectionState);
-      this.info, this.status, this.client, this.connectionState);
 }

lib/data/provider/server.dart

@@ -142,6 +142,9 @@ class ServerProvider extends BusyProvider {
   Future<void> updateServer(
       ServerPrivateInfo old, ServerPrivateInfo newSpi) async {
     final idx = _servers.indexWhere((e) => e.info == old);
+    if (idx < 0) {
+      throw RangeError.index(idx, _servers);
+    }
     _servers[idx].info = newSpi;
     _servers[idx].client = await genClient(newSpi);
     locator<ServerStore>().update(old, newSpi);
@@ -199,7 +202,7 @@ class ServerProvider extends BusyProvider {
   ///   lo: 45929941  269112    0    0    0     0          0         0 45929941  269112    0    0    0     0       0          0
   ///   eth0: 48481023  505772    0    0    0     0          0         0 36002262  202307    0    0    0     0       0          0
   /// 1635752901
-  Future<void> _getNetSpeed(ServerPrivateInfo spi, String raw) async {
+  void _getNetSpeed(ServerPrivateInfo spi, String raw) {
     final info = _servers.firstWhere((e) => e.info == spi);
     final split = raw.split('\n');
     final deviceCount = split.length - 3;
@@ -219,13 +222,11 @@ class ServerProvider extends BusyProvider {
     notifyListeners();
   }
 
-  Future<void> _getSysVer(ServerPrivateInfo spi, String raw) async {
+  void _getSysVer(ServerPrivateInfo spi, String raw) {
     final info = _servers.firstWhere((e) => e.info == spi);
     final s = raw.split('=');
     if (s.length == 2) {
       info.status.sysVer = s[1].replaceAll('"', '').replaceFirst('\n', '');
-    } else {
-      info.status.sysVer = '';
     }
 
     notifyListeners();
@@ -241,7 +242,7 @@ class ServerProvider extends BusyProvider {
     return '';
   }
 
-  Future<void> _getCPU(ServerPrivateInfo spi, String raw, String temp) async {
+  void _getCPU(ServerPrivateInfo spi, String raw, String temp) {
     final info = _servers.firstWhere((e) => e.info == spi);
     final List<CpuStatus> cpus = [];
 
@@ -259,9 +260,7 @@ class ServerProvider extends BusyProvider {
           int.parse(matches[5]),
           int.parse(matches[6])));
     }
-    if (cpus.isEmpty) {
+    if (cpus.isNotEmpty) {
-      info.status.cpu2Status = emptyCpu2Status;
-    } else {
       info.status.cpu2Status =
           info.status.cpu2Status.update(cpus, _getCPUTemp(temp));
     }
@@ -269,13 +268,13 @@ class ServerProvider extends BusyProvider {
     notifyListeners();
   }
 
-  Future<void> _getUpTime(ServerPrivateInfo spi, String raw) async {
+  void _getUpTime(ServerPrivateInfo spi, String raw) {
     _servers.firstWhere((e) => e.info == spi).status.uptime =
         raw.split('up ')[1].split(', ')[0];
     notifyListeners();
   }
 
-  Future<void> _getTcp(ServerPrivateInfo spi, String raw) async {
+  void _getTcp(ServerPrivateInfo spi, String raw) {
     final info = _servers.firstWhere((e) => e.info == spi);
     final lines = raw.split('\n');
     final idx = lines.lastWhere((element) => element.startsWith('Tcp:'),
@@ -283,13 +282,11 @@ class ServerProvider extends BusyProvider {
     if (idx != '') {
       final vals = idx.split(RegExp(r'\s{1,}'));
       info.status.tcp = TcpStatus(vals[5].i, vals[6].i, vals[7].i, vals[8].i);
-    } else {
-      info.status.tcp = TcpStatus(0, 0, 0, 0);
     }
     notifyListeners();
   }
 
-  Future<void> _getDisk(ServerPrivateInfo spi, String raw) async {
+  void _getDisk(ServerPrivateInfo spi, String raw) {
     final info = _servers.firstWhere((e) => e.info == spi);
     final list = <DiskInfo>[];
     final items = raw.split('\n');
@@ -305,7 +302,7 @@ class ServerProvider extends BusyProvider {
     notifyListeners();
   }
 
-  Future<void> _getMem(ServerPrivateInfo spi, String raw) async {
+  void _getMem(ServerPrivateInfo spi, String raw) {
     final info = _servers.firstWhere((e) => e.info == spi);
     for (var item in raw.split('\n')) {
       if (item.contains('Mem:')) {
@@ -324,8 +321,11 @@ class ServerProvider extends BusyProvider {
     notifyListeners();
   }
 
-  Future<String?> runSnippet(int idx, Snippet snippet) async {
+  Future<String?> runSnippet(ServerPrivateInfo spi, Snippet snippet) async {
-    final result = await _servers[idx].client!.run(snippet.script);
+    final result = await _servers
+        .firstWhere((element) => element.info == spi)
+        .client!
+        .run(snippet.script);
     return utf8.decode(result);
   }
 }

lib/data/res/build_data.dart

@@ -2,8 +2,9 @@
 
 class BuildData {
   static const String name = "ServerBox";
-  static const int build = 87;
+  static const int build = 95;
-  static const String engine = "Flutter 2.8.1 • channel stable • https://github.com/flutter/flutter.git\nFramework • revision 77d935af4d (7 weeks ago) • 2021-12-16 08:37:33 -0800\nEngine • revision 890a5fca2e\nTools • Dart 2.15.1\n";
+  static const String engine =
-  static const String buildAt = "2022-02-02 13:20:22.346643";
+      "Flutter 2.10.0 • channel stable • https://github.com/flutter/flutter.git\nFramework • revision 5f105a6ca7 (7 days ago) • 2022-02-01 14:15:42 -0800\nEngine • revision 776efd2034\nTools • Dart 2.16.0 • DevTools 2.9.2\n";
-  static const int modifications = 8;
+  static const String buildAt = "2022-02-08 21:30:51.218738";
+  static const int modifications = 3;
 }

lib/data/res/padding.dart

@@ -0,0 +1,3 @@
+import 'package:flutter/material.dart';
+
+const roundRectCardPadding = EdgeInsets.symmetric(horizontal: 17);

lib/data/res/tab.dart

@@ -1 +1,9 @@
+import 'package:flutter/material.dart';
+import 'package:toolbox/data/model/app/navigation_item.dart';
+
 final List<String> tabs = ['Servers', 'En/Decode', 'Ping'];
+final List<NavigationItem> tabItems = [
+  NavigationItem(Icons.computer, 'Server'),
+  NavigationItem(Icons.code, 'Convert'),
+  NavigationItem(Icons.network_check, 'Ping'),
+];

lib/data/store/server.dart

@@ -23,7 +23,11 @@ class ServerStore extends PersistentStore {
 
   void update(ServerPrivateInfo old, ServerPrivateInfo newInfo) {
     final ss = fetch();
-    ss[index(old)] = newInfo;
+    final idx = index(old);
+    if (idx < 0) {
+      throw RangeError.index(idx, ss);
+    }
+    ss[idx] = newInfo;
     box.put('servers', json.encode(ss));
   }
 

lib/data/store/setting.dart

@@ -5,6 +5,6 @@ class SettingStore extends PersistentStore {
   StoreProperty<int> get primaryColor =>
       property('primaryColor', defaultValue: Colors.deepPurpleAccent.value);
   StoreProperty<int> get serverStatusUpdateInterval =>
-      property('serverStatusUpdateInterval', defaultValue: 3);
+      property('serverStatusUpdateInterval', defaultValue: 2);
   StoreProperty<int> get launchPage => property('launchPage', defaultValue: 0);
 }

lib/view/page/convert.dart

@@ -5,6 +5,7 @@ import 'package:flutter/material.dart';
 import 'package:toolbox/core/utils.dart';
 import 'package:toolbox/data/res/color.dart';
 import 'package:toolbox/view/widget/input_field.dart';
+import 'package:toolbox/view/widget/round_rect_card.dart';
 
 class ConvertPage extends StatefulWidget {
   const ConvertPage({Key? key}) : super(key: key);
@@ -95,8 +96,8 @@ class _ConvertPageState extends State<ConvertPage>
   }
 
   Widget _buildTypeOption() {
-    return Card(
+    return RoundRectCard(
-      child: ExpansionTile(
+      ExpansionTile(
         tilePadding: const EdgeInsets.only(left: 7, right: 27),
         childrenPadding: EdgeInsets.zero,
         title: Row(

lib/view/page/debug.dart

@@ -14,7 +14,7 @@ class _DebugPageState extends State<DebugPage> {
   Widget build(BuildContext context) {
     return Scaffold(
       appBar:
-          AppBar(title: const Text('Terminal'), backgroundColor: Colors.black),
+          AppBar(title: const Text('App log'), backgroundColor: Colors.black),
       body: _buildTerminal(context),
       backgroundColor: Colors.black,
     );

lib/view/page/home.dart

@@ -1,13 +1,16 @@
 import 'package:after_layout/after_layout.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter_advanced_drawer/flutter_advanced_drawer.dart';
 import 'package:get_it/get_it.dart';
 import 'package:toolbox/core/analysis.dart';
 import 'package:toolbox/core/build_mode.dart';
 import 'package:toolbox/core/route.dart';
 import 'package:toolbox/core/update.dart';
 import 'package:toolbox/core/utils.dart';
+import 'package:toolbox/data/model/app/navigation_item.dart';
 import 'package:toolbox/data/provider/server.dart';
 import 'package:toolbox/data/res/build_data.dart';
+import 'package:toolbox/data/res/color.dart';
 import 'package:toolbox/data/res/icon/common.dart';
 import 'package:toolbox/data/res/tab.dart';
 import 'package:toolbox/data/res/url.dart';
@@ -36,23 +39,26 @@ class _MyHomePageState extends State<MyHomePage>
         SingleTickerProviderStateMixin,
         AfterLayoutMixin,
         WidgetsBindingObserver {
-  late final TabController _tabController;
   late final ServerProvider _serverProvider;
+  late final PageController _pageController;
+  late final AdvancedDrawerController _advancedDrawerController;
+  late int _selectIndex;
+  late double _width;
 
   @override
   void initState() {
     super.initState();
     _serverProvider = locator<ServerProvider>();
     WidgetsBinding.instance?.addObserver(this);
-    _tabController = TabController(
+    _selectIndex = locator<SettingStore>().launchPage.fetch()!;
-        initialIndex: locator<SettingStore>().launchPage.fetch()!,
+    _pageController = PageController(initialPage: _selectIndex);
-        length: tabs.length,
+    _advancedDrawerController = AdvancedDrawerController();
-        vsync: this);
+  }
-    _tabController.addListener(() {
+
-      if (_tabController.index == 0) {
+  @override
-        FocusScope.of(context).unfocus();
+  void didChangeDependencies() {
-      }
+    super.didChangeDependencies();
-    });
+    _width = MediaQuery.of(context).size.width;
   }
 
   @override
@@ -77,37 +83,135 @@ class _MyHomePageState extends State<MyHomePage>
   Widget build(BuildContext context) {
     setTransparentNavigationBar(context);
     super.build(context);
-    return Scaffold(
+    return WillPopScope(
-      appBar: AppBar(
+        child: _buildMain(context),
-        title: GestureDetector(
+        onWillPop: () {
-          onLongPress: () =>
+          if (_advancedDrawerController.value.visible) {
-              AppRoute(const DebugPage(), 'Debug Page').go(context),
+            _advancedDrawerController.hideDrawer();
-          child: const Text(BuildData.name),
+            return Future.value(false);
-        ),
+          }
-        bottom: TabBar(
+          return Future.value(true);
-          indicatorColor: widget.primaryColor,
+        });
-          tabs: tabs.map((e) => Tab(text: e)).toList(),
+  }
-          controller: _tabController,
+
+  Widget _buildMain(BuildContext context) {
+    return AdvancedDrawer(
+        controller: _advancedDrawerController,
+        animationCurve: Curves.easeInOutCirc,
+        animationDuration: const Duration(milliseconds: 300),
+        animateChildDecoration: true,
+        rtlOpening: false,
+        disabledGestures: true,
+        childDecoration: const BoxDecoration(
+          // NOTICE: Uncomment if you want to add shadow behind the page.
+          // Keep in mind that it may cause animation jerks.
+          boxShadow: <BoxShadow>[
+            BoxShadow(
+              color: Colors.black12,
+              blurRadius: 0.0,
+            ),
+          ],
+          borderRadius: BorderRadius.all(Radius.circular(16)),
         ),
+        drawer: _buildDrawer(),
+        child: Scaffold(
+          appBar: AppBar(
+            title: Text(tabItems[_selectIndex].title),
+            actions: [
+              IconButton(
+                icon: const Icon(Icons.developer_mode, size: 23),
+                tooltip: 'Debug',
+                onPressed: () =>
+                    AppRoute(const DebugPage(), 'Debug Page').go(context),
+              ),
+            ],
+            leading: IconButton(
+              onPressed: () => _advancedDrawerController.showDrawer(),
+              icon: ValueListenableBuilder<AdvancedDrawerValue>(
+                valueListenable: _advancedDrawerController,
+                builder: (_, value, __) {
+                  return AnimatedSwitcher(
+                    duration: const Duration(milliseconds: 250),
+                    child: Icon(
+                      value.visible ? Icons.clear : Icons.menu,
+                      key: ValueKey<bool>(value.visible),
+                    ),
+                  );
+                },
+              ),
+            ),
+          ),
+          body: PageView(
+            physics: const ClampingScrollPhysics(),
+            controller: _pageController,
+            onPageChanged: (i) {
+              FocusScope.of(context).unfocus();
+              _selectIndex = i;
+              setState(() {});
+            },
+            children: const [ServerPage(), ConvertPage(), PingPage()],
+          ),
+          bottomNavigationBar: _buildBottom(context),
+        ));
+  }
+
+  Widget _buildItem(int idx, NavigationItem item, bool isSelected) {
+    bool isDarkMode = Theme.of(context).brightness == Brightness.dark;
+    final width = _width / tabItems.length;
+    return AnimatedContainer(
+      duration: const Duration(milliseconds: 377),
+      curve: Curves.fastOutSlowIn,
+      height: 50,
+      width: isSelected ? width : width - 17,
+      decoration: BoxDecoration(
+          color: isSelected
+              ? isDarkMode
+                  ? Colors.white12
+                  : Colors.black.withOpacity(0.07)
+              : Colors.transparent,
+          borderRadius: const BorderRadius.all(Radius.circular(50))),
+      child: IconButton(
+        icon: Icon(item.icon),
+        tooltip: item.title,
+        splashRadius: width / 3.3,
+        padding: const EdgeInsets.only(left: 17, right: 17),
+        onPressed: () {
+          setState(() {
+            _pageController.animateToPage(idx,
+                duration: const Duration(milliseconds: 677),
+                curve: Curves.fastLinearToSlowEaseIn);
+          });
+        },
       ),
-      drawer: _buildDrawer(),
-      body: TabBarView(controller: _tabController, children: [
-        ServerPage(_tabController),
-        const ConvertPage(),
-        const PingPage()
-      ]),
     );
   }
 
+  Widget _buildBottom(BuildContext context) {
+    return SafeArea(
+        child: Container(
+      height: 56,
+      padding: const EdgeInsets.only(left: 8, top: 4, bottom: 4, right: 8),
+      width: _width,
+      child: Row(
+        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+        children: tabItems.map((item) {
+          int itemIndex = tabItems.indexOf(item);
+          return _buildItem(itemIndex, item, _selectIndex == itemIndex);
+        }).toList(),
+      ),
+    ));
+  }
+
   Widget _buildDrawer() {
-    return Drawer(
+    return SafeArea(
-      child: ListView(
+      child: Column(
-        padding: EdgeInsets.zero,
+        mainAxisAlignment: MainAxisAlignment.center,
         children: [
-          UserAccountsDrawerHeader(
+          _buildIcon(),
-            accountName: const Text(BuildData.name),
+          const Text(BuildData.name),
-            accountEmail: Text(_buildVersionStr()),
+          Text(_buildVersionStr()),
-            currentAccountPicture: _buildIcon(),
+          SizedBox(
+            height: MediaQuery.of(context).size.height * 0.07,
           ),
           ListTile(
             leading: const Icon(Icons.settings),
@@ -149,9 +253,19 @@ class _MyHomePageState extends State<MyHomePage>
   }
 
   Widget _buildIcon() {
-    return ConstrainedBox(
+    return Stack(
-      constraints: const BoxConstraints(maxHeight: 60, maxWidth: 60),
+      alignment: Alignment.center,
-      child: appIcon,
+      children: [
+        ConstrainedBox(
+            constraints: const BoxConstraints(maxHeight: 53, maxWidth: 53),
+            child: Container(
+              color: primaryColor,
+            )),
+        ConstrainedBox(
+          constraints: const BoxConstraints(maxHeight: 83, maxWidth: 83),
+          child: appIcon,
+        )
+      ],
     );
   }
 

lib/view/page/ping.dart

@@ -6,6 +6,7 @@ import 'package:flutter/material.dart';
 import 'package:toolbox/core/utils.dart';
 import 'package:toolbox/data/res/color.dart';
 import 'package:toolbox/view/widget/input_field.dart';
+import 'package:toolbox/view/widget/round_rect_card.dart';
 
 class PingPage extends StatefulWidget {
   const PingPage({Key? key}) : super(key: key);
@@ -45,11 +46,9 @@ class _PingPageState extends State<PingPage>
             padding: const EdgeInsets.symmetric(horizontal: 7),
             child: Column(children: [
               const SizedBox(height: 13),
-              buildInput(context, _textEditingController,
+              buildInput(context, _textEditingController, maxLines: 1),
-                  maxLines: 1, hint: 'Type here.'),
               _buildControl(),
-              buildInput(context, _textEditingControllerResult,
+              buildInput(context, _textEditingControllerResult),
-                  hint: 'Result here.'),
             ])),
         onTap: () => FocusScope.of(context).requestFocus(FocusNode()),
       ),
@@ -70,8 +69,8 @@ class _PingPageState extends State<PingPage>
   Widget _buildControl() {
     return SizedBox(
       height: 57,
-      child: Card(
+      child: RoundRectCard(
-        child: InkWell(
+        InkWell(
           onTap: () => FocusScope.of(context).unfocus(),
           child: Row(
             mainAxisAlignment: MainAxisAlignment.spaceAround,

lib/view/page/private_key/list.dart

@@ -3,6 +3,7 @@ import 'package:provider/provider.dart';
 import 'package:toolbox/core/route.dart';
 import 'package:toolbox/data/provider/private_key.dart';
 import 'package:toolbox/data/res/color.dart';
+import 'package:toolbox/data/res/padding.dart';
 import 'package:toolbox/view/page/private_key/edit.dart';
 import 'package:toolbox/view/widget/round_rect_card.dart';
 
@@ -29,24 +30,27 @@ class _PrivateKeyListState extends State<StoredPrivateKeysPage> {
                   itemCount: key.infos.length,
                   itemExtent: 57,
                   itemBuilder: (context, idx) {
-                    return RoundRectCard(Row(
+                    return RoundRectCard(Padding(
-                      crossAxisAlignment: CrossAxisAlignment.center,
+                      padding: roundRectCardPadding,
-                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                      child: Row(
-                      children: [
+                        crossAxisAlignment: CrossAxisAlignment.center,
-                        Text(
+                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                          key.infos[idx].id,
+                        children: [
-                          textAlign: TextAlign.center,
+                          Text(
-                        ),
+                            key.infos[idx].id,
-                        TextButton(
+                            textAlign: TextAlign.center,
-                            onPressed: () => AppRoute(
+                          ),
-                                    PrivateKeyEditPage(info: key.infos[idx]),
+                          TextButton(
-                                    'private key edit page')
+                              onPressed: () => AppRoute(
-                                .go(context),
+                                      PrivateKeyEditPage(info: key.infos[idx]),
-                            child: Text(
+                                      'private key edit page')
-                              'Edit',
+                                  .go(context),
-                              style: _textStyle,
+                              child: Text(
-                            ))
+                                'Edit',
-                      ],
+                                style: _textStyle,
+                              ))
+                        ],
+                      ),
                     ));
                   })
               : const Center(child: Text('No saved private keys.'));

lib/view/page/server/detail.dart

@@ -6,6 +6,7 @@ import 'package:toolbox/data/model/server/server_status.dart';
 import 'package:toolbox/data/provider/server.dart';
 import 'package:toolbox/data/res/color.dart';
 import 'package:toolbox/data/res/icon/linux_icons.dart';
+import 'package:toolbox/data/res/padding.dart';
 import 'package:toolbox/view/widget/round_rect_card.dart';
 
 const style11 = TextStyle(fontSize: 11);
@@ -44,7 +45,7 @@ class _ServerDetailPageState extends State<ServerDetailPage>
         title: Text(si.info.name),
       ),
       body: ListView(
-        padding: const EdgeInsets.all(17),
+        padding: const EdgeInsets.all(13),
         children: [
           _buildLinuxIcon(si.status.sysVer),
           SizedBox(height: _media.size.height * 0.03),
@@ -68,41 +69,44 @@ class _ServerDetailPageState extends State<ServerDetailPage>
 
   Widget _buildCPUView(ServerStatus ss) {
     return RoundRectCard(
-      SizedBox(
+      Padding(
-        height: 12 * ss.cpu2Status.coresCount + 67,
+        padding: roundRectCardPadding,
-        child: Column(children: [
+        child: SizedBox(
-          SizedBox(
+          height: 12 * ss.cpu2Status.coresCount + 67,
-            height: _media.size.height * 0.02,
+          child: Column(children: [
-          ),
+            SizedBox(
-          Row(
+              height: _media.size.height * 0.02,
-            mainAxisAlignment: MainAxisAlignment.spaceBetween,
+            ),
-            children: [
+            Row(
-              Text(
+              mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                '${ss.cpu2Status.usedPercent(coreIdx: 0).toInt()}%',
+              children: [
-                style: const TextStyle(fontSize: 27),
+                Text(
-                textScaleFactor: 1.0,
+                  '${ss.cpu2Status.usedPercent(coreIdx: 0).toInt()}%',
-              ),
+                  style: const TextStyle(fontSize: 27),
-              Row(
+                  textScaleFactor: 1.0,
-                children: [
+                ),
-                  _buildCPUTimePercent(ss.cpu2Status.user, 'user'),
+                Row(
-                  SizedBox(
+                  children: [
-                    width: _media.size.width * 0.03,
+                    _buildCPUTimePercent(ss.cpu2Status.user, 'user'),
-                  ),
+                    SizedBox(
-                  _buildCPUTimePercent(ss.cpu2Status.sys, 'sys'),
+                      width: _media.size.width * 0.03,
-                  SizedBox(
+                    ),
-                    width: _media.size.width * 0.03,
+                    _buildCPUTimePercent(ss.cpu2Status.sys, 'sys'),
-                  ),
+                    SizedBox(
-                  _buildCPUTimePercent(ss.cpu2Status.nice, 'nice'),
+                      width: _media.size.width * 0.03,
-                  SizedBox(
+                    ),
-                    width: _media.size.width * 0.03,
+                    _buildCPUTimePercent(ss.cpu2Status.nice, 'nice'),
-                  ),
+                    SizedBox(
-                  _buildCPUTimePercent(ss.cpu2Status.idle, 'idle')
+                      width: _media.size.width * 0.03,
-                ],
+                    ),
-              )
+                    _buildCPUTimePercent(ss.cpu2Status.idle, 'idle')
-            ],
+                  ],
-          ),
+                )
-          _buildCPUProgress(ss)
+              ],
-        ]),
+            ),
+            _buildCPUProgress(ss)
+          ]),
+        ),
       ),
     );
   }
@@ -158,7 +162,7 @@ class _ServerDetailPageState extends State<ServerDetailPage>
 
   Widget _buildUpTimeAndSys(ServerStatus ss) {
     return RoundRectCard(Padding(
-      padding: const EdgeInsets.symmetric(vertical: 13),
+      padding: const EdgeInsets.symmetric(vertical: 13, horizontal: 17),
       child: Row(
         mainAxisAlignment: MainAxisAlignment.spaceBetween,
         children: [
@@ -191,47 +195,50 @@ class _ServerDetailPageState extends State<ServerDetailPage>
     final pColor = primaryColor;
     final used = ss.memory.used / ss.memory.total;
     final width = _media.size.width - 17 * 2 - 17 * 2;
-    return RoundRectCard(SizedBox(
+    return RoundRectCard(Padding(
-      height: 47,
+      padding: roundRectCardPadding,
-      child: Column(
+      child: SizedBox(
-        crossAxisAlignment: CrossAxisAlignment.center,
+        height: 47,
-        mainAxisAlignment: MainAxisAlignment.center,
+        child: Column(
-        children: [
+          crossAxisAlignment: CrossAxisAlignment.center,
-          Row(
+          mainAxisAlignment: MainAxisAlignment.center,
-            mainAxisAlignment: MainAxisAlignment.spaceBetween,
+          children: [
-            children: [
+            Row(
-              _buildMemExplain(convertMB(ss.memory.used), pColor),
+              mainAxisAlignment: MainAxisAlignment.spaceBetween,
-              _buildMemExplain(
+              children: [
-                  convertMB(ss.memory.cache), pColor.withAlpha(77)),
+                _buildMemExplain(convertMB(ss.memory.used), pColor),
-              _buildMemExplain(convertMB(ss.memory.total - ss.memory.used),
+                _buildMemExplain(
-                  progressColor.resolve(context))
+                    convertMB(ss.memory.cache), pColor.withAlpha(77)),
-            ],
+                _buildMemExplain(convertMB(ss.memory.total - ss.memory.used),
-          ),
+                    progressColor.resolve(context))
-          const SizedBox(
+              ],
-            height: 7,
+            ),
-          ),
+            const SizedBox(
-          Row(
+              height: 7,
-            children: [
+            ),
-              SizedBox(
+            Row(
-                  width: width * used,
+              children: [
+                SizedBox(
+                    width: width * used,
+                    child: LinearProgressIndicator(
+                      value: 1,
+                      color: pColor,
+                    )),
+                SizedBox(
+                  width: width * (1 - used),
                   child: LinearProgressIndicator(
-                    value: 1,
+                    // memory.total == 1: failed to get mem, now mem = [emptyMemory] which is initial value.
-                    color: pColor,
+                    value: ss.memory.total == 1
-                  )),
+                        ? 0
-              SizedBox(
+                        : ss.memory.cache / (ss.memory.total - ss.memory.used),
-                width: width * (1 - used),
+                    backgroundColor: progressColor.resolve(context),
-                child: LinearProgressIndicator(
+                    color: pColor.withAlpha(77),
-                  // memory.total == 1: failed to get mem, now mem = [emptyMemory] which is initial value.
+                  ),
-                  value: ss.memory.total == 1
+                )
-                      ? 0
+              ],
-                      : ss.memory.cache / (ss.memory.total - ss.memory.used),
+            )
-                  backgroundColor: progressColor.resolve(context),
+          ],
-                  color: pColor.withAlpha(77),
+        ),
-                ),
-              )
-            ],
-          )
-        ],
       ),
     ));
   }
@@ -265,7 +272,7 @@ class _ServerDetailPageState extends State<ServerDetailPage>
     return RoundRectCard(SizedBox(
       height: 27 * clone.length + 25,
       child: ListView.builder(
-          padding: const EdgeInsets.symmetric(vertical: 13),
+          padding: const EdgeInsets.symmetric(vertical: 13, horizontal: 17),
           physics: const NeverScrollableScrollPhysics(),
           itemCount: clone.length,
           itemBuilder: (_, idx) {
@@ -302,7 +309,7 @@ class _ServerDetailPageState extends State<ServerDetailPage>
     ];
     children.addAll(ns.devices.map((e) => _buildNetSpeedItem(ns, e)));
     return RoundRectCard(Padding(
-      padding: const EdgeInsets.symmetric(vertical: 7),
+      padding: const EdgeInsets.symmetric(vertical: 7, horizontal: 17),
       child: Column(
         children: children,
       ),

lib/view/page/server/edit.dart

@@ -8,6 +8,7 @@ import 'package:toolbox/data/model/server/server_private_info.dart';
 import 'package:toolbox/data/provider/private_key.dart';
 import 'package:toolbox/data/provider/server.dart';
 import 'package:toolbox/data/res/color.dart';
+import 'package:toolbox/data/store/private_key.dart';
 import 'package:toolbox/locator.dart';
 import 'package:toolbox/view/page/private_key/edit.dart';
 import 'package:toolbox/view/widget/input_decoration.dart';
@@ -34,7 +35,7 @@ class _ServerEditPageState extends State<ServerEditPage> with AfterLayoutMixin {
   bool usePublicKey = false;
 
   int _pubKeyIndex = -1;
-  late PrivateKeyInfo _keyInfo;
+  PrivateKeyInfo? _keyInfo;
 
   @override
   void initState() {
@@ -188,10 +189,15 @@ class _ServerEditPageState extends State<ServerEditPage> with AfterLayoutMixin {
           if (portController.text == '') {
             portController.text = '22';
           }
+
+          if (widget.spi != null && widget.spi!.pubKeyId != null) {
+            _keyInfo ??= locator<PrivateKeyStore>().get(widget.spi!.pubKeyId!);
+          }
+
           final authorization = usePublicKey
               ? {
-                  "privateKey": _keyInfo.privateKey,
+                  "privateKey": _keyInfo!.privateKey,
-                  "passphrase": _keyInfo.password
+                  "passphrase": _keyInfo!.password
                 }
               : passwordController.text;
           final spi = ServerPrivateInfo(
@@ -200,7 +206,7 @@ class _ServerEditPageState extends State<ServerEditPage> with AfterLayoutMixin {
               port: int.parse(portController.text),
               user: usernameController.text,
               authorization: authorization,
-              pubKeyId: usePublicKey ? _keyInfo.id : null);
+              pubKeyId: usePublicKey ? _keyInfo!.id : null);
 
           if (widget.spi == null) {
             _serverProvider.addServer(spi);

lib/view/page/server/tab.dart

@@ -1,13 +1,17 @@
 import 'package:after_layout/after_layout.dart';
 import 'package:circle_chart/circle_chart.dart';
+import 'package:dropdown_button2/dropdown_button2.dart';
 import 'package:flutter/material.dart';
 import 'package:get_it/get_it.dart';
 import 'package:marquee/marquee.dart';
 import 'package:provider/provider.dart';
 import 'package:pull_to_refresh/pull_to_refresh.dart';
 import 'package:toolbox/core/route.dart';
+import 'package:toolbox/core/utils.dart';
+import 'package:toolbox/data/model/app/menu_item.dart';
 import 'package:toolbox/data/model/server/server.dart';
 import 'package:toolbox/data/model/server/server_connection_state.dart';
+import 'package:toolbox/data/model/server/server_private_info.dart';
 import 'package:toolbox/data/model/server/server_status.dart';
 import 'package:toolbox/data/provider/server.dart';
 import 'package:toolbox/data/res/color.dart';
@@ -15,10 +19,11 @@ import 'package:toolbox/data/store/setting.dart';
 import 'package:toolbox/locator.dart';
 import 'package:toolbox/view/page/server/detail.dart';
 import 'package:toolbox/view/page/server/edit.dart';
+import 'package:toolbox/view/page/snippet/list.dart';
+import 'package:toolbox/view/widget/round_rect_card.dart';
 
 class ServerPage extends StatefulWidget {
-  final TabController tabController;
+  const ServerPage({Key? key}) : super(key: key);
-  const ServerPage(this.tabController, {Key? key}) : super(key: key);
 
   @override
   _ServerPageState createState() => _ServerPageState();
@@ -46,9 +51,6 @@ class _ServerPageState extends State<ServerPage>
     _media = MediaQuery.of(context);
     _theme = Theme.of(context);
     _primaryColor = primaryColor;
-    if (widget.tabController.index == 0) {
-        FocusScope.of(context).unfocus();
-      }
   }
 
   @override
@@ -65,15 +67,19 @@ class _ServerPageState extends State<ServerPage>
           ),
         );
       }
-      return SingleChildScrollView(
+      return ListView.separated(
-          padding: const EdgeInsets.symmetric(horizontal: 7),
+        padding: const EdgeInsets.all(7),
-          child: Column(
+        itemBuilder: (ctx, idx) {
-            children: [
+          if (idx == pro.servers.length) {
-              const SizedBox(height: 13),
+            return SizedBox(height: _media.padding.bottom);
-              ...pro.servers.map((e) => _buildEachServerCard(e)),
+          }
-              SizedBox(height: _media.padding.bottom),
+          return _buildEachServerCard(pro.servers[idx]);
-            ],
+        },
-          ));
+        itemCount: pro.servers.length + 1,
+        separatorBuilder: (_, __) => const SizedBox(
+          height: 3,
+        ),
+      );
     });
     return Scaffold(
       body: autoUpdate
@@ -98,8 +104,8 @@ class _ServerPageState extends State<ServerPage>
   }
 
   Widget _buildEachServerCard(ServerInfo si) {
-    return Card(
+    return RoundRectCard(
-      child: InkWell(
+      InkWell(
         onLongPress: () => AppRoute(
                 ServerEditPage(
                   spi: si.info,
@@ -109,7 +115,7 @@ class _ServerPageState extends State<ServerPage>
         child: Padding(
             padding: const EdgeInsets.all(13),
             child: _buildRealServerCard(
-                si.status, si.info.name, si.connectionState)),
+                si.status, si.info.name, si.connectionState, si.info)),
         onTap: () => AppRoute(ServerDetailPage('${si.info.ip}:${si.info.port}'),
                 'server detail page')
             .go(context),
@@ -117,8 +123,8 @@ class _ServerPageState extends State<ServerPage>
     );
   }
 
-  Widget _buildRealServerCard(
+  Widget _buildRealServerCard(ServerStatus ss, String serverName,
-      ServerStatus ss, String serverName, ServerConnectionState cs) {
+      ServerConnectionState cs, ServerPrivateInfo spi) {
     final rootDisk =
         ss.disk.firstWhere((element) => element.mountLocation == '/');
 
@@ -132,29 +138,111 @@ class _ServerPageState extends State<ServerPage>
     return Column(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [
-        Row(
+        Padding(
-          mainAxisAlignment: MainAxisAlignment.spaceBetween,
+          padding: const EdgeInsets.symmetric(horizontal: 7),
-          children: [
+          child: Row(
-            Text(
+            mainAxisAlignment: MainAxisAlignment.spaceBetween,
-              serverName,
+            children: [
-              style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 12),
+              Row(
-              textScaleFactor: 1.0,
+                children: [
-            ),
+                  Text(
-            hasError
+                    serverName,
-                ? ConstrainedBox(
+                    style: const TextStyle(
-                    constraints: BoxConstraints(
+                        fontWeight: FontWeight.bold, fontSize: 12),
-                        maxWidth: _media.size.width * 0.57, maxHeight: 15),
+                    textScaleFactor: 1.0,
-                    child: Marquee(
+                  ),
-                        accelerationDuration: const Duration(seconds: 3),
+                  const Icon(
-                        accelerationCurve: Curves.linear,
+                    Icons.keyboard_arrow_right,
-                        decelerationDuration: const Duration(seconds: 3),
+                    size: 17,
-                        decelerationCurve: Curves.linear,
+                    color: Colors.grey,
-                        text: topRightStr,
-                        textScaleFactor: 1.0,
-                        style: style),
                   )
-                : Text(topRightStr, style: style, textScaleFactor: 1.0),
+                ],
-          ],
+              ),
+              Row(
+                children: [
+                  hasError
+                      ? ConstrainedBox(
+                          constraints: BoxConstraints(
+                              maxWidth: _media.size.width * 0.57,
+                              maxHeight: 15),
+                          child: Marquee(
+                              accelerationDuration: const Duration(seconds: 3),
+                              accelerationCurve: Curves.linear,
+                              decelerationDuration: const Duration(seconds: 3),
+                              decelerationCurve: Curves.linear,
+                              text: topRightStr,
+                              textScaleFactor: 1.0,
+                              style: style),
+                        )
+                      : Text(topRightStr, style: style, textScaleFactor: 1.0),
+                  DropdownButtonHideUnderline(
+                    child: DropdownButton2(
+                      customButton: const Padding(
+                        padding: EdgeInsets.only(left: 7),
+                        child: Icon(
+                          Icons.more_vert,
+                          size: 17,
+                        ),
+                      ),
+                      customItemsIndexes: const [3],
+                      customItemsHeight: 8,
+                      items: [
+                        ...MenuItems.firstItems.map(
+                          (item) => DropdownMenuItem<MenuItem>(
+                            value: item,
+                            child: MenuItems.buildItem(item),
+                          ),
+                        ),
+                        const DropdownMenuItem<Divider>(
+                            enabled: false, child: Divider()),
+                        ...MenuItems.secondItems.map(
+                          (item) => DropdownMenuItem<MenuItem>(
+                            value: item,
+                            child: MenuItems.buildItem(item),
+                          ),
+                        ),
+                      ],
+                      onChanged: (value) {
+                        final item = value as MenuItem;
+                        switch (item) {
+                          case MenuItems.apt:
+                          case MenuItems.sftp:
+                            showSnackBar(
+                                context, const Text('Now is not supported'));
+                            break;
+                          case MenuItems.snippet:
+                            AppRoute(
+                                    SnippetListPage(
+                                      spi: spi,
+                                    ),
+                                    'snippet list')
+                                .go(context);
+                            break;
+                          case MenuItems.edit:
+                            AppRoute(
+                                    ServerEditPage(
+                                      spi: spi,
+                                    ),
+                                    'Edit server info page')
+                                .go(context);
+                            break;
+                        }
+                      },
+                      itemHeight: 37,
+                      itemPadding: const EdgeInsets.only(left: 17, right: 17),
+                      dropdownWidth: 160,
+                      dropdownPadding: const EdgeInsets.symmetric(vertical: 7),
+                      dropdownDecoration: BoxDecoration(
+                        borderRadius: BorderRadius.circular(7),
+                      ),
+                      dropdownElevation: 8,
+                      offset: const Offset(0, 8),
+                    ),
+                  ),
+                ],
+              )
+            ],
+          ),
         ),
         const SizedBox(
           height: 17,
@@ -202,7 +290,19 @@ class _ServerPageState extends State<ServerPage>
       case ServerConnectionState.disconnected:
         return 'Disconnected';
       case ServerConnectionState.connected:
-        return temp == '' ? (upTime == '' ? 'Loading...' : upTime) : temp;
+        if (temp == '') {
+          if (upTime == '') {
+            return 'Loading...';
+          } else {
+            return upTime;
+          }
+        } else {
+          if (upTime == '') {
+            return temp;
+          } else {
+            return '$temp | $upTime';
+          }
+        }
       case ServerConnectionState.connecting:
         return 'Connecting...';
       case ServerConnectionState.failed:

lib/view/page/setting.dart

@@ -6,6 +6,7 @@ import 'package:toolbox/data/provider/app.dart';
 import 'package:toolbox/data/provider/server.dart';
 import 'package:toolbox/data/res/build_data.dart';
 import 'package:toolbox/data/res/color.dart';
+import 'package:toolbox/data/res/padding.dart';
 import 'package:toolbox/data/res/tab.dart';
 import 'package:toolbox/data/store/setting.dart';
 import 'package:toolbox/locator.dart';
@@ -77,7 +78,7 @@ class _SettingPageState extends State<SettingPage> {
         display = 'Current: v1.0.${BuildData.build}';
       }
       return ListTile(
-          contentPadding: EdgeInsets.zero,
+          contentPadding: roundRectCardPadding,
           trailing: const Icon(Icons.keyboard_arrow_right),
           title: Text(
             display,
@@ -90,8 +91,8 @@ class _SettingPageState extends State<SettingPage> {
 
   Widget _buildUpdateInterval() {
     return ExpansionTile(
-      tilePadding: EdgeInsets.zero,
+      tilePadding: roundRectCardPadding,
-      childrenPadding: EdgeInsets.zero,
+      childrenPadding: roundRectCardPadding,
       textColor: priColor,
       title: const Text(
         'Server status update interval',
@@ -142,8 +143,8 @@ class _SettingPageState extends State<SettingPage> {
   Widget _buildAppColorPreview() {
     return ExpansionTile(
         textColor: priColor,
-        tilePadding: EdgeInsets.zero,
+        tilePadding: roundRectCardPadding,
-        childrenPadding: EdgeInsets.zero,
+        childrenPadding: roundRectCardPadding,
         children: [
           _buildAppColorPicker(priColor),
           _buildColorPickerConfirmBtn()
@@ -183,8 +184,8 @@ class _SettingPageState extends State<SettingPage> {
   Widget _buildLaunchPage() {
     return ExpansionTile(
       textColor: priColor,
-      tilePadding: EdgeInsets.zero,
+      tilePadding: roundRectCardPadding,
-      childrenPadding: EdgeInsets.zero,
+      childrenPadding: roundRectCardPadding,
       title: const Text(
         'Launch page',
         style: textStyle,

lib/view/page/snippet/list.dart

@@ -2,23 +2,26 @@ import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'package:toolbox/core/route.dart';
 import 'package:toolbox/core/utils.dart';
+import 'package:toolbox/data/model/server/server_private_info.dart';
 import 'package:toolbox/data/model/server/snippet.dart';
 import 'package:toolbox/data/provider/server.dart';
 import 'package:toolbox/data/provider/snippet.dart';
 import 'package:toolbox/data/res/color.dart';
+import 'package:toolbox/data/res/padding.dart';
 import 'package:toolbox/locator.dart';
 import 'package:toolbox/view/page/snippet/edit.dart';
 import 'package:toolbox/view/widget/round_rect_card.dart';
 
 class SnippetListPage extends StatefulWidget {
-  const SnippetListPage({Key? key}) : super(key: key);
+  const SnippetListPage({Key? key, this.spi}) : super(key: key);
+  final ServerPrivateInfo? spi;
 
   @override
   _SnippetListPageState createState() => _SnippetListPageState();
 }
 
 class _SnippetListPageState extends State<SnippetListPage> {
-  int _selectedIndex = 0;
+  late ServerPrivateInfo _selectedIndex;
 
   final _textStyle = TextStyle(color: primaryColor);
   @override
@@ -45,32 +48,43 @@ class _SnippetListPageState extends State<SnippetListPage> {
                 itemCount: key.snippets.length,
                 itemExtent: 57,
                 itemBuilder: (context, idx) {
-                  return RoundRectCard(Row(
+                  return RoundRectCard(Padding(
-                    crossAxisAlignment: CrossAxisAlignment.center,
+                    padding: roundRectCardPadding,
-                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                    child: Row(
-                    children: [
+                      crossAxisAlignment: CrossAxisAlignment.center,
-                      Text(
+                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                        key.snippets[idx].name,
+                      children: [
-                        textAlign: TextAlign.center,
+                        Text(
-                      ),
+                          key.snippets[idx].name,
-                      Row(children: [
+                          textAlign: TextAlign.center,
-                        TextButton(
+                        ),
-                            onPressed: () => AppRoute(
+                        Row(children: [
-                                    SnippetEditPage(snippet: key.snippets[idx]),
+                          TextButton(
-                                    'snippet edit page')
+                              onPressed: () => AppRoute(
-                                .go(context),
+                                      SnippetEditPage(
-                            child: Text(
+                                          snippet: key.snippets[idx]),
-                              'Edit',
+                                      'snippet edit page')
-                              style: _textStyle,
+                                  .go(context),
-                            )),
+                              child: Text(
-                        TextButton(
+                                'Edit',
-                            onPressed: () => _showRunDialog(key.snippets[idx]),
+                                style: _textStyle,
-                            child: Text(
+                              )),
-                              'Run',
+                          TextButton(
-                              style: _textStyle,
+                              onPressed: () {
-                            ))
+                                final snippet = key.snippets[idx];
-                      ])
+                                if (widget.spi == null) {
-                    ],
+                                  _showRunDialog(snippet);
+                                  return;
+                                }
+                                run(context, snippet);
+                              },
+                              child: Text(
+                                'Run',
+                                style: _textStyle,
+                              ))
+                        ])
+                      ],
+                    ),
                   ));
                 })
             : const Center(child: Text('No saved snippets.'));
@@ -84,6 +98,7 @@ class _SnippetListPageState extends State<SnippetListPage> {
       if (provider.servers.isEmpty) {
         return const Text('No server available');
       }
+      _selectedIndex = provider.servers.first.info;
       return SizedBox(
           height: 111,
           child: Stack(children: [
@@ -104,7 +119,8 @@ class _SnippetListPageState extends State<SnippetListPage> {
               itemExtent: 37,
               diameterRatio: 1.2,
               controller: FixedExtentScrollController(initialItem: 0),
-              onSelectedItemChanged: (idx) => _selectedIndex = idx,
+              onSelectedItemChanged: (idx) =>
+                  _selectedIndex = provider.servers[idx].info,
               physics: const FixedExtentScrollPhysics(),
               childDelegate: ListWheelChildBuilderDelegate(
                   builder: (context, index) => Center(
@@ -118,22 +134,24 @@ class _SnippetListPageState extends State<SnippetListPage> {
           ]));
     }), [
       TextButton(
-          onPressed: () async {
+          onPressed: () async => run(context, snippet),
-            final result = await locator<ServerProvider>()
-                .runSnippet(_selectedIndex, snippet);
-            if (result != null) {
-              showRoundDialog(context, 'Result',
-                  Text(result, style: const TextStyle(fontSize: 13)), [
-                TextButton(
-                    onPressed: () => Navigator.of(context).pop(),
-                    child: const Text('Close'))
-              ]);
-            }
-          },
           child: const Text('Run')),
       TextButton(
           onPressed: () => Navigator.of(context).pop(),
           child: const Text('Cancel')),
     ]);
   }
+
+  Future<void> run(BuildContext context, Snippet snippet) async {
+    final result = await locator<ServerProvider>()
+        .runSnippet(widget.spi ?? _selectedIndex, snippet);
+    if (result != null) {
+      showRoundDialog(context, 'Result',
+          Text(result, style: const TextStyle(fontSize: 13)), [
+        TextButton(
+            onPressed: () => Navigator.of(context).pop(),
+            child: const Text('Close'))
+      ]);
+    }
+  }
 }

lib/view/widget/input_field.dart

@@ -1,9 +1,10 @@
 import 'package:flutter/material.dart';
+import 'package:toolbox/view/widget/round_rect_card.dart';
 
 Widget buildInput(BuildContext context, TextEditingController controller,
     {int maxLines = 20, String? hint}) {
-  return Card(
+  return RoundRectCard(
-    child: TextField(
+    TextField(
       maxLines: maxLines,
       decoration: InputDecoration(
           fillColor: Theme.of(context).cardColor,

lib/view/widget/round_rect_card.dart

@@ -8,11 +8,8 @@ class RoundRectCard extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Card(
-      child: Padding(
+      child: child,
-        padding: const EdgeInsets.symmetric(horizontal: 17),
+      clipBehavior: Clip.antiAlias,
-        child: child,
-      ),
-      margin: const EdgeInsets.symmetric(vertical: 7),
       shape: const RoundedRectangleBorder(
           borderRadius: BorderRadius.all(Radius.circular(17))),
     );

make.dart

@@ -68,7 +68,7 @@ Future<void> updateBuildData() async {
 }
 
 void dartFormat() {
-  final result = Process.runSync('dart', ['format', './*.dart']);
+  final result = Process.runSync('dart', ['format', '.']);
   print(result.stdout);
   if (result.exitCode != 0) {
     print(result.stderr);

pubspec.lock

@@ -14,7 +14,7 @@ packages:
       name: archive
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "3.1.8"
+    version: "3.1.11"
   args:
     dependency: transitive
     description:
@@ -28,7 +28,7 @@ packages:
       name: asn1lib
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "1.0.3"
+    version: "1.1.0"
   async:
     dependency: transitive
     description:
@@ -137,7 +137,7 @@ packages:
       name: dartssh2
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.3.1-pre"
+    version: "2.4.4"
   dio:
     dependency: "direct main"
     description:
@@ -145,6 +145,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "4.0.4"
+  dropdown_button2:
+    dependency: "direct main"
+    description:
+      name: dropdown_button2
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.1.1"
   extended_image:
     dependency: "direct main"
     description:
@@ -158,7 +165,7 @@ packages:
       name: extended_image_library
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "3.1.1"
+    version: "3.1.2"
   fading_edge_scrollview:
     dependency: transitive
     description:
@@ -192,6 +199,13 @@ packages:
     description: flutter
     source: sdk
     version: "0.0.0"
+  flutter_advanced_drawer:
+    dependency: "direct main"
+    description:
+      name: flutter_advanced_drawer
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.3.0"
   flutter_icmp_ping:
     dependency: transitive
     description:
@@ -285,7 +299,7 @@ packages:
       name: image
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "3.1.0"
+    version: "3.1.1"
   js:
     dependency: transitive
     description:
@@ -321,6 +335,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "0.12.11"
+  material_color_utilities:
+    dependency: transitive
+    description:
+      name: material_color_utilities
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "0.1.3"
   meta:
     dependency: transitive
     description:
@@ -369,28 +390,28 @@ packages:
       name: path_provider_linux
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.1.4"
+    version: "2.1.5"
   path_provider_macos:
     dependency: transitive
     description:
       name: path_provider_macos
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.0.4"
+    version: "2.0.5"
   path_provider_platform_interface:
     dependency: transitive
     description:
       name: path_provider_platform_interface
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.0.2"
+    version: "2.0.3"
   path_provider_windows:
     dependency: transitive
     description:
       name: path_provider_windows
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.0.4"
+    version: "2.0.5"
   pedantic:
     dependency: transitive
     description:
@@ -507,7 +528,7 @@ packages:
       name: test_api
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "0.4.3"
+    version: "0.4.8"
   typed_data:
     dependency: transitive
     description:
@@ -528,35 +549,35 @@ packages:
       name: url_launcher
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "6.0.17"
+    version: "6.0.18"
   url_launcher_android:
     dependency: transitive
     description:
       name: url_launcher_android
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "6.0.13"
+    version: "6.0.14"
   url_launcher_ios:
     dependency: transitive
     description:
       name: url_launcher_ios
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "6.0.13"
+    version: "6.0.14"
   url_launcher_linux:
     dependency: transitive
     description:
       name: url_launcher_linux
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.0.2"
+    version: "2.0.3"
   url_launcher_macos:
     dependency: transitive
     description:
       name: url_launcher_macos
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.0.2"
+    version: "2.0.3"
   url_launcher_platform_interface:
     dependency: transitive
     description:
@@ -570,7 +591,7 @@ packages:
       name: url_launcher_web
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.0.5"
+    version: "2.0.6"
   url_launcher_windows:
     dependency: transitive
     description:
@@ -578,13 +599,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "2.0.2"
-  validators:
-    dependency: transitive
-    description:
-      name: validators
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "3.0.0"
   vector_math:
     dependency: transitive
     description:
@@ -598,14 +612,14 @@ packages:
       name: win32
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.3.3"
+    version: "2.3.11"
   xdg_directories:
     dependency: transitive
     description:
       name: xdg_directories
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "0.2.0"
+    version: "0.2.0+1"
   xml:
     dependency: transitive
     description:

pubspec.yaml

@@ -56,6 +56,8 @@ dependencies:
   marquee: ^2.2.0
   dart_ping: ^6.1.1
   dart_ping_ios: ^1.0.0
+  dropdown_button2: ^1.1.1
+  flutter_advanced_drawer: ^1.3.0
 
 
 dev_dependencies: