[Flutter]TextField에서 Cursor 위치 임의로 지정하기

• TextFormField나 TextField를 사용할 때 매 글자를 입력할 때마다 커서가 맨 앞으로 이동되는 현상이 나타나는 경우가 있음.

• 기존에는 그냥 커서를 맨 뒤로 보내야 겠다고 생각했고 이를 위해 아래와 같은 코드를 작성했음.

TextEditingController textController = TextEditingController();

TextField(
    controller: textController,
    onChanged: (String value) {
        textController.text = value;
        textController.selection = 
            TextSelection.fromPodition(TextPosition(offset: value.length));
    },
),

• 이렇게 코드를 작성하면 1글자가 완성될 때마다 커서가 자동으로 입력된 텍스트의 마지막 위치로 이동됨.

• 처음에는 이 코드를 통해 입력시 커서의 위치문제를 해결했다고 생각함.

• 하지만 이후 입력필드에서 텍스트 중간에 글자를 삽입하려고하면 매번 커서가 텍스트의 맨 뒤로 이동해버리는 현상이 발생했음.

• 이를 해결하기 위해 열심히 구글링한 결과, 아래와 같은 해결책을 찾을 수 있었음.

final TextEditingController textController = TextEditingController();

/* some codes... */

onChanged: (String value) {
	final TextSelection previousCursorPos = textController.selection;
	
	/* some codes... */

	textController.text = value;
	textController.selection = previousCursorPos;
}

• 이 코드는 다음과 같은 과정으로 동작한다.
  • 입력이 발생하면 textController를 통해 현재 선택된 커서의 위치를 변수로 저장한다.
    • 현재 선택된 커서의 위치는 별 다른 조작이 없으면 보통 커서의 위치와 동일하다.
  • textController.text에 입력된 텍스트를 저장한다.
  • 처음에 저장해둔 커서의 위치를 textController의 위치로 지정한다.
• 이 과정을 통해 커서의 위치를 이전에 내가 지정해둔 위치 그대로 사용할 수 있게된다.