Флаттер: Как переместить счетчик текста TextField? - PullRequest
Новая
       56

Флаттер: Как переместить счетчик текста TextField?

0 голосов
/ 20 сентября 2019

Название довольно хорошо подводит итог вопроса.У меня есть TextField с maxLength: 250, и это выглядит так:

enter image description here

Есть ли способ поставить счетчик где-нибудь еще?Оптимально слева от кнопки отправки, но в остальном может быть чуть выше и слева от TextField.Есть идеи?Спасибо!

Наверное, не обязательно, но вот мой код: 

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)),

Ответы [ 2 ]

0 голосов
/ 20 сентября 2019 
  child: new TextField(
                  style: BurmeseUtil.textStyle(context),
                  controller: txtController,
                  maxLength: 1500,
                  maxLines: null,
                  decoration: new InputDecoration(
                    counterText: '',
                    border: OutlineInputBorder(),
                  ),
                ),

Использовать оформление в TextField. Добавить counterText: '' Удачи

0 голосов
/ 20 сентября 2019

Сначала инициализируйте две переменные в вашем классе с состоянием, как показано ниже, 

  int maxlength = 50;
  int currentLength = 0;

Затем внесите последующие изменения в ваш виджет, как показано ниже. 

      TextField(
                controller: inputTextEditingController,
                focusNode: inputFocusNode,
                style: TextStyle(
                    color: Platform.isAndroid ? Colors.green : Colors.blue,
                    height: 0.8),
                maxLength: maxlength,
                maxLines: null,
                decoration: InputDecoration(
                  counter: Container(
                  alignment: Alignment.center,
                  child: Text("${currentLength}/${maxlength}"),
                  ),
                  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),
                ),
              ),

Сейчас, вы можете использовать любой другой виджет для вашего счетчика в "украшению: InputDecoration" .Я использовал контейнер с выравниванием свойство.Вы можете изменить в соответствии с вашими требованиями.

Это, безусловно, принесет вам пользу.

...