Question 79026 in Flutter Question posted in
The official Flutter documentation can be found here.

Change color of maxletters in textfiled flutter

enter image description here

How to change color of this? and position other place.( like center of top )

Code:

TextField(
      maxLength: 25,
      textAlign: TextAlign.center,
      obscureText: obscuretext,
      decoration: InputDecoration(
        contentPadding: const EdgeInsets.all(8.0),
        border: InputBorder.none,
        iconColor: Colors.grey.shade800,
        hintText: hintText,
        hintStyle: TextStyle(
          fontWeight: FontWeight.w600,
          fontSize: 16,
          color: Colors.grey.shade800,
        ),
        filled: true,
        fillColor: Colors.white54,
      ),
    );
Tags:

2

Answers


  1. 0

    you can build your custom counter

    TextField(
  maxLength: 25,
  buildCounter: (_, {currentLength, maxLength, isFocused}) => Container(
        alignment: Alignment.centerLeft,
        child: Text(currentLength.toString() + "/" + maxLength.toString()),
  ),
)
    Login or Signup to reply.
  2. 0

    Try below code and use buildCounter

    Padding(
  padding: const EdgeInsets.all(16),
  child: TextFormField(
    maxLength: 25,
    decoration: const InputDecoration(
      border: OutlineInputBorder(),
       // If you want change color only of counterText then refer below style
      /*counterStyle: TextStyle(
        color: Colors.green,
      ),*/
    ),
    buildCounter: (BuildContext context,
            {int? currentLength, int? maxLength, bool? isFocused}) =>
        Container(
      alignment: Alignment.topLeft,//use alignment position on your need
      child: Text(
        '${currentLength.toString()}/${maxLength.toString()}',
        style: const TextStyle(
          color: Colors.indigo,
        ),
      ),
    ),
  ),
),

    Result Screen-> image

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search