iOS自定义的emoji表情键盘

iOS自定义的表情键盘

一、关于emoji表情

        随着iOS系统版本的升级，对原生emoji表情的支持也越来越丰富。emoji表情是unicode码中为表情符号设计的一组编码，当然，还有独立于unicode的另一套编码SBUnicode，在OS系统中，这两种编码都有很好的支持。UI系统会自动帮我们将编码转义成表情符号，例如用SBUnicode如下代码：

?


1

2

3

4

  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码一一对应，在转码的时候，我们一一遍历，转换成unicode后进行传输，这样的好处是我们可以保证所有平台所能使用的表情统一。在iOS端，可以有另一种方式，通过上面我们知道，通过SBUnicode码我们可以在客户端显示表情符号，并且这个码的排列是十分有规律的，通过这个特点，我们可以通过遍历SBUnicode码的范围进行表情的创建，省去的图片素材的麻烦。

        iOS中可用的表情unicode范围是：0xE001~0xE05A,0xE101~0xE15A,

0xE201~0xE253,0xE401~0xE44C,0xE501~0xE537。

        我们可以通过遍历的方法，将其都加入数据源数组中：

?


1

2

3

4

5

6

7

8

9

10

11

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来做，十分方便：

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

    //为了摆放分页控制器，创建一个背景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的回调方法中，处理如下：

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

//每页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都会有下面这个属性和方法：

?


1

2

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

- (void)reloadInputViews;

inputView我们可以设置textView和textField成为第一响应时的弹出附件，如果我们不设置或者设置为nil，则会弹出系统键盘，reloadInputView方法可以使我们刷新这个附件视图，通过这两个，我们可以非常轻松的实现键盘的切换，比如我们在一个出发方法中如下处理：

?


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

-(void)imageViewTap{

    if (![_publishContent isFirstResponder]) {

        return;

    }

    if (isEmoji==NO) {

        isEmoji=YES;

        //呼出表情

        _textView.inputView=bgView;

        [_textView reloadInputViews];

    }else{

        isEmoji=NO;

        _textView.inputView=nil;

        [_textView reloadInputViews];

    }

 

     

}

效果如下：

           

追注：测试上面的SBUnicode码在模拟器上可以正常显示，真机并不能识别，可以通过将表情符全部添加到一个plist文件中，通过文件读取来创建键盘的方式进行真机上的开发。plist文件地址如下：

http://pan.baidu.com/s/1o6AdkBw


时间： 2024-10-30 13:04:52

iOS自定义的emoji表情键盘的相关文章

iOS中判断Emoji表情问题_IOS

先给大家说下问题描述 服务器端不支持Emoji表情,因此客户端在上传用户输入时,不能包含Emoji表情. 解决方案 在客户端发送请求前,判断用户输入中是否含有表情,如果含有表情,则提示用户重新输入.这个过程关键是如何判断字符串中是否含有Emoji表情.要判断是否含有Emoji表情,必须先了解什么是Emoji. Emoji 是一套起源于日本的12x12像素表情符号,由栗田穣崇(Shigetaka Kurit)创作,最早在日本网络及手机用户中流行,自苹果公司发布的iOS 5输入法中加入了emoji后

iOS 集成环信UI后emoji表情键盘不显示是什么鬼

问题描述 解决方案 解决了....没看视频也是醉...导入demo中的ChatViewController替换掉EaseMessageViewController解决方案二:除了chatvc还有其他类需要导入吗

关于聊天记录问题,不能本地化,每次进来都是空的,还有emoji表情键盘不显示

问题描述 CoreData: Failed to load optimized model at path '/Users/LeeJay/Library/Developer/CoreSimulator/Devices/6BFC2389-077B-4C45-80E6-DC92DA5B7657/data/Containers/Bundle/Application/F6DF6728-A485-4E45-86BB-56460D4A6E80/UUKingdom.app/EaseMob.bundle/XMP

苹果5键盘怎么设置Emoji表情文字?iPhone5设置Emoji表情文字教程

一.在苹果5手机中我们点击[设置]选项,在[通用]中找到[键盘]如下图所示. 二.然后我们在打开[键盘]界面我们点击[添加新键盘]进入,如下图所示. 开发emoji表情键盘"> 三.然后我们在打开的界面中点击[表情符号]然后我们再点击"添加"然后我们再点击键盘上的"小地球"之后就可以切换到键盘状态下了哦.

3种方法轻松处理php开发中emoji表情的问题_php技巧

背景 做微信开发的时候就会发现,存储微信昵称必不可少. 可这万恶的微信支持emoji表情做昵称,这就有点蛋疼了 一般Mysql表设计时,都是用UTF8字符集的.把带有emoji的昵称字段往里面insert一下就没了,整个字段变成了空字符串.这是怎么回事呢? 原来是因为Mysql的utf8字符集是3字节的,而emoji是4字节,这样整个昵称就无法存储了.这要怎么办呢?我来介绍几种方法 解决方案 1.使用utf8mb4字符集 如果你的mysql版本>=5.5.3,你大可直接将utf8直接升级为utf

编码-mysql数据库想支持emoji表情可不可以不改数据库的字符集

问题描述 mysql数据库想支持emoji表情可不可以不改数据库的字符集 现在手上有个bug,是ios端的emoji表情插不进数据库的问题,在网上查了很久都说要改数据库的字符集. 可是dba说改库的字符集代价太多还给我回复:mysql的字符集设置有 连接字符集,客户端字符集,默认字符集,表和字段的字符集: 所以只需要把存储emoji表情字符的表或字段字符集改为utf8mb4就可以存储:但是需要读取和存储需要确保连接也指定字符集为utf8mb4: 请确认表或字段是否已修改完全,同时连接配置是否正确

iOS组件封装与自动布局自定义表情键盘_IOS

下面的东西是编写自定义的表情键盘,话不多说,开门见山吧!下面主要用到的知识有MVC, iOS开发中的自动布局,自定义组件的封装与使用,Block回调,CoreData的使用.有的小伙伴可能会问写一个自定义表情键盘肿么这么麻烦?下面 将会介绍我们如何用上面提到的东西来定义我们的表情键盘的.下面的内容会比较多,这篇文章还是比较有料的. 还是那句话写技术博客是少不了代码的,下面会结合代码来回顾一下iOS的知识,本篇博文中用到的知识点在前面的博客中都能找到相应的内容,本篇 算是一个小小的功能整合.先来张

iOS开发之自定义表情键盘(组件封装与自动布局)

下面的东西是编写自定义的表情键盘,话不多说,开门见山吧!下面主要用到的知识有MVC, iOS开发中的自动布局,自定义组件的封装与使用,Block回调,CoreData的使用.有的小伙伴可能会问写一个自定义表情键盘肿么这么麻烦?下面将会介绍我们如何用上面提到的东西来定义我们的表情键盘.下面的内容会比较多,这篇博文还是比较有料的. 还是那句话写技术博客是少不了代码的,下面会结合代码来回顾一下iOS的知识,本篇博文中用到的知识点在前面的博客中都能找到相应的内容,本篇算是一个小小的功能整合.先来张图看一

iOS自定义键盘切换效果_IOS

本文实例为大家分享了iOS自定义键盘切换的相关代码,供大家参考,具体内容如下 具体代码如下 - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib. self.title = @"小飞哥键盘"; self.textField = [[UITextField alloc] initWithFrame:CGRectMa