SwiftUI의 Text를 통해 여러 줄에 걸쳐 보기 좋게 보이기 (줄 바꿈 위치 조정)

Summary

단어가 중간에 줄을 바꾸는 경우가 적어져서 읽기 좋아요!

iOS 13.0 이후,macOS 10.15 이후,tvOS 13.0 이후,watchOS 6.0 이후 사용 가능!

일본어 글의 줄 바꿈을 조정할 수 있는 Google BudouX

문자는 화면과 창의 너비에 따라 자동으로 줄을 바꾸지만 단어와 문장 사이에 빈칸이 없는 일본어에서는 줄 바꾸기의 위치가 미묘해진다.
Pythhon, JavaScript에 대한 프로그램 라이브러리google/budoux.
https://github.com/google/budoux
또 스위프트에서도 이것griffin-stewie/BudouX.swift을 사용할 수 있다.
https://github.com/griffin-stewie/BudouX.swift
이번griffin-stewie/BudouX.swift v0.4.0에 나왔는데 스위프트 UI도 간단하게 처리할 수 있으니 소개해 드릴게요.
https://github.com/griffin-stewie/BudouX.swift/releases/tag/v0.4.0

그냥 Text를 BudouXText로 바꾼 거예요.

iOS 13.0 이후, 맥OS 10.15 이후, tvOS 13.0 이후, 워치OS 6.0 이후 사용가능(즉 스위프트UIText만 사용할 수 있는 환경이면 OK)

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("あのイーハトーヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモリーオ市、郊外のぎらぎらひかる草の波。")
            .multilineTextAlignment(.center)
    }
}

위에서 설명한 대로 SwiftUI의 일부를 Text로 교체해 보십시오.

import SwiftUI
import BudouX

struct ContentView: View {
    var body: some View {
        BudouXText("あのイーハトーヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモリーオ市、郊外のぎらぎらひかる草の波。")
            .multilineTextAlignment(.center)
    }
}

SwiftUIBudouXText와 Text 두 가지 미리보기가 여기에 표시됩니다.

지목BudouXText으로 인해 부두룩스의 힘이 더욱 발휘되었습니다!매우 읽기 쉽다.

.multiplineTextAlignment(.center) 설치

BudouXText의 설치는 Sources/BudouX/SwiftUI/BudouXText.swift에 있습니다.

// griffin-stewie/BudouX.swift v0.5.0

@available(iOS 13.0, macOS 10.15, tvOS 13.0, watchOS 6.0, *)
public func BudouXText(_ key: String, tableName: String? = nil, bundle: Bundle? = nil, comment: StaticString? = nil, parser: BudouX.Parser = .init(), threshold: Int = BudouX.Parser.defaultThreshold, condition: (_ naturalLanguagesSupportedByParser: Set<String>) -> Bool = defaultBudouXTextCondition) -> SwiftUI.Text

@available(iOS 13.0, macOS 10.15, tvOS 13.0, watchOS 6.0, *)
public func BudouXText(verbatim content: String, parser: BudouX.Parser = .init(), threshold: Int = BudouX.Parser.defaultThreshold, condition: (_ naturalLanguagesSupportedByParser: Set<String>) -> Bool = defaultBudouXTextCondition) -> SwiftUI.Text

lower-camel-case는 아니지만 BudouX로 import을 할 수 있는 전역적인 방법입니다. 이것은 SwiftUIBudouXText입니다.[1] 현지화도 지원합니다.
방법의 마지막 끝 인수Text에서는 부두엑스의 파서가 지원하는 자연어condition를 얻을 수 있기 때문에 예를 들어 일본어 텍스트의 경우Set, 그렇지 않으면true 일본어에서만 부두엑스 변환을 할 수 있다.

SwiftUI의 가짜 인터페이스에서 사용된 View Modifier도 모두 사용 가능

위에서 말한 바와 같이 Text 중SwiftUI의 BudouXText에서 사용할 수 있는 View Modifier에서 모두 사용할 수 있다.따라서 일본어 문장에서 줄 바꾸기에 신경 쓰는 부분이 있다면 주저 없이 Text로 바꿀 수 있다.[2]

참고 자료

https://zenn.dev/griffin_stewie/articles/2112211657_introducing_budoux_swift
각주
왜 로워-camel-case가 아닌 방법인지Pull request에서 설명.↩︎
BudouXText 같은 SwiftUIbudouxed(_:)에서 사용하는 View Modifier가 더 좋지 않을까...?그런데 왜 이렇게 안 됐지?Pull request에서 설명.↩︎