모바일 개발의 텍스트 및 타이포그래피: 정의, 도구 및 작동 방식

모바일 앱의 텍스트: iOS의 NSAttributedString

NSAttributedString은 서식 있는 텍스트 작업을 위한 기본 iOS 클래스입니다. 개별 문자 또는 범위에 속성을 적용할 수 있습니다. UIFont를 통한 폰트, UIColor를 통한 색상, kern을 통한 문자 간격, NSMutableParagraphStyle을 통한 줄 간격 등이 있습니다. 모바일 앱에서 NSAttributedString은 UILabel부터 편집을 지원하는 복잡한 UITextView까지 모든 곳에서 사용됩니다.

UIFont 및 폰트 구성

UIFont는 iOS에서 폰트 작업을 위한 기본 클래스입니다. 시스템 서체, 사용자 정의 폰트 및 Dynamic Type을 지원합니다. UIFont(name:size:)는 이름으로 폰트를 로드하고, UIFont.systemFont(ofSize:weight:)는 시스템 폰트를 로드합니다. UIFontDescriptor를 사용하면 기존 폰트를 수정할 수 있습니다(크기, 두께 변경 또는 변환 매트릭스 추가). 사용자 정의 폰트의 경우 .ttf 파일을 프로젝트에 추가하고 Info.plist의 Fonts provided by application 키에 등록합니다.

let attributes: [NSAttributedString.Key: Any] = [
    .font: UIFont(name: "HelveticaNeue-Bold", size: 18) as Any,
    .foregroundColor: UIColor.darkGray as Any,
    .kern: 1.5 as Any
]
let attributedString = NSAttributedString(
    string: "Форматированный текст",
    attributes: attributes
)
label.attributedText = attributedString

NSMutableParagraphStyle 및 단락 서식

NSMutableParagraphStyle은 단락 표시를 구성하기 위한 ParagraphStyle의 가변 버전입니다. 정렬(alignment), 줄 간격(lineSpacing), 들여쓰기(headIndent, tailIndent) 및 자르기 모드(lineBreakMode)를 제어합니다. ParagraphStyle은 모바일 장치에서 긴 텍스트의 가독성에 중요합니다. 적절한 lineSpacing은 줄 병합을 방지하고 lineBreakMode는 단어 잘림을 방지합니다. paragraphSpacing 설정은 단락 사이의 공간을 정의합니다.

모바일 앱의 텍스트: Android의 SpannableString

SpannableString은 Android에서 텍스트 서식을 위한 주요 도구입니다. Span 객체 메커니즘을 통해 작동하며, 각 객체는 하나의 측면을 담당합니다. StyleSpan(굵게/기울임), ForegroundColorSpan(색상), URLSpan(링크), UnderlineSpan(밑줄) 등이 있습니다. SpannableStringBuilder는 NSMutableAttributedString에 해당하며 여러 조각에서 텍스트를 구성할 수 있습니다. 모바일 앱에서 서식 있는 텍스트로 유연한 인터페이스를 만들려면 SpannableString을 이해하는 것이 필수적입니다.

Android의 Typeface 및 사용자 정의 폰트

Typeface는 Android에서 폰트 작업을 위한 클래스입니다. 시스템 서체 Roboto 및 Noto와 사용자 정의 폰트를 지원합니다. Typeface.createFromResource()는 res/font/에서 폰트를 로드하고, Typeface.createFromAsset()은 assets 폴더에서 로드합니다. Android 8.0+는 XML에서 폰트 패밀리를 지원하여 여러 폰트 파일을 하나의 리소스로 결합합니다. Android 모바일 앱에서 텍스트에 사용자 정의 폰트를 설정하려면 android:fontFamily 속성을 사용하거나 프로그래밍 방식으로 setTypeface()를 사용합니다.

TextMeasurer 및 텍스트 측정

TextMeasurer(API 29+)는 View에 바인딩하지 않고 텍스트를 측정하는 현대적인 도구입니다. 렌더링 전에 너비, 높이 및 문자 위치를 계산합니다. 이전 API에서는 단일 행 텍스트의 경우 Paint.measureText()를, 여러 행 텍스트의 경우 StaticLayout을 사용합니다. TextMeasurer는 Canvas.drawText()를 통해 텍스트가 그려지는 사용자 정의 View에서 특히 유용합니다. 올바른 측정은 인터페이스에서 문자 잘림을 방지합니다.

val spannable = SpannableString("Жирный текст с цветом")
spannable.setSpan(
    StyleSpan(Typeface.BOLD),
    0, 6,
    Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
)
spannable.setSpan(
    ForegroundColorSpan(Color.RED),
    14, 19,
    Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
)
textView.text = spannable

모바일 개발의 타이포그래피: 커닝, 합자 및 트래킹

모바일 앱의 타이포그래피는 폰트, 문자 간격 및 줄 간격의 포괄적인 구성입니다. 모바일 개발에서 적절한 타이포그래피는 텍스트 가독성과 인터페이스의 시각적 인식에 직접적인 영향을 미칩니다. 두 플랫폼에서 사용 가능한 주요 매개변수를 살펴보겠습니다.

커닝 및 트래킹

