Add padding for bottom little white tile

- make the refresh interval setting makes effect immediately.
- auto stop/restart status update when app goto background/resume

lib/data/provider/server.dart

@@ -23,6 +23,8 @@ class ServerProvider extends BusyProvider {
   List<ServerInfo> _servers = [];
   List<ServerInfo> get servers => _servers;
 
+  Timer? _timer;
+
   final logger = Logger('ServerProvider');
 
   Memory get emptyMemory =>
@@ -95,11 +97,19 @@ class ServerProvider extends BusyProvider {
     final duration =
         locator<SettingStore>().serverStatusUpdateInterval.fetch()!;
     if (duration == 0) return;
-    Timer.periodic(Duration(seconds: duration), (_) async {
+    stopAutoRefresh();
+    _timer = Timer.periodic(Duration(seconds: duration), (_) async {
       await refreshData();
     });
   }
 
+  void stopAutoRefresh() {
+    if (_timer != null) {
+      _timer!.cancel();
+      _timer = null;
+    }
+  }
+
   void addServer(ServerPrivateInfo info) {
     _servers.add(genInfo(info));
     locator<ServerStore>().put(info);

lib/data/res/build_data.dart

@@ -2,9 +2,8 @@
 
 class BuildData {
   static const String name = "ToolBox";
-  static const int build = 65;
-  static const String engine =
-      "Flutter 2.8.1 • channel stable • https://github.com/flutter/flutter.git\nFramework • revision 77d935af4d (2 weeks ago) • 2021-12-16 08:37:33 -0800\nEngine • revision 890a5fca2e\nTools • Dart 2.15.1\n";
-  static const String buildAt = "2021-12-31 15:55:47.350456";
-  static const int modifications = 7;
+  static const int build = 70;
+  static const String engine = "Flutter 2.8.1 • channel stable • https://github.com/flutter/flutter.git\nFramework • revision 77d935af4d (3 weeks ago) • 2021-12-16 08:37:33 -0800\nEngine • revision 890a5fca2e\nTools • Dart 2.15.1\n";
+  static const String buildAt = "2022-01-03 14:58:50.087508";
+  static const int modifications = 2;
 }

lib/view/page/home.dart

@@ -31,16 +31,37 @@ class _MyHomePageState extends State<MyHomePage>
     with
         AutomaticKeepAliveClientMixin,
         SingleTickerProviderStateMixin,
-        AfterLayoutMixin {
+        AfterLayoutMixin,
+        WidgetsBindingObserver {
   final List<String> _tabs = ['Servers', 'En/Decode'];
   late final TabController _tabController;
+  late final ServerProvider _serverProvider;
 
   @override
   void initState() {
     super.initState();
+    _serverProvider = locator<ServerProvider>();
+    WidgetsBinding.instance?.addObserver(this);
     _tabController = TabController(length: _tabs.length, vsync: this);
   }
 
+  @override
+  void dispose() {
+    super.dispose();
+    WidgetsBinding.instance?.removeObserver(this);
+  }
+
+  @override
+  void didChangeAppLifecycleState(AppLifecycleState state) {
+    super.didChangeAppLifecycleState(state);
+    if (state == AppLifecycleState.paused) {
+      _serverProvider.stopAutoRefresh();
+    }
+    if (state == AppLifecycleState.resumed) {
+      _serverProvider.startAutoRefresh();
+    }
+  }
+
   @override
   Widget build(BuildContext context) {
     setTransparentNavigationBar(context);

lib/view/page/server/detail.dart

@@ -64,7 +64,8 @@ class _ServerDetailPageState extends State<ServerDetailPage>
           _buildCPUView(si.status),
           _buildDiskView(si.status),
           _buildMemView(si.status),
-          _buildNetView(si.status.netSpeed)
+          _buildNetView(si.status.netSpeed),
+          SizedBox(height: _media.padding.bottom),
         ],
       ),
     );
@@ -191,7 +192,11 @@ class _ServerDetailPageState extends State<ServerDetailPage>
     for (; value / 1024 > 1 && squareTimes < 3; squareTimes++) {
       value /= 1024;
     }
-    return '${value.toStringAsFixed(1)} ${suffix[squareTimes]}';
+    var finalValue = value.toStringAsFixed(1);
+    if (finalValue.endsWith('.0')) {
+      finalValue = finalValue.replaceFirst('.0', '');
+    }
+    return '$finalValue ${suffix[squareTimes]}';
   }
 
   Widget _buildMemView(ServerStatus ss) {
@@ -210,8 +215,8 @@ class _ServerDetailPageState extends State<ServerDetailPage>
               _buildMemExplain(convertMB(ss.memory.used), pColor),
               _buildMemExplain(
                   convertMB(ss.memory.cache), pColor.withAlpha(77)),
-              _buildMemExplain(
-                  convertMB(ss.memory.total - ss.memory.avail), progressColor.resolve(context))
+              _buildMemExplain(convertMB(ss.memory.total - ss.memory.used),
+                  progressColor.resolve(context))
             ],
           ),
           const SizedBox(
@@ -231,7 +236,7 @@ class _ServerDetailPageState extends State<ServerDetailPage>
                   // 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.cache / (ss.memory.total - ss.memory.used),
                   backgroundColor: progressColor.resolve(context),
                   color: pColor.withAlpha(77),
                 ),
@@ -243,7 +248,7 @@ class _ServerDetailPageState extends State<ServerDetailPage>
     ));
   }
 
