[pve-devel] [PATCH pve_flutter_frontend 1/2] fix #7045: regression: avoid system intrusion from navigation bar

[Shan Shaji]

In the following commit(f263217) the `ColoredSafeArea` was removed.
However the system intrusion from the system bottom navigation bar was
causing issues. Inorder to fix the issue the wrap the body of the
guest's overview and options page with `SafeArea` widget.

For iOS set the bottom padding to false as it feels like there is a
background present under the bottom navigation indicator.

Signed-off-by: Shan Shaji <s.shaji at proxmox.com>
---
 lib/widgets/pve_config_list_tile.dart    |  5 +++--
 lib/widgets/pve_lxc_options_widget.dart  |  8 ++++++--
 lib/widgets/pve_lxc_overview.dart        |  8 ++++++--
 lib/widgets/pve_node_overview.dart       |  8 ++++++--
 lib/widgets/pve_qemu_options_widget.dart |  8 ++++++--
 lib/widgets/pve_qemu_overview.dart       | 10 +++++++---
 6 files changed, 34 insertions(+), 13 deletions(-)

diff --git a/lib/widgets/pve_config_list_tile.dart b/lib/widgets/pve_config_list_tile.dart
index 712ff1a..c937755 100644
--- a/lib/widgets/pve_config_list_tile.dart
+++ b/lib/widgets/pve_config_list_tile.dart
@@ -130,7 +130,8 @@ class _PveConfigEditorFormState<T> extends State<_PveConfigEditorForm<T>> {
 
   @override
   Widget build(BuildContext context) {
-    return Container(
+    return SafeArea(
+        child: Container(
       padding: const EdgeInsets.symmetric(horizontal: 12),
       child: Column(
         mainAxisSize: MainAxisSize.min,
@@ -164,6 +165,6 @@ class _PveConfigEditorFormState<T> extends State<_PveConfigEditorForm<T>> {
           const SizedBox(height: 8),
         ],
       ),
-    );
+    ),);
   }
 }
diff --git a/lib/widgets/pve_lxc_options_widget.dart b/lib/widgets/pve_lxc_options_widget.dart
index 4bd263e..21398d2 100644
--- a/lib/widgets/pve_lxc_options_widget.dart
+++ b/lib/widgets/pve_lxc_options_widget.dart
@@ -1,3 +1,5 @@
+import 'dart:io';
+
 import 'package:flutter/material.dart';
 import 'package:pve_flutter_frontend/bloc/pve_lxc_overview_bloc.dart';
 import 'package:pve_flutter_frontend/states/pve_lxc_overview_state.dart';
@@ -18,7 +20,9 @@ class PveLxcOptions extends StatelessWidget {
           if (config != null) {
             return Scaffold(
               appBar: AppBar(),
-              body: SingleChildScrollView(
+              body: SafeArea(
+                bottom: !Platform.isIOS,
+                child: SingleChildScrollView(
                 child: Column(
                   children: <Widget>[
                     ListTile(
@@ -114,7 +118,7 @@ class PveLxcOptions extends StatelessWidget {
                   ],
                 ),
               ),
-            );
+            ),);
           }
           return const Center(
             child: CircularProgressIndicator(),
diff --git a/lib/widgets/pve_lxc_overview.dart b/lib/widgets/pve_lxc_overview.dart
index 1148452..0f486d2 100644
--- a/lib/widgets/pve_lxc_overview.dart
+++ b/lib/widgets/pve_lxc_overview.dart
@@ -1,3 +1,5 @@
+import 'dart:io';
+
 import 'package:flutter/material.dart';
 import 'package:font_awesome_flutter/font_awesome_flutter.dart';
 import 'package:provider/provider.dart';
@@ -75,7 +77,9 @@ class PveLxcOverview extends StatelessWidget {
                 title: Text(config?.hostname ?? 'CT $guestID'),
               ),
               backgroundColor: Theme.of(context).colorScheme.surfaceContainer,
-              body: SingleChildScrollView(
+              body: SafeArea(
+                bottom: !Platform.isIOS,
+                child: SingleChildScrollView(
                 child: Column(
                   children: <Widget>[
                     PveGuestOverviewHeader(
@@ -258,7 +262,7 @@ class PveLxcOverview extends StatelessWidget {
                   ],
                 ),
               ),
-            );
+            ),);
           }),
     );
   }
diff --git a/lib/widgets/pve_node_overview.dart b/lib/widgets/pve_node_overview.dart
index f99ca53..f0583a3 100644
--- a/lib/widgets/pve_node_overview.dart
+++ b/lib/widgets/pve_node_overview.dart
@@ -1,3 +1,5 @@
+import 'dart:io';
+
 import 'package:flutter/material.dart';
 import 'package:font_awesome_flutter/font_awesome_flutter.dart';
 import 'package:provider/provider.dart';
@@ -60,7 +62,9 @@ class PveNodeOverview extends StatelessWidget {
             ),
           ),
           backgroundColor: Theme.of(context).colorScheme.surfaceContainer,
