iOS 및 macOS에서 NinePatch 이미지 사용 방법

2025년 1월 9일

NinePatch 이미지는 이미지 자체처럼 중앙을 늘리되 가장자리는 그대로 유지할 수 있는 특수한 PNG 이미지입니다. 이러한 이미지는 확장 가능한 버튼, 배경 및 기타 UI 요소에 매우 유용합니다. 이 문서에서는 NinePatchKit 라이브러리를 사용하여 iOS 및 macOS 애플리케이션에서 NinePatch 이미지를 구현하는 방법에 대해 설명합니다.

iOS 및 macOS에서 NinePatch 이미지 사용하기

1. NinePatch 이미지 생성

먼저 NinePatch 이미지를 생성해야 합니다. 9 Patch Editor 도구를 사용하여 이미지를 생성하는 것을 권장합니다. 과정은 다음과 같습니다.

  1. 9 Patch Editor 사이트로 이동합니다.
  2. NinePatch로 변환하려는 PNG 이미지를 업로드합니다.
  3. 경계를 정의하고 (가장자리를 드래그하여 수행 가능) 결과를 미리 봅니다.
  4. 결과 NinePatch 이미지를 다운로드합니다. 다운로드 옵션에서 "컴파일된 이미지로 저장" 옵션을 선택했는지 확인합니다. 이렇게 하면 이미지가 NinePatchKit에서 올바르게 파싱할 수 있도록 필요한 모든 메타데이터를 포함하게 됩니다.

2. 프로젝트에 NinePatch 이미지 포함

NinePatch 이미지를 bundle, Data Set 또는 원하는 위치에 포함할 수 있지만 Image Set에는 절대 추가하지 마십시오. 빌드하는 동안 Image Set에 있는 모든 png는 CgBI 청크 임베딩을 통해 최적화되며 추가 청크가 없으므로 Image Set에 있는 NinePatch 이미지는 수정으로 인해 더 이상 형식을 구문 분석하는 데 올바르게 작동하지 않습니다.

3. NinePatchKit 가져오기

다음으로, NinePatchKit 라이브러리를 사용하여 NinePatch 이미지를 만들고 렌더링해야 합니다. 이 오픈 소스 라이브러리는 NinePatch 이미지에 대한 매우 간단한 API를 제공하여 iOS 및 macOS의 애플리케이션 내에서 사용을 간소화합니다. CocoaPods를 통해 프로젝트에 연결하거나 프로젝트 내에 코드를 수동으로 추가할 수 있습니다.

  • CocoaPods 사용: Podfile에 다음 줄을 추가합니다.

    pod 'NinePatchKit'
    

    그런 다음 pod install을 실행합니다.

  • 수동 통합: NinePatchKit 라이브러리를 다운로드하고 NinePatchUtils 폴더를 프로젝트에 추가합니다.

4. 코드에서 NinePatch 이미지 사용

이제 NinePatchKit을 사용하여 NinePatch 이미지를 로드하고 렌더링할 수 있습니다. 다음은 NinePatchImageView에서 사용하는 방법을 보여주는 간단한 예입니다.

#import <NinePatchKit/NinePatchKit.h>
...
NSString * path = [[NSBundle mainBundle] pathForResource:@"YourNinePatchImageName" ofType:@"png"];
NinePatchImageView * imageView = [[NinePatchImageView alloc] init];
imageView.showImage = [NinePatchUtils imageWithContentsOfFile:path];

[imageView.contentView addSubview:CustomView]; // contentView에 서브뷰 추가

"YourNinePatchImageName"을 NinePatch 이미지 이름으로 바꿉니다(확장자 제외). 이 코드 스니펫은 NinePatchImageView를 만들고 NinePatchUtils를 사용하여 NinePatch 이미지를 로드합니다. NinePatchImageViewUITableViewCell과 유사하며, 더 복잡한 레이아웃을 위해 contentView에 추가적인 하위 뷰를 추가할 수 있습니다.

5. 요약

이제 NinePatch 그래픽을 사용하여 iOS 및 macOS 애플리케이션에서 쉽게 사용할 수 있습니다. NinePatchKit 라이브러리를 사용하면 고품질의 확장 가능한 이미지를 쉽게 렌더링하여 인터페이스 경험을 개선할 수 있습니다.

참고

  • 이미지 형식: 이미지가 올바른 PNG 형식인지, 필요한 모든 NinePatch 메타데이터를 포함하고 있는지 확인합니다.
  • 이미지 위치: NinePatch를 프로젝트의 리소스 패키지에 포함하고 올바른 경로로 로드합니다. Image Set에 NinePatch를 넣지 마십시오. 이미지 형식을 손상시킬 수 있습니다.