NinePatch 이미지는 이미지 자체처럼 중앙을 늘리되 가장자리는 그대로 유지할 수 있는 특수한 PNG 이미지입니다. 이러한 이미지는 확장 가능한 버튼, 배경 및 기타 UI 요소에 매우 유용합니다. 이 문서에서는 NinePatchKit 라이브러리를 사용하여 iOS 및 macOS 애플리케이션에서 NinePatch 이미지를 구현하는 방법에 대해 설명합니다.
iOS 및 macOS에서 NinePatch 이미지 사용하기
1. NinePatch 이미지 생성
먼저 NinePatch 이미지를 생성해야 합니다. 9 Patch Editor 도구를 사용하여 이미지를 생성하는 것을 권장합니다. 과정은 다음과 같습니다.
- 9 Patch Editor 사이트로 이동합니다.
- NinePatch로 변환하려는 PNG 이미지를 업로드합니다.
- 경계를 정의하고 (가장자리를 드래그하여 수행 가능) 결과를 미리 봅니다.
- 결과 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 이미지를 로드합니다. NinePatchImageView는 UITableViewCell과 유사하며, 더 복잡한 레이아웃을 위해 contentView에 추가적인 하위 뷰를 추가할 수 있습니다.
5. 요약
이제 NinePatch 그래픽을 사용하여 iOS 및 macOS 애플리케이션에서 쉽게 사용할 수 있습니다. NinePatchKit 라이브러리를 사용하면 고품질의 확장 가능한 이미지를 쉽게 렌더링하여 인터페이스 경험을 개선할 수 있습니다.
참고
- 이미지 형식: 이미지가 올바른 PNG 형식인지, 필요한 모든 NinePatch 메타데이터를 포함하고 있는지 확인합니다.
- 이미지 위치: NinePatch를 프로젝트의 리소스 패키지에 포함하고 올바른 경로로 로드합니다.
Image Set에 NinePatch를 넣지 마십시오. 이미지 형식을 손상시킬 수 있습니다.