I’m using the flutter_quill package to build a rich text editor in my Flutter app. The editor is wrapped inside a SliverFillRemaining widget to fill the remaining space. However, I’m facing an issue where, as the user types and the content grows, the editor does not automatically scroll to follow the newly added lines. Instead, the user has to manually scroll down to see their text.
Here’s the relevant code snippet:
import 'package:flutter/material.dart';
import 'package:flutter_quill/flutter_quill.dart' as quill;
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
useMaterial3: true,
),
home: const MyHomePage(title: ""),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: CustomScrollView(
slivers: [
SliverFillRemaining(
hasScrollBody: false,
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
color: Colors.purple,
child: buildQuillEditorWidget(),
),
),
),
],
),
);
}
}
Widget buildQuillEditorWidget() {
quill.QuillController bodyController = quill.QuillController.basic();
final ScrollController scrollController = ScrollController();
return quill.QuillEditor.basic(
controller: bodyController,
scrollController: scrollController,
configurations: const quill.QuillEditorConfigurations(
placeholder: "Body",
scrollPhysics: NeverScrollableScrollPhysics(),
),
);
}
Expected behavior
The editor should automatically scroll to bring the cursor into view as the user types new lines.