커닝은 특정 문자 쌍(AV, To, Wa) 사이의 간격 조정입니다. 트래킹은 전체 텍스트 또는 그 일부에 대한 균일한 문자 간격입니다. iOS에서는 커닝이 NSKernAttributeName을 통해 설정되고, Android에서는 TextView의 letterSpacing 속성을 통해 설정됩니다. 음수 값은 문자를 가깝게 하고 양수 값은 문자를 넓게 합니다. 모바일 개발의 타이포그래피는 이러한 매개변수를 신중하게 조정해야 합니다. 큰 제목의 경우 문자 간격을 보통 늘리고 본문 텍스트의 경우 표준으로 유지합니다.

합자

합자는 두 개 이상의 문자 조합(fi, fl, ffi)을 대체하는 특수 글리프입니다. iOS에서는 합자가 NSLigatureAttributeName을 통해 제어됩니다. 0 — 비활성화, 1 — 표준, 2 — 모두 사용 가능. Android에서는 합자가 OpenType 기능을 통해 폰트 수준에서 제어됩니다. 합자를 활성화하면 특히 세리프 서체에서 텍스트 모양이 개선됩니다. 모바일 개발의 타이포그래피는 주로 제목과 로고에 합자를 사용합니다.

모바일 앱의 사용자 정의 폰트: 로딩 및 구성

사용자 정의 폰트는 앱에 고유한 시각적 스타일을 만들기 위한 주요 도구 중 하나입니다. 브랜드를 강조하고 사용자 경험을 개선하는 데 도움이 됩니다. 모바일 앱에서 사용자 정의 폰트는 제목, 로고, 강조 요소 및 기업 아이덴티티에 사용됩니다.

가변 폰트

가변 폰트는 하나의 파일에 여러 스타일(가는 것부터 매우 굵은 것까지, 좁은 것부터 넓은 것까지)을 포함하는 현대적인 폰트 기술입니다. 여러 폰트 파일을 하나로 대체하여 앱 크기를 줄입니다. iOS에서는 가변 폰트가 weight 매개변수가 있는 UIFont를 통해 지원됩니다. Android에서는 가변 축(wght, wdth, slnt)을 지정하는 Typeface.Builder를 통해 지원됩니다. 가변 폰트를 사용하면 모바일 앱의 타이포그래피가 간소화됩니다. 개발자는 각 스타일에 대해 별도의 파일을 로드할 필요가 없습니다.

let customFont = UIFont(name: "CustomFont-Regular", size: 16)
let scaledFont = UIFontMetrics.default
    .scaledFont(for: customFont)
label.font = scaledFont
label.adjustsFontForContentSizeCategory(true)

NSTextAttachment 및 ImageSpan

iOS의 NSTextAttachment을 사용하면 NSAttributedString 내에 UIImage를 포함할 수 있습니다. 이미지는 기준선에 정렬되고 텍스트와 함께 이동합니다. Android에서는 SpannableString 내의 ImageSpan이 이에 해당합니다. 두 접근 방식 모두 이모지가 있는 채팅, 아이콘이 있는 뉴스 피드 및 사용자 정의 체크박스가 있는 양식에 유용합니다. 텍스트와 그래픽이 조화롭게 보이도록 폰트 높이에 맞게 이미지를 적절히 크기 조정하는 것이 중요합니다.

텍스트 효과, 정렬 및 생략 부호

기본 서식 외에도 모바일 앱의 텍스트는 추가 시각 효과(그림자, 윤곽선, 취소선, 밑줄)를 지원합니다. 이러한 도구는 타이포그래피의 가능성을 확장하지만 가독성을 유지하기 위해 신중한 적용이 필요합니다.

텍스트 그림자 및 윤곽선

iOS의 텍스트 그림자는 offset, blurRadius 및 color가 있는 NSShadow를 통해 설정됩니다. 윤곽선은 NSStrokeWidthAttributeName을 통해 설정됩니다. 음수 값은 윤곽선이 있는 채우기를 만들고 양수 값은 윤곽선만 만듭니다. 취소선은 NSUnderlineStyle(.single, .thick, .double)입니다. Android에서는 TextView 그림자가 android:shadowRadius, android:shadowDx, android:shadowDy를 통해 구성됩니다. SpannableString은 StrikethroughSpan 및 UnderlineSpan을 지원합니다. Android의 텍스트 윤곽선은 OutlineSpan 또는 사용자 정의 폰트를 통해 구현됩니다.

생략 부호 및 마키

생략 부호는 컨테이너가 넘칠 때 줄임표로 텍스트를 자르는 것입니다. iOS에서는 lineBreakMode .byTruncatingTail 및 numberOfLines를 통해 구성됩니다. Android에서는 android:ellipsize="end" 및 android:maxLines를 통해 구성됩니다. 마키는 Android에서 android:ellipsize="marquee"를 통해 사용할 수 있는 스크롤 텍스트 애니메이션입니다. iOS에는 내장된 대응 기능이 없으며 MarqueeLabel 라이브러리가 사용됩니다. 콘텐츠 잘림을 방지하기 위해 모바일 앱의 모든 단일 행 텍스트에는 생략 부호가 필수입니다.

iOS의 Dynamic Type

Dynamic Type은 사용자의 접근성 설정에 따라 폰트 크기를 조정하는 iOS의 적응형 텍스트 시스템입니다. 사용자 정의 폰트를 확장하려면 UIFontMetrics를 사용합니다. Dynamic Type은 접근성 준수 앱에 필수입니다. Android에서는 sp 단위 및 scaledPixels가 이에 해당하며 시스템 텍스트 크기 설정에 따라 확장됩니다.