iOSカスタム表情キーボード

一、emojiの表情について

iOSシステムのバージョンアップに伴い、オリジナルemojiの表情へのサポートもますます豊富になっています.Emoji表情はunicode符号の中で表情記号のために設計された符号化のセットであり、もちろんunicodeとは独立したもう一つの符号化SBUnicodeもあり、iOSシステムではこの2つの符号化がよくサポートされている.UIシステムは自動的にコードを表情記号に変換します.例えば、SBUnicodeは次のコードを使用します.

  UILabel * label = [[UILabel alloc]initWithFrame:CGRectMake(100, 100, 100, 100)];
    label.font = [UIFont systemFontOfSize:25];
    label.text = @"\uE056";
    [self.view addSubview:label];

画面に笑顔が表示されます.
      

二、表情キーボードの構想を開発する

まず、プラットフォームをまたぐために、iOS端子、andorid端子、web端子にかかわらず、同じ基準が必要です.この基準は国際Unicode符号化であり、表情文字をunicode符号化してから伝送することを考えています.unicodeに変換して転送するメリットは、すべてのプラットフォームで使用できる表情の統一を保証できることです.iOS側では、SBUnicodeコードを通じてクライアントに表情記号を表示することができ、このコードの配列は非常に規則的であることが知られています.この特徴によって、SBUnicodeコードの範囲を遍歴することで表情の作成を行うことができ、画像素材の面倒を省くことができます.
iOSで利用可能な表情unicodeの範囲は、0 xE 001~0 xE 05 A、0 xE 101~0 xE 15 A、
0xE201~0xE253,0xE401~0xE44C,0xE501~0xE537.
データ・ソースの配列には、遍歴的な方法で追加できます.

int emojiRangeArray[10] = {0xE001,0xE05A,0xE101,0xE15A,0xE201,0xE253,0xE401,0xE44C,0xE501,0xE537};
    for (int j = 0 ; j<10 ; j+=2 ) {
        
        int startIndex = emojiRangeArray[j];
        int endIndex = emojiRangeArray[j+1];
        
        for (int i = startIndex ; i<= endIndex ; i++ ) {
        // 
            [dataArray addObject:[NSString stringWithFormat:@"%C", (unichar)i]];
        }
    }

キーボードの配置は、collectionViewで行うことができ、非常に便利です.

    // ， view
    bgView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 200)];
    // 
    pageControlBottom = [[UIPageControl alloc]initWithFrame:CGRectMake(0, 170, [UIScreen mainScreen].bounds.size.width, 20)];
    [bgView addSubview:pageControlBottom];
    //collectionView 
    UICollectionViewFlowLayout * layout = [[UICollectionViewFlowLayout alloc]init];
    // 
    layout.scrollDirection=UICollectionViewScrollDirectionHorizontal;
    // 30*30
    layout.itemSize=CGSizeMake(30, 30);
    // 
    float xOffset = (kscreenWidth-7*30-10*6)/2;
    // 
    layout.sectionInset=UIEdgeInsetsMake(10, xOffset, 10, xOffset);
    scrollView = [[UICollectionView alloc]initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 160) collectionViewLayout:layout];
    // 
    scrollView.pagingEnabled = YES;
    // 
    layout.minimumLineSpacing=10;
    layout.minimumInteritemSpacing=5;
    
    scrollView.delegate=self;
    scrollView.dataSource=self;
    scrollView.backgroundColor = bgView.backgroundColor;
    [bgView addSubview:scrollView];

collectionViewのコールバックメソッドでは、次のように処理されます.

// 28 
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    if (((dataArray.count/28)+(dataArray.count%28==0?0:1))!=section+1) {
         return 28;
    }else{
        return dataArray.count-28*((dataArray.count/28)+(dataArray.count%28==0?0:1)-1);
    }
   
}
// 
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
    return (dataArray.count/28)+(dataArray.count%28==0?0:1);
}
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    UICollectionViewCell * cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"biaoqing" forIndexPath:indexPath];
    for (int i=cell.contentView.subviews.count; i>0; i--) {
        [cell.contentView.subviews[i-1] removeFromSuperview];
    }
    UILabel * label = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, 30, 30)];
    label.font = [UIFont systemFontOfSize:25];
    label.text =dataArray[indexPath.row+indexPath.section*28] ;
   
    
    [cell.contentView addSubview:label];
    return cell;
}
-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
    NSString * str = dataArray[indexPath.section*28+indexPath.row];
    // textField 
    
}
// 
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
    CGFloat contenOffset = scrollView.contentOffset.x;
    int page = contenOffset/scrollView.frame.size.width+((int)contenOffset%(int)scrollView.frame.size.width==0?0:1);
    pageControlBottom.currentPage = page;

}

三、システムキーボードとカスタム表情キーボードを切り替える

UItextFieldとUItextViewには、次の属性と方法があります.

@property (nullable, readwrite, strong) UIView *inputView;   
- (void)reloadInputViews;

InputViewではtextViewとtextFieldを第1応答として設定できます.nilに設定しないか、nilに設定しないとシステムキーボードがポップアップされます.reloadInputViewメソッドでは、この添付ファイルビューをリフレッシュできます.この2つを使用すると、キーボードの切り替えを簡単に実現できます.たとえば、出発方法で次のように処理します.

-(void)imageViewTap{
    if (![_publishContent isFirstResponder]) {
        return;
    }
    if (isEmoji==NO) {
        isEmoji=YES;
        // 
        _textView.inputView=bgView;
        [_textView reloadInputViews];
    }else{
        isEmoji=NO;
        _textView.inputView=nil;
        [_textView reloadInputViews];
    }

    
}

効果は次のとおりです.