CODEWITHSUNDEEP
flutter
mickey
mickey

Reputation: 77

How to make TextField stop receiving input when reached max line?

As the title, I've set maxLines:2, but when I reached the max line, I can still type.
And controller.value has the text that is out of the area.

How to make user can't type when the TextField is filled, or cut the value that is out of the area.

enter image description here

Upvotes: 0

Views: 1292

Answers (2)

mickey
mickey

Reputation: 77

I've got a solution to my problem. Hope it saves someone's time.
Set minLines: 1 maxLines: 2 scrollPhysics: NeverScrollableScrollPhysics(),

And check the maxScrollExtent when onChaged, if it can scroll that means it more than maxLines

onChanged: (input) async {
                      await Future.delayed(Duration(milliseconds: 50));

                      if (scrollController.position.maxScrollExtent > 0.0) {
                        controller.text = oldText;
                      } else {
                        oldText = input;
                      }
                    },

Upvotes: 0

Zain Ur Rehman
Zain Ur Rehman

Reputation: 297

Try maxLength with maxLines

maxLines property is just for lines, not to restrict the length of text.

TextField(
  maxLength: 10, //Any specific length
  maxLines: 2,
  decoration: InputDecoration(
    counterText: ''
  ),
)

And you can also use this:

Use inputFormatters property

TextFormField(
      inputFormatters: [
        LengthLimitingTextInputFormatter(10),
      ]
    )

namespace

import 'package:flutter/services.dart';

References

How can I limit the size of a text field in flutter?

https://api.flutter.dev/flutter/material/TextField/maxLength.html

Upvotes: 2

Related Questions