2) iOS
Native 광고 적용을 위해서는 Tnk 사이트에서 앱 등록 및 TnkAd SDK 관련 설정이 필요합니다.
[iOS Settings] 내용을 우선 확인해 주세요.
[TnkNativeAd Loading]
아래와 같이 호출하여 Landscape 형태의 소재이미지를 사용하는 Native Ad를 로딩할 수 있습니다.
NativeAdItem
#import "tnksdk.h"
@interface ViewController : UIViewController <TnkNativeAdDelegate> {
// ...
}
@end
@implementation ViewController {
TnkNativeAd *tnkNative;
}
- (void)viewDidLoad {
[super viewDidLoad];
// 1) Native Ad 광고용 객체 생성
tnkNative = [[TnkNativeAd alloc] init];
tnkNative.adStyle = AD_STYLE_LANDSCAPE; // 가로 이미지 가져오도록 설정한다.
// 2) 네이티브 광고 한건 가져온다.
[tnkNative prepare:@"cross_first" delegate:self];
}
#pragma mark - TnkNativeAdDelegate
- (void) didNativeAdLoad:(TnkNativeAd *)ad {
NSLog(@"Native Ad Loaded : %@", ad.logicName);
// Rendering native Ad
}
[NativeAd 표시하기]
Native Ad 데이터가 로딩되면 TnkNativeAdDelegate의 didNativeAdLoad: 메소드가 호출되며 이때 TnkNativeAd 객체가 파라메터로 전달됩니다.
전달된 TnkNativeAd 객체가 제공하는 데이터를 사용하여 Native Ad를 화면에 표시합니다.
Rendering Native Ad
#pragma mark - TnkNativeAdDelegate
- (void) didNativeAdLoad:(TnkNativeAd *)ad {
NSLog(@"Native Ad Loaded : %@", ad.logicName);
// Rendering native Ad
[self.coverImageView setImage:[ad getCoverImage]];
[self.iconImageView setImage:[ad getIconImage]];
[self.titleLabel setText:[ad getTitle]];
[self.descLabel setText:[ad getDescription]];
[ad attachLayout:self.coverImageView];
}
광고가 화면에 노출될 때의 Impression 처리는 SDK에서 자동으로 처리됩니다. 이를 위해서는 Native Ad를 화면에 표시하고 있는 UIView 객체를 TnkNativeAd의 attachLayout: 메소드를 사용하여 지정해야합니다.
로딩된 Native 광고가 더 이상 필요하지 않는 경우에는 detachLayout을 호출한 후 TnkNativeAd 객체를 재 사용할 수 있습니다.
[NativeAd 클릭처리]
사용자가 Native Ad를 클릭하였을때 광고 페이지로 이동하는 것은 2가지 방법이 있습니다. 첫번째는 attachLayout:clickView: 메소드를 사용하여 attachLayout 의 두번째 파라메터로 클릭 이벤트를 처리할 UIView를 지정하는 방법입니다. 이때에 사용자가 clickView로 지정한 UIView 를 tap 할 경우 자동으로 광고 페이지로 이동합니다. 두번째 방법은 클릭 처리를 직접 코딩하는 방법입니다. 클릭 이벤트 발생시 TnkNativeAd 객체의 handleClick 메소드를 호출합니다.
Native Ad Click #1
#pragma mark - TnkNativeAdDelegate
- (void) didNativeAdLoad:(TnkNativeAd *)ad {
NSLog(@"Native Ad Loaded : %@", ad.logicName);
// Rendering native Ad
[self.coverImageView setImage:[ad getCoverImage]];
[self.iconImageView setImage:[ad getIconImage]];
[self.titleLabel setText:[ad getTitle]];
[self.descLabel setText:[ad getDescription]];
// AttachLayout의 두번째 파라미터로 클릭대상 View를 지정한다.
[ad attachLayout:self.coverImageView clickView:self.coverImageView];
}
Native Ad Click #2
#pragma mark - TnkNativeAdDelegate
- (void) didNativeAdLoad:(TnkNativeAd *)ad {
NSLog(@"Native Ad Loaded : %@", ad.logicName);
// Rendering native Ad
[self.coverImageView setImage:[ad getCoverImage]];
[self.iconImageView setImage:[ad getIconImage]];
[self.titleLabel setText:[ad getTitle]];
[self.descLabel setText:[ad getDescription]];
[ad attachLayout:self.coverImageView];
}
// 클릭 이벤트 발생기 handleClick 메소드를 호출한다.
- (IBAction) didNativeAdButtonPressed:(id)sender {
[tnkNative handleClick];
}
[TnkNativeAdDelegate]
Native Ad의 로딩이 완료되거나 화면에 노출되는 경우 또는 사용자가 광고를 클릭하는 경우 해당 이벤트 발생시점에 필요한 로직을 구현하기 위해서
아래의 TnkNativeAdDelegate 프로토콜을 구현합니다.
TnkNativeAdDelegate Protocol
#define AD_FAIL_NO_AD -1 // no ad available
#define AD_FAIL_NO_IMAGE -2 // ad image not available
#define AD_FAIL_TIMEOUT -3 // ad arrived after 5 secs.
#define AD_FAIL_SYSTEM -9
@protocol TnkNativeAdDelegate <NSObject>
@optional
- (void) didNativeAdFail:(TnkNativeAd *)ad error:(int)errCode;
- (void) didNativeAdLoad:(TnkNativeAd *)ad;
- (void) didNativeAdClick:(TnkNativeAd *)ad;
- (void) didNativeAdShow:(TnkNativeAd *)ad;
@end
[TnkNativeAd Interface]
TnkNativeAd Interface
@interface TnkNativeAd : NSObject <TnkServiceCallback>
@property (nonatomic, weak) id<TnkNativeAdDelegate> delegate;
@property (nonatomic, strong) NSString *logicName;
@property (nonatomic, assign) NSInteger adStyle;
- (void) prepare:(NSString *)logicName;
- (void) prepare:(NSString *)logicName delegate:(id<TnkNativeAdDelegate>)delegate;
- (void) prepare;
// Common data for PPI, CPC
- (UIImage *) getCoverImage;
- (UIImage *) getIconImage;
- (NSString *) getTitle;
- (NSString *) getDescription;
// for PPI only
- (NSString *) getPointName;
- (NSNumber *) getRewardPoint;
- (NSInteger) getRewardType;
- (NSString *) getActionText;
// attach, detach
- (void) attachLayout:(UIView *)view;
- (void) attachLayout:(UIView *)view clickView:(UIView *)clickView;
- (UIView *) getAttachedLayout;
- (void) detachLayout;
- (void) handleClick;
@end
- properties
- Ad Style
표현하고자하는 광고 형태에 맞추어 AdStyle을 지정합니다.
- Cover Image
AD_STYLE_TEXT_ONLY : Cover Image를 사용하지 않는 경우 지정합니다.
AD_STYLE_PORTRAIT : 세로 방향의 Cover Image를 사용하는 경우 지정합니다.
AD_STYLE_LANDSCAPE : 가로 방향의 Cover Image를 사용하는 경우 지정합니다.
AD_STYLE_SQUARE : 정방형의 Cover Image를 사용하는 경우 지정합니다.
AD_STYLE_BANNER_LANDSCAPE : 가로 배너 소재 이미지입니다. (720 x 100)
AD_STYLE_BANNER_LANDSCAPE_200 : 가로 배너 소재 이미지입니다. (720 x 200)
- Ad Icon
AD_STYLE_ICON : Icon 이미지를 필요로 할 때 지정합니다.
Cover Image와 Ad Icon 설정은 OR 연산을 사용하여 동시에 지정할 수 있습니다.
적용 예시
Ad Style 적용 예시
tnkNative = [[TnkNativeAd alloc] init];
// 가로 이미지와 아이콘 이미지를 가져오도록 설정한다.
tnkNative.adStyle = AD_STYLE_LANDSCAPE | AD_STYLE_ICON;
// 세로 이미지를 가져오도록 설정한다. (아이콘 이미지는 사용하지 않음)
tnkNative.adStyle = AD_STYLE_PORTRAIT;
// 커버이미지 사용하지 않고 아이콘 이미지만 가져오도록 설정한다.
tnkNative.adStyle = AD_STYLE_ICON;
// 커버이미지와 아이콘이미지를 모두 사용하지 않고 Text 문구만 사용한다.
tnkNative.adStyle = AD_STYLE_TEXT_ONLY;
- prepare
Method
- (void) prepare
- (void) prepare:(NSString *)logicName
- (void) prepare:(NSString *)logicName delegate:(id<TnkNativeAdDelegate>)delegate
Description
Native 광고를 서버에서 한건 로딩합니다. logicName 과 delegate 파라메터는 properties에 설명된 것과 같습니다.
Native 광고가 로딩이 완료되면 delegate의 didNativeAdLoad: 가 호출되며
로딩이 실패하면 didNativeAdFail:error: 가 호출됩니다.
만약에 prepare 를 호출하고 로딩된 광고가 화면에 표시되기 전에 다시 prepare 를 호출하면 그 prepare는 무시됩니다.
- Native Ad 항목 가져오기
NativeAdItem의 loading이 완료되면 아래의 메소드들을 사용하여 광고 표시를 위한 항목들에 접근할 수 있습니다.
- (NSString *) getTitle : 광고 타이틀을 반환합니다.
- (NSString *) getDescription : 광고 설명 문구를 반환합니다.
- (UIImage *) getIconImage : 광고 Icon 이미지를 반환합니다. Ad Style 파라미터로 AD_STYLE_ICON 이 지정되지 않은 경우에는 null 이 반환됩니다.
- (UIImage *) getCoverImage : 광고 cover 이미지를 반환합니다. Ad Style 파라미터로 AD_STYLE_PORTRAIT 나 AD_STYLE_LANDSCAPE를 지정하지 않았다면 null 이 반환됩니다.
보상형 광고의 경우에는 아래의 항목들을 추가적으로 제공합니다.
- (NSNumber *) getRewardPoint : 사용자가 광고에 참여하여 받을 수 있는 포인트를 반환합니다.
- (NSString *) getPointName : 포인트의 명칭을 반환합니다. (예 : 크리스탈, 루비, 골드 등)
- (NSInteger) getRewardType : 리워드 지급 방식을 반환합니다. (1: 실횅형, 2: 액션형)
- (NSString *) getActionText : 리워드 지급 방식이 액션형인 경우 사용자가 수행해야할 액션에 대한 설명을 반환합니다.
- Attach & Detach Layout
광고의 내용이 화면에 표시되면 화면의 광고 영역을 TnkNativeAd 객체에 attach 해주어야 합니다. 이를 위해서 attachLayout: 메소드를 호출합니다. 이후에는 광고의 노출에 대한 Impression 처리와 사용자가 광고를 클릭했을 경우 페이지 이동에 대한 처리가 자동적으로 이루어 집니다.
- (void) attachLayout:(UIView *)view
광고가 표현된 영역을 지정합니다.
- (void) attachLayout:(UIView *)view clickView:(UIView *)clickView;
광고가 표현된 영역을 지정하고 clickView로 지정된 view에 대해서 click 처리를 합니다.
- (void) detachLayout
광고 영역에 다른 광고를 보여줄 경우에는 우선 기존에 attach되어 있는 TnkNativeAd 객체의 detachLayout 메소드를 호출하여야 합니다. 이 경우 detach된 TnkNativeAd 객체는 상태가 초기화가 되며 다시 사용하기 위해서는 prepare를 호출하여 다시 광고를 loading 해야합니다.
TnkNativeAd 객체의 lifecycle은 아래와 같습니다.
Instantiated -> prepare -> attachLayout -> detachLayout
^ |
+---------------------------+