반응형
Summarize 화면
Summarize 화면은 요약 글의 키워드와 요약 글을 볼 수 있는 화면입니다.
요약 글에는 키워드가 하이라이트 처리되어 있는데요.
키워드 리스트 중 하나를 클릭하면 그 키워드만 하이라이트가 됩니다.
Summarize 화면의 핵심 View는 상단의 키워드 리스트와 텍스트 하이라이트입니다.
텍스트 하이라이트는 UITextView 원하는 문자에만 색상 넣기(여러 개도 OK)에서 다루었기 때문에 여기에서 따로 작성하진 않을게요.
키워드 리스트
키워드 리스트는 키워드 길이마다 셀의 길이를 다르게 해줘야 합니다.
즉, 동적으로 셀의 길이를 결정해줘야 해요.
이 처리를 해주지 않으면
이런 웃긴 모양이 되어버려요 ㅋㅋ
그럼 어떻게 동적으로 셀의 크기를 결정해줄까요?
저는 UICollectionViewDelegateFlowLayout의 sizeForItemAt을 이용했습니다.
셀의 크기를 정할 때 키워드 글자를 담을 Label의 크기를 구합니다.
이 Label 크기에 원하는만큼 여백을 주면 됩니다.
만약 여백을 안 주면
이렇게 딱 맞게 설정이 돼요.
이 로직의 핵심은 sizeToFit 입니다.
sizeToFit을 이용해서 키워드에 맞는 크기를 구할 수 있습니다.
마무리
다음 포스팅에서는 Summarize 화면의 ViewModel 구현을 다루겠습니다.
감사합니다!
아직은 초보 개발자입니다.
더 효율적인 코드 훈수 환영합니다!
공감과 댓글 부탁드립니다.
반응형