swift ui에서 제공하는 Text에서 multi line의 정렬이 leading, center, trailing 세가지 옵션밖에 제공 안하는 문제..
구글링 결과 비슷한 문제를 겪고있는 사람들이 수년전부터 stack overflow에서 질문을 올리고 있었다. 하지만 대부분의 솔루션은 다음과 같다.
"UITextView에서 제공하는 text alignment의 .justify함수를 활용해 양쪽 정렬후, UIViewRepresentable로 감싸 SwiftUI View로써 활용한다"
struct JustifiedText: UIViewRepresentable {
private let text: String
private let font: UIFont
init(_ text: String, font: UIFont = .systemFont(ofSize: 18)) {
self.text = text
self.font = font
}
func makeUIView(context: Context) -> UITextView {
let textView = UITextView()
textView.font = font
textView.textAlignment = .justified
return textView
}
func updateUIView(_ uiView: UITextView, context: Context) {
uiView.text = text
}
}
JustifiedText("이딴걸로 몇시간을 날리냐")뭐 대강 이런식. (답변중 아무거나 퍼왔습니다)
하지만 UIViewRepresentable의 특성인지 View의 frame height를 지정해주지 않으면 높이가 자기 멋대로 늘어나고 줄어들고 난리 부르스를 췄다. 그렇다고 height를 지정해주자니, 텍스트가 몇줄이나 나올줄 알고 지정 하겠는가..
나름 해답을 찾겠다고 UIView의 dynamic size등을 키워드로 검색해서 이것저것 높이를 텍스트에 맞추려 시도해봤지만 적어도 내 경우에는 제대로 적용되지 않았다. 한글파일에서는 버튼 한방에 정렬되는 문제를 이렇게 몇시간씩 고민할 일인가 현타가 와서, 얼마전에 만든 kotlin 안드로이드 앱에서는 이를 어떻게 해결했나 확인해봤더니..
fun String?.useNonBreakingSpace(): String{
val space = ' '
val nonBreakableSpaceUnicode = '\u00A0'
return this.orEmpty().replace(space, nonBreakableSpaceUnicode)
}
Text("이딴걸로 몇시간을 날리다니..".useNonBreakingSpace())이런식으로 해결해놨더라.
그때는 복붙으로 빠르게 개발하고 넘겨서 원리를 몰랐는데 이제보니 띄어쓰기를 띄어쓰기와 유사한 공백 uicode로 싹다 대체한 것이었다.
이게 먹히면 난 등신 머저리다 생각하고 비슷한 확장함수를 만들었다.
extension String {
...
func useNonBreakingSpace() -> String {
return self.replacingOccurrences(of: " ", with: "\u{202F}\u{202F}")
}
...
}
Text("과연 이게 될까?".useNonBreakingSpace())정말 심플하게 " " 공백을 U+202F 두개로 바꿔주세요이다. line-break를 일으키지 않는 공백에 대해서는 다음을 참고하자.
https://en.wikipedia.org/wiki/Whitespace_character
무튼 이렇게 해서 실행해본 결과는...
오우! 등신 머저리 당첨!
오늘의 교훈
1. 복붙할때는 이해하고 쓰자
2. 해결한 문제는 꼬박꼬박 정리해놓자(15분 귀찮아하면 150분 날립니다)
3. 나도 사수가 이런거 알려줬음 좋겠다(독학할때는 맘 독하게 드셔요나이스롸임)
