SoFunction
Updated on 2025-04-03

Simple implementation code for iOS emoji keyboard

Recently, I used the emoticon keyboard and went online to search for it. I felt that the online people were written for greater needs, and I didn’t need it, so I wrote a simple implementation myself.
1. The expression string used is fromEmojiplist fileobtained from;

2. Need to add an observer:

[[NSNotificationCenter defaultCenter]addObserver:self selector:@selector(keyboardWillShow:) name:UIKeyboardWillShowNotification object:nil];
 
- (void)keyboardWillShow:(NSNotification *)notification
{
  // Keyboard display\Hide frame  CGRect frame = [[UIKeyboardFrameEndUserInfoKey] CGRectValue];
  // Animation time  CGFloat duration = [[UIKeyboardAnimationDurationUserInfoKey] doubleValue];
   
  // Animation  [UIView animateWithDuration:duration animations:^{
     = -;
  }];
}

3. Create control:

  //Declared global variables:  UIButton *commentView;
  UIView *commentWhiteColorView;
  UITextField *commentTextField;
  UIButton *emojiAndKeyboardButton;
 
- (void)initCommentToolbarView
{
  commentView = [[UIButton alloc]initWithFrame:CGRectMake(0, 0, kScreenWidth, kScreenHeight + 230)];
   = YES;
  [commentView addTarget:self action:@selector(commentViewAction) forControlEvents:UIControlEventTouchUpInside];
  [ addSubview:commentView];
   
  commentWhiteColorView = [UIView viewWithFrame:CGRectMake(0, kScreenHeight - 50, kScreenWidth, 50) backgroundColor:[UIColor whiteColor]];
   = [UIColor whiteColor];
  [commentView addSubview:commentWhiteColorView];
   
  UIView *lightGrayLineView = [UIView viewWithFrame:CGRectMake(0, 0, kScreenWidth, 1) backgroundColor:RGB(240, 240, 240)];
  [commentWhiteColorView addSubview:lightGrayLineView];
   
  //Text input box  commentTextField = [[UITextField alloc]initWithFrame:CGRectMake(10, 5, kScreenWidth - (10 + 42 + 60), 40)];
   = FONT(14);
   = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 10, 40)];
   = UITextFieldViewModeAlways;
   = RGB(234, 234, 234);
   = @"Comment";
  [commentWhiteColorView addSubview:commentTextField];
   
  //Emoji and keyboard switch button  emojiAndKeyboardButton = [UIButton buttonWithType:UIButtonTypeCustom];
   = CGRectMake( + 7, 0, 35, 50);
  [emojiAndKeyboardButton setImage:[UIImage imageNamed:@"icon_emoji_input"] forState:UIControlStateNormal];
  [emojiAndKeyboardButton setImage:[UIImage imageNamed:@"icon_keyboard_input"] forState:UIControlStateSelected];
  [emojiAndKeyboardButton addTarget:self action:@selector(emojiAndKeyboardButtonAction:) forControlEvents:UIControlEventTouchUpInside];
  [commentWhiteColorView addSubview:emojiAndKeyboardButton];
   
  //Send Button  UIButton *sendButton = [UIButton buttonWithFrame:CGRectMake(, , 50, 40) type:UIButtonTypeCustom title:@"send" titleColor:RGB(135, 135, 135) imageName:nil action:@selector(sendButtonAction) target:self];
   = FONT(14);
  [sendButton setBorder:1 color:RGB(135, 135, 135)];
  [sendButton setCornerRadius:3];
  [commentWhiteColorView addSubview:sendButton];
   
  //Expression scroll view  emojiScrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(0, , kScreenWidth, 200)];
   = RGB(244, 244, 246);
   = self;
   = YES;
  [commentView addSubview:emojiScrollView];
   
  //Array of emoticon strings obtained from the file  emojiArray = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle]pathForResource:@"Emoji" ofType:@"plist"]];
   
  CGFloat emojiButtonWidth = kScreenWidth/8;
   
  int i = 0;
  //Part the pages upward  int page = ceilf(/32.0);
   
  //The page controller in UIKit  pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, , kScreenWidth, 30)];
   = page;
   = RGB(244, 244, 246);
   = RGB(206, 206, 206);
   = RGB(121, 121, 121);
  [commentView addSubview:pageControl];
   
  //Set the contentSize of the emoticon scroll view   = CGSizeMake(kScreenWidth * page, 200);
  //Create emoji buttons  for (int currentPage = 0; currentPage < page; currentPage++) {
    for (int row = 0; row < 4; row++) {
      for (int column = 0; column < 8; column++) {
        UIButton *emojiButton = [UIButton buttonWithType:UIButtonTypeCustom];
        if (row == 3 && column == 7) {
          //If it is row 4 and column 8, set the image to delete the expression instead of the string and call another method          [emojiButton setImage:[UIImage imageNamed:@"back_icon_input"] forState:UIControlStateNormal];
          [emojiButton addTarget:self action:@selector(deleteEmojiAction) forControlEvents:UIControlEventTouchUpInside];
        }else{
          [emojiButton setTitle:emojiArray[i++] forState:UIControlStateNormal];
          [emojiButton addTarget:self action:@selector(emojiButtonAction:) forControlEvents:UIControlEventTouchUpInside];
        }
         = CGRectMake(emojiButtonWidth * column + currentPage * kScreenWidth, 50 * row, emojiButtonWidth, 50);
        [emojiScrollView addSubview:emojiButton];
         
        //Breaking the loop when i is equal to the array count        if (i == ) {
          break;
        }
      }
    }
  }
   
  // Add the last delete emoticon button manually  UIButton *emojiButton = [UIButton buttonWithType:UIButtonTypeCustom];
  [emojiButton setImage:[UIImage imageNamed:@"back_icon_input"] forState:UIControlStateNormal];
   = CGRectMake(emojiButtonWidth * 7 + 5 * kScreenWidth, 50 * 3, emojiButtonWidth, 50);
  [emojiButton addTarget:self action:@selector(deleteEmojiAction) forControlEvents:UIControlEventTouchUpInside];
  [emojiScrollView addSubview:emojiButton];
}
 
//Emoji Button Event- (void)emojiButtonAction:(UIButton *)sender
{
//  NSLog(@"%@",);
  NSMutableString *oldText = [NSMutableString stringWithString:];
  [oldText appendString:];
   = oldText;
}
 
//Delete emoji button event- (void)deleteEmojiAction
{
  if ( > 1) {
    //Judge whether it is an expression, the expression length is 2, so minus 2    if ([emojiArray containsObject:[ substringWithRange:NSMakeRange( - 2, 2)]]) {
       = [ substringToIndex: - 2];
    }else{
       = [ substringToIndex: - 1];
    }
  }else{
     = @"";
  }
}
 
//Adjust pageControl in proxy method- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
  if (scrollView == emojiScrollView) {
     = /;
  }
}
 
//Emoji and keyboard toggle button event- (void)emojiAndKeyboardButtonAction:(UIButton *)sender
{
   = !;
   
  if ( == YES) {
    [commentTextField resignFirstResponder];
     
    [UIView animateWithDuration:0.5 animations:^{
       = -230;
    }];
  }else{
    [commentTextField becomeFirstResponder];
  }
}
 
- (void)commentViewAction
{
  [commentTextField resignFirstResponder];
   
   = YES;
   = 0;
   = @"";
   = NO;
}

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.