App Extensions篇之Sticker Pack Extension
转载请标明原文链接:http://www.cnblogs.com/zhanggui/p/7151795.html
前言
上一篇文章对App Extension做了简单介绍以及对Share Extension的使用做了简单说明,本篇文章主要是对Sticker Pack Extension进行介绍。
开始
接下来是对Sticker Pack Extension的一些介绍。
Sticker Pack Extension是什么?
从字面看就是贴纸包扩展,更直观一点看下图:



iMessage里面这些都是iMesssage的Extension,但是并不是所有的Extension都是Sticker Pack Extension,有的是iMessage Extension。因此,如果是贴纸这种的Extension,才是Sticker Pack Extension。
贴纸包如何创建呢?
我们会看到两种情况:
1.没有从AppStore下载Sticker Pack,但是你可以直接在iMessage里面看到。其实这种是不是创建的Sticker Pack Extension,而是单独的Sticker pack Application。它是可以单独上线AppStore的,也就是我们经常看的这些:



这些椭圆形状的都是iMessage 贴纸,下载之后直接可以在iMessage里面看到。可以直接这样创建:

点击所选择的那个Application之后,你会看到如下的project项目工程列表:

好吧,只有一个文件夹,后面在介绍。
2.没有从AppStore上面下载,但是能够在iMessage里面看到的。例如上面图示中的WWDC和知乎刘看山。它的创建方式就是App Extension。也就是我们在我们产品开发的时候,新建的一个Target:

新建之后,你会发现项目工程目录变成这样了:

上面的MessageExtensionDemo是我的工程,CustomSticker是我新建的Sticker Pack Extension。相比之下多了一个Info.plist,无非是对要展示的名称以及其他属性的设置。
如何实现
接下来的开发让你刷新认知。因为:完全不需要编写代码!完全不需要编写代码!完全不需要编写代码!我们只要把图片放到指定的位置即可。打开Sticker.xcassets,你会发现里面是这样的:

其中的iMessage App Icon就是在iMessage里面看到的icon,而Sticker Pack就是我们在iMessage里面点击icon进入的页面要展示的image.例如我自己做的这种:

这里面我做的就是找一些图片,然后把这些图片放到指定的位置,把做的icon放到iMessage App Icon里面,把其他的要分享的图片放到Sticker Pack里面。然后点击运行主程序,打开iMessage app,你就会看到自己的iMessage 贴纸。
这里你可能注意打了展示的个数问题,有的一行四个,有的一行三个,有的一行2个。这个是因为我设置的Sticker Size:

也就是说如果我用的Small,那么iMessage里面展示的就是一行四个,如果设置的Medium,那么一行展示的就是三个,如果是Large,那么一行展示的就是两个。
Sicker Pack 图片Size和格式
官方的Sticker Size是下图左侧这样的:


但是我在设计图片的时候比较随意,随便设置了图片的大小,,不过看起来也还ok。
官方的Sticker Formats是上图右侧这样的。
另外,我们再看一下左下角的加号:

其中的New Sticker就是创建一个Sticker Pack,那个New Sticker Sequence很有趣,其实它就是一个图片的序列,也就是我们可以用几张连续的png图片组装成一个动态图片。这里就不举例子了,感兴趣可以自己试一下。
关于iMessage 贴纸 icons大小
按照官网给的大小设计即可。另外如果有money,可以购买官方推荐的创建Stickers的工具:Motion。不过收费。。。。点击这里可查看如何使用Motion来创建Stickers。
总结
这篇博客主要介绍了如何创建iMessage App以及如何创建贴纸扩展。比较简单。不理解的话可以留言咨询。
附
1.用到的代码,点击这里下载(代码中的MessageExtensionDemo)
参考资料
1.Human Interface Guidelines 2.Creating Stickers for iMessage 3.Messages 4.视频:Buildiing Sticker Packs

