I have a chat screen where switching to the emoji keyboard on iOS causes the entire UI to freeze. On Android it works perfectly.
My chat screen layout:
Scaffold(
backgroundColor: AppConstants.offWhite,
extendBodyBehindAppBar: true,
appBar: IndividualChatAppBar(...),
body: SafeArea(
bottom: false,
child: Column(
children: [
Expanded(
child: BlocBuilder(
builder: (context, state) {
// messages list
},
),
),
BlocBuilder(
builder: (context, state) {
return MessageInputField(...);
},
),
SizedBox(height: MediaQuery.of(context).padding.bottom + 8),
],
),
),
)
My TextField inside MessageInputField:
TextField(
controller: _controller,
maxLines: null,
textCapitalization: TextCapitalization.sentences,
keyboardType: TextInputType.multiline,
scrollPadding: EdgeInsets.zero,
autocorrect: false,
enableSuggestions: false,
style: const TextStyle(fontSize: 15, color: Colors.black87),
decoration: InputDecoration(...),
)
Things I’ve tried (all reverted because they didn’t fix it):
-
resizeToAvoidBottomInset: false+ manualMediaQuery.viewInsets.bottompadding viaSizedBox -
WidgetsBindingObserver+didChangeMetrics()with 80ms debounce to track keyboard height -
Wrapping input in
SingleChildScrollView(physics: NeverScrollableScrollPhysics()) -
Isolating the input into a separate
StatefulWidgetto limit MediaQuery rebuilds -
SingleChildScrollView(reverse: true)withPadding(bottom: viewInsets.bottom)wrapping the input -
keyboardType: TextInputType.text— this actually broke Android multiline input so had to revert
Question:
Is this a known Flutter engine bug on iOS? Is there any workaround that actually works for a chat layout with a sticky input at the bottom?