[ios] UITextView 높이를 동적으로 조절하기

[ios] UITextView 높이를 동적으로 조절하기

안녕하세요. 오늘은 UITextView를 사용할 때 사용자가 입력하는 텍스트의 양에 따라 크기가 자동으로 늘어나고 줄어들게 하는 방법에 대해 알아보도록 하겠습니다.

참고로 저는 유투브 채널 Let's build that app을 보고 저만의 설명을 덧붙여서 글을 작성하였습니다. 개인적으로 상당히 추천하는 유투브 채널입니다!

Swift 4: Easy Trick to Auto Sizing UITextView in Real Time

그럼 바로 시작해보도록 하겠습니다.

---

Setting

참고로 이 포스팅에서는 오토레이아웃을 코드로 작성합니다. 이에 대한 선수지식이 없으시다면 제가 작성한 간단한 포스팅을 먼저 참고해주시기 바랍니다.

• [ios] Auto Layout Programmatically - 1
• [ios] Auto Layout Programmatically - 2

• 뷰의 상단에 UITextView 위치시켰습니다.

그럼 이제 오토레이아웃을 적용해보겠습니다.

• 오토레이아웃을 적용시키는 코드는 반드시 뷰를 부모 뷰에 붙이고 난 후 작성해주어야 합니다.

---

UITextViewDelegate

저는 이 영상을 보기전까지는 UITextView에 오토사이징을 해주는 방법을 몰랐습니다. 하지만 이 영상의 제목을 보고나서 관련 델리게이트를 사용할 것 같았고 그 예상은 적중하였습니다. 그리고 아래의 메소드를 사용해 기능을 구현했습니다.

• 위의 메소드안에서 textView의 text를 출력시켜보면 입력하는 값들이 모두 콘솔에 출력되는 것을 확인하실 수 있습니다.

그럼 이 안에서 본격적으로 코드를 작성해보겠습니다.

1. 먼저 CGSize를 하나 생성합니다. 이때 높이는 .infinity로 설정합니다.
2. 이 코드를 저는 영상을 볼 때 이해하지 못하였습니다. 하지만 문서의 설명을 보고 이해를 하였습니다. 문서의 설명에 따르면 sizeThatFits(_:) 메소드는 인자로 들어오는 CGSize 를 현재 textView에 가장 적합한 크기로 계산하여 해당 크기를 textView에 적용시키는 것입니다. 그럼 현재 textView에 가장 적합한 크기란 무엇일까요?! 그것은 바로 textView를 설정해주는 코드에서 작성한 UITextView에 입력될 글자의 폰트 사이즈입니다. 저는 위에서 .largeTitle을 사용하였습니다. 그럼 인자로 들어오는 CGSize값은 해당 폰트의 높이에 맞는 사이즈로 계산됩니다.
3. 그리고 이렇게 결정된 높이를 적용시켜주어야 하는데 바로 Constraints에 접근하여 값을 변경하는 것은 불가능합니다. 그렇기 때문에 코드처럼 .forEach를 거쳐 Height Constraints를 찾아 결정된 높이 값을 지정해줍니다.

그리고 이제 textView의 델리게이트를 설정해주어야 합니다.

이제 프로젝트를 실행시켜보시면 뭔가 되는 것 같기도한데 약간 이상하게 동작하는걸 보실 수 있습니다. 이제 오류를 하나씩 해결해보도록 하겠습니다.

 

가장 먼저 확인할 수 있는 오류는 입력하기 전에는 처음 설정한 높이 값인 equalToConstant: 50으로 설정되어 있다가 입력을 시작하면 폰트 사이즈에 맞게 바뀌는 것을 확인할 수 있습니다. 이를 해결하기 위해서는 아주 간단합니다! 바로 수동으로 위에서 정의한 메소드를 호출해주는 것입니다.

그리고 그 다음은 바로 입력할 때마다 텍스트들이 위로 올라가면서 윗 부분이 잘리는 것입니다. 이를 해결하기 위해서는 textView의 스크롤을 막는 것입니다.

이 두 해결방법의 코드를 작성해주면 다음과 같습니다.

---

마무리

완성된 프로젝트는 다음과 같습니다.

오늘은 이렇게 UITextView의 사이즈가 입력되는 텍스트에 따라 사이즈가 자동으로 조절되는 기능에 대해 공부해보았습니다. 다음에는 더욱 유익한 내용을 공부한 후 기록해보는 시간을 갖도록 하겠습니다. 감사합니다.

Source : github