-          body: SingleChildScrollView(
+          body: SafeArea(
+            bottom: !Platform.isIOS,
+            child: SingleChildScrollView(
             child: Column(
               children: <Widget>[
                 if (rrd.isNotEmpty)
@@ -442,7 +446,7 @@ class PveNodeOverview extends StatelessWidget {
               ],
             ),
           ),
-        );
+        ),);
       },
     );
   }
diff --git a/lib/widgets/pve_qemu_options_widget.dart b/lib/widgets/pve_qemu_options_widget.dart
index f8cb000..0f0d46a 100644
--- a/lib/widgets/pve_qemu_options_widget.dart
+++ b/lib/widgets/pve_qemu_options_widget.dart
@@ -1,3 +1,5 @@
+import 'dart:io';
+
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'package:pve_flutter_frontend/bloc/pve_qemu_overview_bloc.dart';
@@ -26,7 +28,9 @@ class PveQemuOptions extends StatelessWidget {
                   onPressed: () => Navigator.of(context).pop(),
                 ),
               ),
-              body: SingleChildScrollView(
+              body: SafeArea(
+                bottom: !Platform.isIOS,
+                child: SingleChildScrollView(
                 child: Form(
                   key: _formKey,
                   onChanged: () {},
@@ -207,7 +211,7 @@ class PveQemuOptions extends StatelessWidget {
                   ),
                 ),
               ),
-            );
+            ),);
           }
           return const Center(
             child: CircularProgressIndicator(),
diff --git a/lib/widgets/pve_qemu_overview.dart b/lib/widgets/pve_qemu_overview.dart
index 15ab409..a80a58a 100644
--- a/lib/widgets/pve_qemu_overview.dart
+++ b/lib/widgets/pve_qemu_overview.dart
@@ -1,3 +1,5 @@
+import 'dart:io';
+
 import 'package:flutter/material.dart';
 import 'package:font_awesome_flutter/font_awesome_flutter.dart';
 import 'package:provider/provider.dart';
@@ -76,8 +78,10 @@ class PveQemuOverview extends StatelessWidget {
                 title: Text(config?.name ?? 'VM $guestID'),
               ),
               backgroundColor: Theme.of(context).colorScheme.surfaceContainer,
-              body: SingleChildScrollView(
-                  child: Column(
+              body: SafeArea(
+                bottom: !Platform.isIOS,
+                child: SingleChildScrollView(
+                    child: Column(
                 children: <Widget>[
                   PveGuestOverviewHeader(
                     background: !(status?.template ?? false)
@@ -242,7 +246,7 @@ class PveQemuOverview extends StatelessWidget {
                         ]),
                 ],
               )),
-            );
+            ),);
           }),
     );
   }
-- 
2.47.3