[General]: Field not getting unfocused for modalBottomSheets or AlertDialogs if was in focused already

[mhmzdev]

Is there an existing issue for this?

• I have searched the existing issues

Package/Plugin version

9.5.0

Platforms

• Android
• iOS
• Linux
• MacOS
• Web
• Windows

Flutter doctor

Flutter doctor

[✓] Flutter (Channel stable, 3.24.0, on macOS 15.1.1 24B91 darwin-arm64, locale en-PK)
    • Flutter version 3.24.0 on channel stable at /Users/hamza/Development/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 80c2e84975 (4 months ago), 2024-07-30 23:06:49 +0700
    • Engine revision b8800d88be
    • Dart version 3.5.0
    • DevTools version 2.37.2

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/hamza/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • ANDROID_HOME = /Users/hamza/Library/Android/sdk
    • ANDROID_SDK_ROOT = /Users/hamza/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.10+0-17.0.10b1087.21-11609105)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 16.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 16B40
    • CocoaPods version 1.16.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2024.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.10+0-17.0.10b1087.21-11609105)

[✓] VS Code (version 1.95.3)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.100.0

[✓] Connected device (4 available)
    • iPhone 16 Pro (mobile)          • 73AC4DBE-6D02-474D-ADB8-DCF39EA31BE1 • ios            • com.apple.CoreSimulator.SimRuntime.iOS-18-1 (simulator)
    • macOS (desktop)                 • macos                                • darwin-arm64   • macOS 15.1.1 24B91 darwin-arm64
    • Mac Designed for iPad (desktop) • mac-designed-for-ipad                • darwin         • macOS 15.1.1 24B91 darwin-arm64
    • Chrome (web)                    • chrome                               • web-javascript • Google Chrome 131.0.6778.86

[✓] Network resources
    • All expected network resources are available.

• No issues found!

Minimal code example

Code sample

Align(
  alignment: Alignment.centerRight,
  child: TouchableOpacity(
    onTap: () {
      FocusScope.of(context).unfocus();
      showModalBottomSheet(
        context: context,
        backgroundColor: Colors.transparent,
        isScrollControlled: true,
        enableDrag: false,
        builder: (_) {
          return Padding(
            padding: context.modalBottomKeyboard,
            child: const _ResetPasswordModal(),
          );
        },
      );
    },
    child: Text(
      'Forgot password?',
      style: AppText.b2 + FontWeight.bold + AppTheme.c.secondary,
    ),
  ),
),

Current Behavior

Focus on any text field, the keyboard shows up. Now open any modalBottomSheet or showDialog, once they are closed the field goes back in focus causing the keyboard to come back to focus.

Expected Behavior

The field should be unfocused if any other entity shows up on the screen and show remained unfocued afterwards

Steps To Reproduce

1. Android or iOS
2. Tap on any text field so that it becomes in focus i.e. keyboard shows up
3. I've used forgot password button but you can use any onTap or onPressed and try to open a modal
4. The modal opens, and the keyboard exists
5. Now, exit the modal by any means
6. The keyboard shows up again

Same happens with alert dialog box opened via showDialog method

Aditional information

Screen.Recording.2024-12-02.at.2.44.01.PM.mov

[deandreamatias]

Related with #1297

[deandreamatias]

Hi!
I need a minimal code example to can execute:

• Without external packages and dependencies
• Without refereces of imports
• With only Flutter Material or Cupertino widgets and FormBuilder widgets
• Starting from main Dart method

Example:

import 'package:flutter/material.dart';
import 'package:flutter_form_builder/flutter_form_builder.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:form_builder_validators/form_builder_validators.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter FormBuilder Example',
      debugShowCheckedModeBanner: false,
      localizationsDelegates: const [
        FormBuilderLocalizations.delegate,
        ...GlobalMaterialLocalizations.delegates,
        GlobalWidgetsLocalizations.delegate,
      ],
      supportedLocales: FormBuilderLocalizations.supportedLocales,
      home: const _ExamplePage(),
    );
  }
}

class _ExamplePage extends StatefulWidget {
  const _ExamplePage();

  @override
  State<_ExamplePage> createState() => _ExamplePageState();
}

class _ExamplePageState extends State<_ExamplePage> {
  final _formKey = GlobalKey<FormBuilderState>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: FormBuilder(
        key: _formKey,
        child: Column(
          children: [
            FormBuilderTextField(
              name: 'full_name',
              decoration: const InputDecoration(labelText: 'Full Name'),
              validator: FormBuilderValidators.compose([
                FormBuilderValidators.required(),
              ]),
            ),
            const SizedBox(height: 10),
            ElevatedButton(
              onPressed: () {
                _formKey.currentState?.saveAndValidate();
                debugPrint(_formKey.currentState?.value.toString());
              },
              child: const Text('Print'),
            )
          ],
        ),
      ),
    );
  }
}

Thanks a lot