App Extensions篇之Sticker Pack Extension的更多相关文章
- App Extensions篇之Share Extension
转载请注明出处:http://www.cnblogs.com/zhanggui/p/7119572.html 1.前言 这里主要是对App Extension的一些介绍以及详细给大家介绍一下Share ...
- ios 10 sticker pack application
看了WWDC2016直播,我们发现变得谨慎而开放的苹果在新一版四大平台系统中展示了很多变化,当然重中之重还是伟大的iOS.通过试用iOS10beta版,除了长大了的更强大的Siri主要感受到iMess ...
- WWDC2014之App Extensions学习笔记
一.关于App Extensions extension是iOS8新开放的一种对几个固定系统区域的扩展机制,它可以在一定程度上弥补iOS的沙盒机制对应用间通信的限制. extension的出现,为用户 ...
- 【HELLO WAKA】WAKA iOS客户端 之一 APP分析篇
由于后续篇幅比较大,所以调整了内容结构. 全系列 [HELLO WAKA]WAKA iOS客户端 之一 APP分析篇 [HELLO WAKA]WAKA iOS客户端 之二 架构设计与实现篇 [HELL ...
- Hybrid APP基础篇(二)->Native、Hybrid、React Native、Web App方案的分析比较
说明 Native.Hybrid.React.Web App方案的分析比较 目录 前言 参考来源 前置技术要求 楔子 几种APP开发模式 概述 Native App Web App Hybrid Ap ...
- Hybrid APP基础篇(三)->Hybrid APP之Native和H5页面交互原理
本文已经不维护,新地址: http://www.cnblogs.com/dailc/p/8097598.html 说明 Hybrid模式原生和H5交互原理 目录 前言 参考来源 前置技术要求 楔子 A ...
- Hybrid APP基础篇(四)->JSBridge的原理
说明 JSBridge实现原理 目录 前言 参考来源 前置技术要求 楔子 原理概述 简介 url scheme介绍 实现流程 实现思路 第一步:设计出一个Native与JS交互的全局桥对象 第二步:J ...
- 如何快速的开发一个完整的iOS直播app(美颜篇)
前言 在看这篇之前,如果您还不了解直播原理,请查看这篇文章如何快速的开发一个完整的iOS直播app(原理篇) 开发一款直播app,美颜功能是很重要的,如果没有美颜功能,可能分分钟钟掉粉千万,本篇主要讲 ...
- 安卓app设计规范整理和Android APP设计篇(转)
随着安卓智能手机不停的更新换代.安卓手机系统越来越完美,屏幕尺寸也越来越大啦!比如最近小米的miui 6的发布和魅族手机系统的更新等等. 以小米MIUI6的安卓手机来说,MIUI6进行了全新设计,坚持 ...
随机推荐
- 关于RFID2.4G 标签卡最新方案
它是一款针对RFID有源卡行业设计的,是一款单向的2.4G频段RF射频芯片,目前主要针对低功耗的校讯通, 2.4G停车场,电动车防盗, 闪光灯设备(引闪器) ,智能家居等领域.SI24R2E 同样与S ...
- DFS and BFS
DFS https://github.com/Premiumlab/Python-for-Algorithms--Data-Structures--and-Interviews/blob/master ...
- C#解析json的两种方式
C#中Json转换主要使用的几种方法! 这篇主要介绍2.4.第三种方法使用的比较局限,所以我没有深入学习. 第二种方法 我使用比较多的方式,这个方法是.NET内置的,使用起来比较方便 A.利用seri ...
- canvas实现视频截图
截取视频当前播放画面,直接上源码. <body> <div class="container"> <video id="test" ...
- java基础(十五章)
一.字符串类String 1.String是一个类,位于java.lang包中 2.创建一个字符串对象的2种方式: String 变量名="值"; String 对象名=new S ...
- [Leetcode] Binary search -- 475. Heaters
Winter is coming! Your first job during the contest is to design a standard heater with fixed warm r ...
- Dojo初探之3:dojo的DOM操作、query操作和domConstruct元素位置操作(基于dojo1.11.2版本)
前言: 前面两章讲了dojo的基本规范和配置,当然这个配置不是必须的,当你有这需求的时候就可以用到dojo的config配置. dojo的所有js都是符合AMD规范进行异步加载的:http://blo ...
- react-native学习(RN)--之Window环境下搭建环境配置
react-native以后会更火的,自从2015年facebook开源了Android 一.安装java 二.安装Android Studio 三.安装react-native需要的Android ...
- JavaScript数组基础及实例
js数组 和var i=1;这样的简单存储一样是js中的一种数据结构,是专门用来存储多个数据的一种数据结构. 摘:数组是一组数据的集合,其表现形式就是内存中的一段连续的内存地址,数组名称其实就是连续内 ...
- Ajax 异步上传文件
需要引用js jquery.form 前端代码 <form action="/Save" id="mainForm" method="post& ...
