TextInput 으로 사용자에게 어떤 입력을 받게 되는 경우가 있습니다.
이때에 보다 많은 내용(예를 들어 사용자의 자기소개 같은 값)을 입력 받아야 하는 경우가 생기는데, 이때 사용하면 좋은 컴포넌트가 TextArea 입니다. TextArea 컴포넌트로 여러줄로 입력을 받게되면 사용자는 필연적으로 엔터키를 눌러 개행(줄바꿈)을 하게 되는데 오늘 이야기해보고자 하는 것은 이 개행에 대한 처리입니다.
문자열에 엔터를 처리하기 위해서 이스케이프 문자인 백슬래시(\)를 사용하여 처리를 하게 되는데, 보통 흔히 알고 있기로는 엔터를 처리하기 위해 \r\n 을 문자열에 포함시키면 된다고 아실 겁니다. 저도 학교에서 C수업을 들을때 그렇게 배웠습니다.
\n : 라인피드(linefeed) - 커서를 해당 줄의 다음줄로 옮김
커서를 해당줄의 왼쪽으로 옮겨 다음줄로 내리면 엔터키를 친 것과 동일한 효과가 나오게 됩니다.
하지만 TextArea 에서는 \r 만으로 엔터키 처리를 하고 있습니다.
위와 같이 엔터키를 넣게 되면 실제로 TextArea의 text 속성에서 받는 문자열에는 "텍스트\r입력" 이라고 들어있게 되는 것이죠.
사용자에게 입력받은 해당 데이터를 서버에 저장하고 불러와 다시 TextArea 에 넣어줄때에 아무런 처리를 하지 않아도 상관없습니다. 어짜피 넣어진대로 다시 넣는 것이니까요. 하지만 서로 다른 언어에서 같은 데이터를 사용시에는 문제가 됩니다. 언어들마다 엔터의 처리가 다르기 때문이죠.
위에서 처럼 \r\n 으로 엔터키를 처리하는 경우도 있고, \r 만으로도, \n 만으로도 처리하는 경우가 있습니다. 만약 \r\n으로 엔터를 처리하는 시스템에서 만들어 놓은 문자열을 TextArea 에 대입하면 어떻게 될까요? "텍스트\r\n입력" 이라고 TextArea의 text 속성에 넣으면 아래와 같은 현상이 발생합니다.
위에서 보시는 것 처럼 \r 과 \n 둘다 엔터키로 인식되네요.
참고로 말씀드리자면 MXML 상에서 위의 이스케이스 문자를 인식시키실때는 아래와 같이 하시면 됩니다.
- <mx:TextArea text="텍스트\r\n입력" /> <!-- 백슬러시(\)를 문자열로 인식함 -->
- <mx:TextArea text="{'텍스트\r\n입력'}" /> <!-- 백슬러시(\)를 특수문자로 인식함 -->
물론 더 좋은 방법들이 있을꺼라 생각되지만, 저는 플렉스쪽에서 변환해서 쓰고 저장시에도 변환해서 보내기로 결정을 했습니다.
그래서 아래와 같은 코드를 구현하였습니다.
- public static function getStringForFlex(value:String):String
- {
- var javaReturnExp:RegExp = /\r\n/g; // \r\n 으로 된 문자열을 모두 찾는다.
- return value.replace(javaReturnExp, "\r"); // \r 으로 변경하여 반환한다.
- }
- public static function getStringForJava(value:String):String
- {
- var flexReturnExp:RegExp = /\r/g; // \r 으로 된 문자열을 모두 찾는다.
- return value.replace(flexReturnExp, "\r\n"); // \r\n 으로 변경하여 반환한다.
- }
네이밍이 좀 별로네요.. ;;
엔터키의 처리가 다르다는 것을 알아두시면 좋겠네요. ;)
ps. Flash Player 10 이 공개된 이후 FP10 이 설치된 브라우저에서 이전 포스트의 swf 파일을 로드하지 못하는 경우가 생기네요.
정확하게 이유는 모르겠습니다. 티스토리 포럼에 같은 내용의 버그신고가 이어지고 있는데, 자세히 알아봐야겠습니다.
from http://blog.flashplatform.kr/189
[출처] Flex Textarea 개행문자|작성자 맹
