The title sums up the question pretty well. I have a TextField with a maxLength: 250 and this is what it looks like:

Is there a way to put the counter somewhere else? Optimally to the left of the send button, but otherwise maybe just above and on the left of the TextField. Any ideas? Thanks!
Probably not necessary, but here's my code:
TextField(
controller: inputTextEditingController,
focusNode: inputFocusNode,
style: TextStyle(color: Platform.isAndroid ? Colors.green : Colors.blue, height: 0.8),
maxLength: 250,
maxLines: null,
decoration: InputDecoration(
contentPadding: const EdgeInsets.fromLTRB(20, 15, 0, 15),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(28)),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Platform.isAndroid ? Colors.green : Colors.blue),
borderRadius: BorderRadius.circular(28)),
suffixIcon: IconButton(
onPressed: _handleSubmitted,
icon: Padding(
padding: const EdgeInsets.fromLTRB(0, 0, 20, 0),
child: Icon(Icons.send,
color: inputFocusNode.hasFocus
? Platform.isAndroid ? Colors.green : Colors.blue
: Colors.black54),
),
),
hintText: "Say something!",
hintStyle: inputFocusNode.hasFocus
? TextStyle(color: Platform.isAndroid ? Colors.green : Colors.blue, fontSize: 16)
: TextStyle(color: Colors.black54)),
You need to build and pass your own counter as a buildCounter parameter of a TextField Widget.
TextField(
maxLength: 250,
buildCounter: (_, {currentLength, maxLength, isFocused}) => Padding(
padding: const EdgeInsets.only(left: 16.0),
child: Container(
alignment: Alignment.centerLeft,
child: Text(currentLength.toString() + "/" + maxLength.toString())),
),
)
child: new TextField(
style: BurmeseUtil.textStyle(context),
controller: txtController,
maxLength: 1500,
maxLines: null,
decoration: new InputDecoration(
counterText: '',
border: OutlineInputBorder(),
),
),
Use decoration in TextField.Add counterText:' ' Good luck
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With