[iOS] TextView에 Placeholder 구현하기

안녕하세요~

이번에는 TextView에서 Placeholder 구현해보겠습니다!

TextField에는 기본적으로 Placeholder 기능을 제공하지만,

TextView에서는 제공하지 않아요ㅜㅜ 

그래서 직접 만들어 주어야하는데요!

어렵지 않으니까 같이 만들어봅시다ㅎㅎㅎ

 

---

 

간단한 기능에 관련된 부분이기때문에 UI는 아래 이미지와 같이 만들어 보겠습니다 :)

 

우선 본격적으로 들어가기 전에,

Placeholder는 어떤 역할을 하는지 한번 생각해 봅시다

 

사용자가 Text를 입력하기 전

즉, TextView 내부에 Text가 비어있을때

textColor가 회색인 안내문구가 나오도록 하는 기능이죠?

 

그럼 기본적으로 회색의 text가 나오도록 하고..

사용자가 textView를 클릭했을때를 감지하여

회색의 안내문구를 지워준 후,

textColor를 검정색으로 변경해주면 될 것 같은데...!

 

한번 해봅시다!!

 

UI 구성하기

저는 snapkit과 then 라이브러리를 사용하여 UI를 구성해보았습니다!

 

 

우선 background와 textView의 경계를 만들어주기위해서

border처리를 해주었습니다.

그 후에 이 전에 말했듯이 textColor를 회색으로 지정해주고,

안내문구인 "메세지를 입력하세요" 라는 text를 해당 textView에 띄워주도록 합니다.

 

 

이 부분은 superView를 기준으로

top:100/ left,right:10/ bottom:50 씩 띄워서 배치하겠다는 코드에요!

똑같이 안 해도 되는 부분이니 자율적으로 배치해보세용@.@

 

기능 구현하기

 

초반에 사용자가 textView를 클릭했을때를 감지하여

회색의 안내문구를 지워준 후,

textColor를 검정색으로 변경해주면 될 것 같다는 이야기를 했었어요!

 

그렇다면.. TextView가 터치 되었을때를 감지하는 메소드가 있어야 되겠죠?

 

Apple Developer Documentation에 보면

textViewDidBeginEditing()라고 TextView가 터치되었을때를 알려주는 메소트가 있습니다!

 

https://developer.apple.com/documentation/uikit/uitextviewdelegate/1618610-textviewdidbeginediting

 

"지정된 텍스트 보기의 편집이 시작될 때 대리자에게 알립니다" 라고 설명하고 있네요

 

이밖에도 아래와 같은 메소드도 제공하고 있습니다 :)

 

 

- 텍스트 보기에서 편집을 시작할지 여부를 대리자에게 묻습니다

- 텍스트 보기에서 편집을 중지할지 여부를 대리자에게 묻습니다

- 텍스트 보기의 편집이 종료되면 대리자에게 알립니다.

 

다른 기능 만들때 많이 활용해보면 좋을 것 같네용

 

 

이제는 textViewDidBeginEditing를 사용해봅시다!

 

 

만약 textColor가 lightGray라면,

textView에 있는 text를 다 없애줍니다.

그 후 textColor의 색을 black으로 바꾸어주면 끝!

 

이제 잘 되는지 실행해보겠습니다ㅎㅎ

 

짜란~~~

잘 되죠!?ㅎㅎ

 

실제 프로젝트에 요긴하게 잘 사용할 것 같네요!

읽어주셔서 감사합니다!!

틀린 부분에 대한 조언은 댓글로 달아주세요!!🥰

 

 

전체 코드:

https://github.com/sojin2/TIL/tree/main/iOS/TextViewPlaceholder