• Dynamic Type이란?
  • 앱에 있는 텍스트들을 사용자가 원하는대로 전역적으로 조절할 수 있는 기능
  • 이는 단순히 선호도 문제가 아니라 누군가에게는 좋은 사용자 경험을 위한 필수적인 기능일 수 있다.
  • 설정에서 조정 가능
  • 앱에서는 이 설정을 기준으로 대응할 필요가 있다.
• iOS 11에서의 변화
  • 목표
    • 텍스트는 유저가 읽을 수 있는 정도로 커야한다.
    • 텍스트는 전체적으로 읽을 수 있어야 한다.
    • 앱 UI는 그래도 아름다워야 한다.
  • 기본앱의 동작
    • 컨텐츠 영역의 텍스트는 확대된다.
    • 일부 배치가 달라져야 되는 경우도 있다.
    • 탭바나 네비바는 확대 대상이 아니다.(메인 컨텐츠 영역을 너무 차지하기 때문에)
      • 탭바 항목을 길게 누르면, 화면 중앙에 확대되어 보이는 기능도 있다.
  • API 동작
    • 폰트 크기 스케일링
      • 폰트를 직접 지정하지 않고 텍스트 스타일로 지정하라.
      • adjust Dynamic Type 옵션에 체크하라.

label.font = UIfont.preferredFont(forTextStyle: .body)
label.adjustsFontForContentSizeCategory = true

• 커스텀 폰트에서의 DynamicType

label.font = UIFontMetrics.default.scaledFont(for: customFont) // default는 body

titleLabel.font = UIFontMetrics(forTextStyle: .title1).scaledFont(for: customFont)

• 웹 뷰에서의 처리

body {
	font: -apple-system-body; // 애플 디바이스에서만 동작
}
h1 {
	font-size: 1.3 rem;
}

• 큰 텍스트에 뷰를 적응시키기
  • 단순히 폰트 크기를 키우면 뷰가 깨지고, 글자가 잘린다.
    • 라인 수를 지정하기 보다는 시스템이 라인수를 결정하게 하라(numberOfLine = 0)
  • 기본 텍스트 크기에 맞춘 상수 값은 피하라
    • 베이스 라인 기준 앵커가 도움이 된다.

secondLabel.firstBaselineAnchor.constraintEqualToSystemSpacingBelow(firstLabel.lastBaselineAnchor, multiplier: 1.0) // multiplier 값을 조정한다.

• 오토 레아아웃조차 쓰지 않는 경우는?
  • UIFontMetric은 값 기반으로도 scale 된 값을 구할 수 있다.
• 글자 크기에 따라 레이아웃을 바꿔야 한다면?
  • 현재의 dynamic type값을 알아야 한다.
  • accessibility인 경우를 확인하는 bool 값도 있다.
  • 이거에 따라서 레이아웃을 조정해야 한다.

traitCollection.perferredContentSizeCategory
UIApplication.shared.preferredContentSizeCategory

• 테이블 뷰
  • 기본 테이블 뷰 셀은 dynamic type이 적용되어 있다.
  • 셀프사이징 셀에 대해서는 테이블뷰가 각 셀에 자신의 크기를 제공하도록 요청한다.
  • 화면 밖에 있는 셀에 대해서는 estimated 값을 사용한다.
  • 오토레이아웃 쓰면 자동 처리가능

contentView.layoutMarginsGuide.leadingAnchor.constraint(equalTo: primaryLabel.leadingAnchor)

secondLabel.firstBaselineAnchor.constraintEqualToSystemSpacingBelow(primaryLabel.lastBaselineAnchor, multiplier: 1.0)

primaryLabel.firstBaselineAnchor.constraintEqualToSystemSpacingBelow(contentView.topAnchor, multiplier: 1.0)
contentView.bottomAnchor.constraintEqualToSystemSpacingBelow(secondaryLabel.lastBaselineAnchor, multiplier: 1.0)

• 수동 레이아웃으로 한다면
  • sizeThatFits 메소드를 오버라이드하라
  • contentView.bounds.size.width로 사용가능한 Width를 체크하라
• 이미지에 대해서는?
  • 텍스트는 늘어나는데 이미지는 안 늘어나면 곤란할 수 있다.
  • PDF를 쓰면 쉽게 늘릴 수 있다.
  • asset에 대해서, Preserve Vector Data 옵션을 활성화 한다.
  • imageView에 Adjust Image Size 옵션을 활성화한다

// UIAccessibilityContentSizeCategoryImageAdjusting protocol
// 상위 5단계의 accessibility size를 위해 이미지를 스케일링 함
// UIImageView, UIButton, NSTextAttachment에서 사용 가능
imageView.adjustImageSizeForAccessibilityContentSizeCategory = true

• bar Item을 스무스하게 확대시키기 위해서는 같은 과정을 거쳐야 한다.
  • PDF가 안되면, 큰 이미지라도 넣어라.
  • bar item의 accessibility 항목에 큰 이미지를 넣는다.
    • 여기 안 넣으면 원래 이미지를 확대시킨다.

barButtonItem.largeContentSizeImage = largerImage

• 실전
  • 기본 상태에서는 가로로 배열했다면, 큰 상태에서는 세로로 배열하는 것을 고려해보라
  • 현재 type이 accessibility 상태인지 확인하고 오토 레이아웃을 조정하라