[pve-devel] [PATCH pve-flutter-frontend] fix text selection theme

[pve-devel] [PATCH pve-flutter-frontend] fix text selection theme

[Dominik Csapak]

by default, flutter derives the text selection theme from the global
MaterialApp defined themes primary color, which is problematic in our
case, since we often have the same primary color as background for text
fields. This resulted in the cursorColor/selectionHandleColor to be the
same as the background, making them invisible.

Fix it by creating a manual textSelectionTheme with colors that properly
contrast the background. (The color works well for both light and dark mode)

The selectionHandleColor is modifed with an opacity of 0.4 like flutter
does by default.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 lib/main.dart | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/lib/main.dart b/lib/main.dart
index d3709f9..0245552 100644
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -134,6 +134,11 @@ class MyApp extends StatelessWidget {
             backgroundColor: ProxmoxColors.supportBlue, // primary
             foregroundColor: Colors.white, // onPrimary
           ),
+          textSelectionTheme: TextSelectionThemeData(
+            selectionColor: ProxmoxColors.orange.withOpacity(0.4),
+            selectionHandleColor: ProxmoxColors.orange,
+            cursorColor: ProxmoxColors.orange,
+          ),
         ),
         darkTheme: ThemeData(
           colorScheme: ColorScheme.dark(
@@ -170,6 +175,11 @@ class MyApp extends StatelessWidget {
                 TextStyle(fontFamily: "Open Sans", fontWeight: FontWeight.w700),
           ),
           scaffoldBackgroundColor: ProxmoxColors.grey,
+          textSelectionTheme: TextSelectionThemeData(
+            selectionColor: ProxmoxColors.orange.withOpacity(0.4),
+            selectionHandleColor: ProxmoxColors.orange,
+            cursorColor: ProxmoxColors.orange,
+          ),
         ),
         builder: (context, child) {
           return StreamListener(
-- 
2.30.2

[pve-devel] applied: [PATCH pve-flutter-frontend] fix text selection theme

[Thomas Lamprecht]

Am 12/09/2022 um 11:24 schrieb Dominik Csapak:
> by default, flutter derives the text selection theme from the global
> MaterialApp defined themes primary color, which is problematic in our
> case, since we often have the same primary color as background for text
> fields. This resulted in the cursorColor/selectionHandleColor to be the
> same as the background, making them invisible.
> 
> Fix it by creating a manual textSelectionTheme with colors that properly
> contrast the background. (The color works well for both light and dark mode)
> 
> The selectionHandleColor is modifed with an opacity of 0.4 like flutter
> does by default.
> 
> Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
> ---
>  lib/main.dart | 10 ++++++++++
>  1 file changed, 10 insertions(+)
> 
>

applied, thanks!