-  Widget _buildMemExplain(String type, Color color) {
+  Widget _buildMemExplain(String value, Color color) {
     return Row(
       children: [
         Container(
@@ -252,7 +257,12 @@ class _ServerDetailPageState extends State<ServerDetailPage>
           width: 11,
         ),
         const SizedBox(width: 4),
-        Text(type, style: style11, textScaleFactor: 1.0)
+        Text(
+          value,
+          style: style11,
+          textScaleFactor: 1.0,
+          textAlign: TextAlign.center,
+        )
       ],
     );
   }

lib/view/page/server/tab.dart

@@ -67,7 +67,7 @@ class _ServerPageState extends State<ServerPage>
         child: AnimationLimiter(
             child: Column(
                 children: AnimationConfiguration.toStaggeredList(
-          duration: const Duration(milliseconds: 777),
+          duration: const Duration(milliseconds: 377),
           childAnimationBuilder: (widget) => SlideAnimation(
             verticalOffset: 77.0,
             child: FadeInAnimation(
@@ -76,7 +76,8 @@ class _ServerPageState extends State<ServerPage>
           ),
           children: [
             const SizedBox(height: 13),
-            ...pro.servers.map((e) => _buildEachServerCard(e))
+            ...pro.servers.map((e) => _buildEachServerCard(e)),
+            SizedBox(height: _media.padding.bottom),
           ],
         ))),
       );
@@ -131,7 +132,7 @@ class _ServerPageState extends State<ServerPage>
 
     final topRightStr =
         getTopRightStr(cs, ss.cpu2Status.temp, ss.uptime, ss.failedInfo);
-    final hasError = cs == ServerConnectionState.failed;
+    final hasError = cs == ServerConnectionState.failed && ss.failedInfo != null;
     final style = TextStyle(
         color: _theme.textTheme.bodyText1!.color!.withAlpha(100), fontSize: 11);
 
@@ -155,7 +156,9 @@ class _ServerPageState extends State<ServerPage>
                         accelerationCurve: Curves.linear,
                         decelerationDuration: const Duration(seconds: 3),
                         decelerationCurve: Curves.linear,
-                        text: topRightStr, textScaleFactor: 1.0, style: style),
+                        text: topRightStr,
+                        textScaleFactor: 1.0,
+                        style: style),
                   )
                 : Text(topRightStr, style: style, textScaleFactor: 1.0),
           ],

lib/view/page/setting.dart

@@ -3,6 +3,7 @@ import 'package:flutter_material_color_picker/flutter_material_color_picker.dart
 import 'package:provider/provider.dart';
 import 'package:toolbox/core/update.dart';
 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/store/setting.dart';
@@ -22,6 +23,7 @@ class _SettingPageState extends State<SettingPage> {
   double _intervalValue = 0;
   late Color priColor;
   static const textStyle = TextStyle(fontSize: 14);
+  late final ServerProvider _serverProvider;
 
   @override
   void didChangeDependencies() {
@@ -32,6 +34,7 @@ class _SettingPageState extends State<SettingPage> {
   @override
   void initState() {
     super.initState();
+    _serverProvider = locator<ServerProvider>();
     _store = locator<SettingStore>();
     _intervalValue = _store.serverStatusUpdateInterval.fetch()!.toDouble();
   }
@@ -88,7 +91,7 @@ class _SettingPageState extends State<SettingPage> {
         textAlign: TextAlign.start,
       ),
       subtitle: const Text(
-        'Will take effect the next time app launches.',
+        'Will take effect immediately.',
         style: TextStyle(color: Colors.grey),
       ),
       trailing: Text('${_intervalValue.toInt()} s'),
@@ -104,8 +107,10 @@ class _SettingPageState extends State<SettingPage> {
               _intervalValue = newValue;
             });
           },
-          onChangeEnd: (val) =>
-              _store.serverStatusUpdateInterval.put(val.toInt()),
+          onChangeEnd: (val) {
+            _store.serverStatusUpdateInterval.put(val.toInt());
+            _serverProvider.startAutoRefresh();
+          },
           label: '${_intervalValue.toInt()} seconds',
           divisions: 10,
         ),