Flutter scrollbar on textfield - flutter

Question

I have full screen TextField that grow in size when the user added more lines/text. I want to add scrollbar for the user to know the size the TextField and where is he.
This is the code the my screen and TextField:
import 'package:flutter/material.dart';
class TextEditor extends StatefulWidget {
TextEditor();
#override
_TextEditorState createState() => _TextEditorState();
}
class _TextEditorState extends State<TextEditor> {
TextEditingController _editTextController = TextEditingController();
#override
Widget build(BuildContext context) {
var scaffold = Scaffold(
appBar: AppBar(
leading: IconButton(
icon: Icon(Icons.arrow_back),
onPressed: () => _backButton(),
),
title: Text("File name"),
),
body: _buildTextEditor(),
resizeToAvoidBottomInset: true,
);
return scaffold;
}
Widget _buildTextEditor() {
return TextField(
autofocus: true,
keyboardType: TextInputType.multiline,
maxLines: null,
autocorrect: true,
onChanged: (s) => {},
decoration: InputDecoration(
border: InputBorder.none,
isDense: true,
),
);
}
_backButton() {}
}
This is what I have
This is what I want, the scrollbar on the right
I could not find a way to do this and I don't an expert on Flutter to know how to do this on my own

Answer 1

Fortunately, the TextField widget accepts a scroll controller. This can be used to generate a scrollbar. See the example below.
TextEditingController _editTextController = TextEditingController();
// Initialise a scroll controller.
ScrollController _scrollController = ScrollController();
Then, add it to the TextField widget and wrap this widget in a Scrollbar!
return Scrollbar(
controller: _scrollController,
isAlwaysShown: true,
child: TextField(
scrollController: _scrollController,
autofocus: true,
keyboardType: TextInputType.multiline,
maxLines: null,
autocorrect: true,
onChanged: (s) => {},
decoration: InputDecoration(
border: InputBorder.none,
isDense: true,
),
),
);

Answer 2

MediaQuery.removePadding(
context: context,
removeTop: true,
removeBottom: true,
child: Scrollbar(
thumbVisibility: true,
child: TextField( //If you want initial value use TextFormField
maxLines: 4,
minLines: 1,
decoration: const InputDecoration(contentPadding: EdgeInsets.zero),
),
),
);
After multiple tries, this helped in my case.
If you want to use with static read only text, user TextFormField with initialValue and readOnly true.