[BUG] Text Focus Problem (Flutter Web App)

[chrisDK1977]

When using a TextInput and the html-editor-enhanced once the Textinput has got focus you cannot type anything in the HTML-editor anymore and the TextInput will always get the focus.

When clicking on the bold icon or somehting else in the editor toolbar and than in the text-input-area it works.

SampleApp:

import 'package:flutter/material.dart';
import 'package:html_editor_enhanced/html_editor.dart';

void main() {
  runApp(const MyApp());
}

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

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'Flutter Demo',
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  late final TextEditingController textController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              Row(
                children: [
                  Expanded(
                    child: Padding(
                      padding: const EdgeInsets.all(5.0),
                      child: TextField(
                        controller: textController,
                        style: const TextStyle(fontWeight: FontWeight.bold),
                        onChanged: (val) => print(val), 
                      ),
                    ),
                  ),
                ],
              ),
              Expanded(
                child: HtmlEditor(controller: HtmlEditorController()),
              ),
            ]
        ),
      ),
    );
  }
}

[chrisDK1977]

adding

onFocus: () {
// Clear focus from other widgets
FocusScope.of(context).requestFocus(FocusNode());
// Set focus back to the HtmlEditor
_controller.setFocus();
}

seems to make it better - after switching many times sometimes I cannont get the focus back on the textfield... but it is not happening always...

are ther any other tricks to solve the problem?

[hptigger]

Experiencing the same issue.

[hptigger]

Adding the onFocus callback as noted has sorted things out for me 👍
Thank you @chrisDK1977