작은 이모티콘 패널 내장 | 사용자 지정 이모티콘 패널 |
 |  |



CustomFaceResource.bundle을 xcode 프로젝트로 드래그합니다. 그 다음 App이 실행될 때 로딩합니다.
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {app = self;// App 실행 시 이모티콘 리소스 로딩[self setupCustomSticker];return YES;}- (void)setupCustomSticker {// 1 사용자 지정 이모티콘 패키지 bundle의 경로 가져오기NSString *customFaceBundlePath = [[NSBundle mainBundle] pathForResource:@"CustomFaceResource" ofType:@"bundle"];// 2 사용자 지정 이모티콘 그룹 로딩// 2.1 programer 이모티콘 리소스 이미지를 로딩하고 TUIFaceCellData로 구문 분석NSMutableArray<TUIFaceCellData *> *faceItems = [NSMutableArray array];for (int i = 0; i <= 17; i++) {TUIFaceCellData *data = [[TUIFaceCellData alloc] init];// 이모티콘 리소스 이미지의 파일명(확장자 없음), 멀티 단말 통신에 사용(멀티 단말 통신시 파일명이 일관되어야 함)data.name = [NSString stringWithFormat:@"yz%02d", i];// 로컬 표시에 사용되는 이모티콘 리소스 이미지의 경로data.path = [customFaceBundlePath stringByAppendingPathComponent:[NSString stringWithFormat:@"programer/%@", data.name]];[faceItems addObject:data];}// 2.2 programer 이모티콘 그룹을 생성하고, TUIFaceGroup으로 구문 분석TUIFaceGroup *programGroup = [[TUIFaceGroup alloc] init];// 이모티콘 패널에서 현재 이모티콘 그룹의 일련번호를 식별하여 멀티 단말 통신에 사용(멀티 단말 통신 시 이모티콘 name과 함께 상대 단말에서 해당 아미지 검색)// groupIndex는 0부터 시작한다는 점에 유의해야 하며, 이모티콘 패널에서 현재 이모티콘 패키지의 실제 위치 식별(내장 이모티콘 그룹 기본값은 0)programGroup.groupIndex = 1;// 사용자 지정 이모티콘 bundle에 있는 현재 이모티콘 패키지의 루트 경로programGroup.groupPath = [customFaceBundlePath stringByAppendingPathComponent:@"programer/"];// 현재 이모티콘 패키지의 이모티콘 리소스programGroup.faces = faceItems;// 현재 이모티콘 패키지의 레이아웃programGroup.rowCount = 2;programGroup.itemCountPerRow = 5;// 현재 이모티콘 패키지의 커버 이미지 경로(확장자 없음)programGroup.menuPath = [customFaceBundlePath stringByAppendingPathComponent:@"programer/menu"];// 3 이모티콘 패널에 program 이모티콘 그룹 추가[TUIConfig.defaultConfig appendFaceGroup:programGroup];}
TUIFaceCellData로 구문 분석하는 name 필드 값은 멀티 단말에서 일관되어야 합니다.TUIFaceGroup으로 구문 분석되는 groupIndex 필드의 값은 멀티 단말에서 일관되어야 합니다.
TUIConfig의 -appendFaceGroup: 메소드를 호출하기만 하면 됩니다.TUIConfig.defaultConfig.faceGroups를 가져옵니다.- (void)setupCustomSticker {// 1 사용자 지정 이모티콘 패키지 bundle의 경로 가져오기NSString *customFaceBundlePath = [[NSBundle mainBundle] pathForResource:@"CustomFaceResource" ofType:@"bundle"];// 2 사용자 지정 이모티콘 그룹 로딩// 2.1 programer 이모티콘 리소스 이미지를 로딩하고 TUIFaceCellData로 구문 분석NSMutableArray<TUIFaceCellData *> *faceItems = [NSMutableArray array];for (int i = 0; i <= 17; i++) {TUIFaceCellData *data = [[TUIFaceCellData alloc] init];// 이모티콘 리소스 이미지의 파일명(확장자 없음), 멀티 단말 통신에 사용(멀티 단말 통신시 파일명이 일관되어야 함)data.name = [NSString stringWithFormat:@"yz%02d", i];// 로컬 표시에 사용되는 이모티콘 리소스 이미지의 경로data.path = [customFaceBundlePath stringByAppendingPathComponent:[NSString stringWithFormat:@"programer/%@", data.name]];[faceItems addObject:data];}// 2.2 programer 이모티콘 그룹을 생성하고, TUIFaceGroup으로 구문 분석TUIFaceGroup *programGroup = [[TUIFaceGroup alloc] init];// 이모티콘 패널에서 현재 이모티콘 그룹의 일련번호를 식별하여 멀티 단말 통신에 사용(멀티 단말 통신 시 이모티콘 name과 함께 상대 단말에서 해당 아미지 검색)// groupIndex는 0부터 시작한다는 점에 유의해야 하며, 이모티콘 패널에서 현재 이모티콘 패키지의 실제 위치 식별(내장 이모티콘 그룹 기본값은 0)programGroup.groupIndex = 0;// 사용자 지정 이모티콘 bundle에 있는 현재 이모티콘 패키지의 루트 경로programGroup.groupPath = [customFaceBundlePath stringByAppendingPathComponent:@"programer/"];// 현재 이모티콘 패키지의 이모티콘 리소스programGroup.faces = faceItems;// 현재 이모티콘 패키지의 레이아웃programGroup.rowCount = 2;programGroup.itemCountPerRow = 5;// 현재 이모티콘 패키지의 커버 이미지 경로(확장자 없음)programGroup.menuPath = [customFaceBundlePath stringByAppendingPathComponent:@"programer/menu"];// 3 이모티콘 패널 맨 앞에 programer 이모티콘 그룹 추가// 3.1 내장 이모티콘 그룹 가져오기NSMutableArray *faceGroupsMenu = [NSMutableArray arrayWithArray:TUIConfig.defaultConfig.faceGroups];// 3.2 이모티콘 그룹 맨 앞에 programer 추가[faceGroupsMenu insertObject:programGroup atIndex:0];// 3.3 이모티콘 패널 재할당TUIConfig.defaultConfig.faceGroups = faceGroupsMenu;// 4 내장된 이모티콘의 순서를 변경하지 않으려면 순서대로 추가하면 됩니다.// [TUIConfig.defaultConfig appendFaceGroup:programGroup];// groupIndex가 실제 순서와 일치하는지 확인해야 합니다// 현재 위치를 직접 읽고 복사할 수 있습니다programGroup.groupIndex = [TUIConfig.defaultConfig.faceGroups indexOfObject:programGroup];}
TUIFaceGroup의 menuPath 속성에 커버 이미지의 경로(@2x.png 확장자 없음)를 설정하여 이모티콘 그룹의 커버를 사용자 지정할 수 있습니다.menu@2x.png 이미지를 커버 이미지로 사용합니다.- (void)setupCustomSticker {....// 2.2 programer 이모티콘 그룹을 생성하고, TUIFaceGroup으로 구문 분석TUIFaceGroup *programGroup = [[TUIFaceGroup alloc] init];....// 현재 이모티콘 패키지의 커버 이미지 경로(확장자 없음)programGroup.menuPath = [customFaceBundlePath stringByAppendingPathComponent:@"programer/menu"];........}
- (void)setupCustomSticker {...// 2.2 programer 이모티콘 그룹을 생성하고, TUIFaceGroup으로 구문 분석TUIFaceGroup *programGroup = [[TUIFaceGroup alloc] init];// 현재 이모티콘 패키지의 레이아웃programGroup.rowCount = 2;programGroup.itemCountPerRow = 5;...}

TUIInputController의 -faceView:didSelectItemAtIndexPath: 메소드가 트리거되며, 선택한 이모티콘 이름과 해당 이모티콘 그룹의 패널 내 인덱스 정보가 콜백됩니다.- (void)faceView:(TUIFaceView *)faceView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{TUIFaceGroup *group = [TUIConfig defaultConfig].faceGroups[indexPath.section];TUIFaceCellData *face = group.faces[indexPath.row];if(indexPath.section == 0){// 내장된 작은 이모티콘인 경우, 작은 이모티콘을 입력란에 표시해야 합니다[_inputBar addEmoji:face];}else{// 사용자 지정 이모티콘인 경우, 상대방에게 직접 전송if (face.name) {// 이모티콘 메시지 생성V2TIMMessage *message = [[V2TIMManager sharedInstance] createFaceMessage:group.groupIndex data:[face.name dataUsingEncoding:NSUTF8StringEncoding]];// 상대방에게 전송if(_delegate && [_delegate respondsToSelector:@selector(inputController:didSendMessage:)]){[_delegate inputController:self didSendMessage:message];}}}}
TUIFaceMessageCellData의 - getCellData: 메소드를 트리거하고 이모티콘을 표시하기 위해 이모티콘 메시지를 TUIFaceMessageCellData로 구문 분석합니다.+ (TUIMessageCellData *)getCellData:(V2TIMMessage *)message{// 메시지 수신 후 이모티콘 정보 가져오기V2TIMFaceElem *elem = message.faceElem;// 이모티콘 표시를 위한 TUIFaceMessageCellData 생성TUIFaceMessageCellData *faceData = [[TUIFaceMessageCellData alloc] initWithDirection:(message.isSelf ? MsgDirectionOutgoing : MsgDirectionIncoming)];// 이모티콘 패널에서 현재 이모티콘 그룹의 순서 가져오기faceData.groupIndex = elem.index;// 이모티콘 이미지 파일명 가져오기faceData.faceName = [[NSString alloc] initWithData:elem.data encoding:NSUTF8StringEncoding];// 이모티콘 이미지의 이름과 이모티콘 그룹에 따라 로컬 이모티콘 패키지에서 이모티콘 이미지의 특정 경로 가져오기for (TUIFaceGroup *group in [TUIConfig defaultConfig].faceGroups) {if(group.groupIndex == faceData.groupIndex){NSString *path = [group.groupPath stringByAppendingPathComponent:faceData.faceName];faceData.path = path;break;}}faceData.reuseId = TFaceMessageCell_ReuseId;return faceData;}
피드백