본문 바로가기
Flutter

[Flutter] Textfield에서 한글 작성시 중복 입력되는 버그(24.05.20 기준)

by DevJake 2024. 5. 20.

후.. 

네시간동안 삽질했다. 

Flutter 3.22.0, Dart 3.4.0 

버전으로 작업하던 중에 생긴 버그였다. 나중에 업데이트 되면 말끔히 사라질거라 생각한다. 

 

일단, 

기존에 작성한 TextField 코드이다. 

TextField(
  enableInteractiveSelection: true,
  style: const TextStyle(fontSize: 14, fontWeight: FontWeight.bold),
  keyboardType: TextInputType.text,
  textAlign: TextAlign.start,
  textAlignVertical: TextAlignVertical.center,
  controller: sofaTypeTextController,
  inputFormatters: [LengthLimitingTextInputFormatter(10)],
  decoration: const InputDecoration(
    contentPadding: EdgeInsets.symmetric(vertical: 13, horizontal: 12),
    border: InputBorder.none,
    filled: true,
    fillColor: Colors.white,
    floatingLabelBehavior: FloatingLabelBehavior.never,
    alignLabelWithHint: false,
    label: Text('소파 종류를 입력하세요 (10자 이내)', style: TextStyle(fontSize: 12, color: Colors.grey),),
  ),
),

이 코드를 짰을 당시 아무 문제 없이 작동했었다. 

그런데, TextField에 한글을 입력하면, 입력할때마다 바로 앞에 입력했던 글자가 두개 혹은 세개가 입력되어 버리는 버그가 발견됐다. 

 

중간에 바뀐게 무엇일까 생각해 보니, 

iOS 업데이트? 

테스트해보니, 안드로이드는 정상작동하고

역시나 iOS 17.5로 업데이트한 기기에서만 버그 현상이 발견되고, iOS 16 에서는 멀쩡히 작동된다. 

 

Flutter Github에서 issue 를 뒤져보았지만, 버그리포트 된 내용도 없고.. 

당연히 애플에선 고쳐줄 의무가 없다. 고 얘기하지...

ChatGPT 에서는 한글 IME 와 뭔가 충돌이 있는것 같다며

1. FocusNode를 넣어서, change 될때마다 trim() 으로 공백을 없애라(?) - X

2. controller.text 로 하지말고 별도 변수를 만들어서 변수에 저장하는 형태로 출력해라 - X

등등 다른 방법도 제시했지만 모두 실패. 

 

그런데 

같은 앱 내에 있던 

TextFormField(
  onFieldSubmitted: (input) {
    
  },
  controller: _textController,
  focusNode: _focusNode,
  autofocus: false,
  obscureText: false,
  style: const TextStyle(
    fontFamily: 'Plus Jakarta Sans',
    color: Color(0xFF15161E),
    fontSize: 14,
    fontWeight: FontWeight.w500,
  ),
  cursorColor: const Color(0xFF6F61EF),
),

이 코드는 버그 없이 잘 작동하네? 

 

항목을 하나하나 지워가며 확인해본 결과, 

enableInteractiveSelection: false,

요놈이 문제였다. 

사실 저건 사용자가 텍스트 복사하거나 수정 못하게 하는 항목이라, 

에이 저건 아닐거야 하고 생각하기도 했고

혹시나 해서 chatGPT 에 물어봤었는데..

아오 GPT시치..

너무 단호하게 얘기하길래, 저건 아닌가보다 했는데

저 속성을 

enableInteractiveSelection: true,

로 바꾸어 주었더니 

한글 중복되어 입력되는 문제는 해결되었다. 

 

ChatGPT 말도 틀린건 아닌게.. 저 항목 자체가 문제라기 보다는 

iOS 버전업 하면서 아마도 Flutter 쪽 코드와 충돌이 생기는 부분이 발생하여 만들어진 버그이긴 하다. 

어쨌든 저걸로 인해, 저 속성은 건드릴수 없는 속성이 되어 버렸으니..

 

다행히도 해당 항목이 꼭 필요한 설정부분은 아니라 일단 저렇게만 수정하고 넘어간다. 

 

여기서 배운건..

 

1. ChatGPT 를 맹신하지 말아야겠다.

    원론적인 얘기나 많이 보고된 버그에 대한 솔루션은 있지만, 예상 불가능한 이런 버그는 못찾는구나...

2. 나를 너무 과소평가 하지 말아야겠다.

    남이 만든 문서, 블로그 혹은 공식 버그리포트 확인도 중요하지만 내가 직접 노가다하는게 문제해결이 더 빠를때도 있네 

3. 정리좀 자주자주 하자ㅠㅠ 시간이 부족하다만ㅠㅠ

댓글