iOS 10 创建iMessage App - 简书
iOS 10 创建iMessage App
*时值中秋佳节, 送给出门在外的程序猿们 ! *
骚年们, 自己写个表情包斗图可否 !
斗-seal.svg.png
第一. 介绍
随着iOS10的发布,苹果对开发者开放了Messages应用程序,开发人员现在可以创建他们自己的各种类型 并且可以内联iMessage内容的** iMessage apps**,包含简单的表情包到可以交互的复杂界面。
在这个教程中, 我将会为你介绍新的framework--Messages framework, 并且为你展示如何创建属于自己的iMessage A
这个教程的前提是你在OS X El Capitan或以上版本中运行xcode8, 并且有一定的iOS开发经验;如果你是刚开始学习iOS开发, 你可以先学习这个课程; 在这系列中,你将了解如何开始开发iOS平台的深入的文章和教程。
1.生态系统(Ecosystem)
iMessage APP生态系统开始于一个完整的App Store,用户通过Message 应用程序都可以访问。这家App Store是完全独立于之前的应用商店,并将只显示iMessage-related应用。
iMessage apps的存在在一定程度上延展了印象中的iOS应用程序, 比如表情包(斗图岂能少了表情包)和自定义键盘;最重要的不同在于,这个iMessage App Store 只存在于系统Messages之中, 你创建iMessage APP 不需要像创建iOS APP那样显示在手机主屏幕上, iMessage应用程序创建一个扩展的有效空白和无形的iOS应用程序。然而,如果你想开发一个包含iOS和iMessage的应用,你可以创建一个像任何其他类型的扩展的iMessage扩展。
最后要说的是, 这个 iMessage apps 只有效于iOS系统, 但它的内容可以在MacOS和watchOS上显示;此外,watchOS 3的用户能够查看最近使用的表情包,并可以从苹果的手表把这些表情直接直接发给联系人。
第二. 基本的表情包
为了让开发者快速简单的创建一个iMessage 表情表, Xcode提供了一个没有任何代码的模板! 这将是一个伟大的工具,使艺术家与没有编程知识的人都可以创建一个表情包。
使用新的**Messages framework **创建一个表情,你可以创建小的, 不大不小的, 大的表情, 这个尺寸,适用于所有的表情包。你只需要提供最大图像大小为每个表情在你的表情包中,如果需要缩减在某些设备上需要缩放, 系统会替你完成。
虽然没有严格限制,但是苹果建议的表情文件大小:
1. Small: 100 x 100 pt @3x scale (300 x 300 pixel image)
2. Medium: 136 x 136 pt @3x scale (378 x 378 pixel image)
3. Large: 206 x 206 pt @3x scale (618 x 618 pixel image)
也有其他的一些限制, 表情包的大小:
1. 文件中images不可以大于500
2. iamge不可以小于100 x 100 pt (300 x 300 pixels).
3. iamge不可以大于206 x 206 pt (618 x 618 pixels).
4. 图片格式必须是 PNG, APNG, JPEG, GIF ;
打开Xcode, 创建一个新的工程, 选择iOS & Application, 你将会看到** iMessage Application和Sticker Pack Application 的可选项, 第一个例子中, 选择Sticker Pack Application **:
Paste_Image.png
如果你一直照着做,并且想得到一些表情, 你可以从这里下载--
打开项目, 你会发现Xcode的左侧边栏中有个Stickers.xcstickers , 这个文件夹中包含了iMessage APP的icon 和表情, 稍后将这些表情拖拽到你的项目中的Sticker Pack 文件夹中的New Sticker Sequence;
Paste_Image.png
如果你想要添加动态表情那么你添加一组图片即可, 你可以点击**Sticker Pack 文件夹, 选择 Add Assets & New Sticker Sequence **这个选项, 在这个表情包中, 你可以再次设置;
注意一定要按步骤添加图片
最后, 你如果想要更改表情包得默认名称和大小, 你可以在右侧**Attributes inspector **中更改;
测试你的表情包
测试表情包, CMD + R即可, 也可以点击左上角的运行按钮, 然后模拟器会弹出如下菜单:
选择Message然后点击run按钮, 模拟器展示出Message应用, 点击APP store按钮, 即靠近输入框的按钮;
你的表情包将会展示在最前边,你会发现两个表情并且可供使用和发送;
点击任何一个表情, 它将会被添加在当前的信息中,
正如你所看到的, 在iOS10中你可以快速简单的创建表情包并且不需要任何代码;
第三 自定义标签应用
处于用户的需要,基本的表情应用程序提供的模板可能不完全满足需求;处于这个原因, 苹果也提供了一种方法来使你创建更为复杂的标签应用程序;如果你想一块做这个APP, 那么创建一个项目CustomStickerPack, 这次选择iMessage Application模板;
创建完这个空的工程, 你会看到类似iOS APP的文件列表, 但多了一个MessagesExtension文件夹, 最上边的CustomStickerPack文件夹包含Assets.xcassets和Info.plist文件,重要的是,你提供所有正确的大小的应用程序图标在这个Assets.xcassets目录,因为iOS也将使用它,例如用户的存储使用的设置。
我们集中精力在MessageExtension文件下,
1. MessagesViewController.swift : iMessage app的程序入口;
2. MainInterface.storyboard: 可视化操作;
3. Assets.xcassets: 图片集合;
4. Info.plist : 配置一些扩展信息;
在我们的例子中, 我们创建MSStickerBrowserViewController这个类;
打开MessagesViewController.swift , 你会发现它是MSMessagesAppViewController的子类, 而再往上看父类就是UIViewController, 这意味着在iMessage APP中都符合UIKit的标准;
这个MSMessagesAppViewController类提供了许多回调函数, 你可以覆盖他们, 进一步定制应用程序的功能,但是我们先不需要这些;接下来先配置MSStickerBrowserViewDataSource协议;
class MessagesViewController: MSMessagesAppViewController, MSStickerBrowserViewDataSource {
之前我们可以展示我们的表情, 我们需要添加文件到我们的工程并且加载他们;拖拽之前用过的图片文件夹到工程中;并且确保他们添加到MessagesExtension这个目标中,因为这个路径将会作为URL来加载他们, 当加载表情时使用使用更加简单;
接下来在MessagesViewController中创建一个MSSticker数组来存储我们的表情包, 并写一个方法来总本地加载他们;
var stickers = [MSSticker]()
func loadStickers() {
for i in 1...2 {
//语法变了
if let url = Bundle.main.url(forResource: "Sticker \(i)", withExtension: "png") {
let sticker = try MSSticker(contentsOfFileURL: url, localizedDescription: "")
stickers.append(sticker)
print(error)
然后在这个类中添加createStickerBrowser, 我们初始化一个MSStickerBrowserViewController作为根视图, 并设置宽高约束:
func createStickerBrowser() {
let controller = MSStickerBrowserViewController(stickerSize: .large)
addChildViewController(controller)
view.addSubview(controller.view)
//语法变了
controller.stickerBrowserView.backgroundColor = UIColor.blue
controller.stickerBrowserView.dataSource = self
view.topAnchor.constraint(equalTo: controller.view.topAnchor).isActive = true
view.bottomAnchor.constraint(equalTo: controller.view.bottomAnchor).isActive = true
view.leftAnchor.constraint(equalTo: controller.view.leftAnchor).isActive = true
view.rightAnchor.constraint(equalTo: controller.view.rightAnchor).isActive = true
然后我们需要实现MSStickerBrowserViewDataSource必须要实现的代理方法;
func numberOfStickers(in stickerBrowserView: MSStickerBrowserView) -& Int {
return stickers.count
func stickerBrowserView(_ stickerBrowserView: MSStickerBrowserView, stickerAt index: Int) -& MSSticker {
return stickers[index]
最后, 所有的代码都已经完成, 替换viewDidLoad中的代码:
override func viewDidLoad() {
super.viewDidLoad()
loadStickers()
createStickerBrowser()
像之前那样运行APP, 一旦一切都完成加载, 应该会看到一个完全相同的屏幕除了蓝色背景, 除了蓝色的背景色;
在这个教程中, 我们只是加载了应用程序中的图片,但好的是我们可以自定义标签应用程序了, 然而, 你可否加载网络服务器呢? 在展示你的MSStickerBrowserViewController之前,可以通过使用别的view controllers来实现的; 再继续一步吧!
在最后一节, 我们将创建一个非常基本的iMessage应用程序来创建一个独特的消息。;
如果你愿意一块继续完成这个目标, 打开xcode创建一个MessageApp, 打开MainInterface.storyboard,删除默认的label, 添加一个stepper和一个button, 如下图:
请注意,为了让你的iMessage APP的视图位置正确展示在所有的设备中, 你需要添加布局约束, 在这个例子中我已经设置了stepper在视图中间, 这个button在视图的下侧;
然后, 选择stepper打开Attributes inspector, 改变最小最大值为0和10:
接着在** Assistant editor 中打开MessagesViewController.swift**并链接起来;
@IBOutlet weak var stepper: UIStepper!
@IBAction func didPress(button sender: AnyObject) {
接下来, 写代码的时刻到啦, 第一步我介绍一些用到的类:
1. MSConversation: 代表了当前打开的对话。可以使用这个类来操作一些步骤,例如通过插入消息或当前选择的信息;
2. MSMessage: 代表单个消息,判断是否由你插入对话或已经存在的对话;
3. MSMessageTemplateLayout: 创建一个消息气泡,如下图, 里边有许多属性和空间来提供给你来自定义
特别提醒, 左上角的空间是展示你的icon, 所有的属性都是可选的, 提供任何标题字符串将摆脱底部部分的布局。
在MessagesViewController.swift中修改如下代码:
在这个方法中, 我们将当前的stepper的数值显示到圆形的label中, 然后将label放在UIImage对象中, 以便于我们可以在message中捕获到;
func createImageForMessage() -& UIImage? {
let background = UIView(frame: CGRect(x: 0, y: 0, width: 300, height: 300))
background.backgroundColor = UIColor.white
let label = UILabel(frame: CGRect(x: 75, y: 75, width: 150, height: 150))
label.font = UIFont.systemFont(ofSize: 56.0)
label.backgroundColor = UIColor.red
label.textColor = UIColor.white
label.text = "\(Int(stepper.value))"
label.textAlignment = .center
label.layer.cornerRadius = label.frame.size.width/2.0
label.clipsToBounds = true
background.addSubview(label)
background.frame.origin = CGPoint(x: view.frame.size.width, y: view.frame.size.height)
view.addSubview(background)
UIGraphicsBeginImageContextWithOptions(background.frame.size, false, UIScreen.main.scale)
background.drawHierarchy(in: background.bounds, afterScreenUpdates: true)
let image = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
background.removeFromSuperview()
return image
接下来在**didPress(button:) **中修改为如下代码:
首先创建message的布局, 并且设置image和caption, 接着我们创建MSMessage对象并插入到会话中;
@IBAction func didPress(button sender: AnyObject) {
if let image = createImageForMessage(), let conversation = activeConversation {
let layout = MSMessageTemplateLayout()
layout.image = image
layout.caption = "Stepper Value"
let message = MSMessage()
message.layout = layout
message.url = URL(string: "emptyURL")
conversation.insert(message, completionHandler: { (error) in
print(error)
要注意, 在iMessage中自定义message必须要设置layout和URL, 这个URL是链接某个web页面的一些内容, 进而MacOS用户可以看到iMessage的内容, 在这个例子中, 我们只是创建了简单的字符URL;
最后我们将这个message插入到当前活动的会话中, 调用这个方法不会发送信息, 相反,它把你的信息在用户的输入字段,以便他们可以发送。
再次运行APP, 你会看到如下界面:
你点击Create Message按钮, 你会发现message的位置在输入框中间, 并且可以被发送;
在这个教程中, 我将你介绍了iOS10中新的Messages framework, 允许你创建表情包和iMessage应用程序, 我们重写了基础的类, 包括:MSStickerBroeserViewcontroller, MSConversation, MSMessage, MStemplateMessageLayout;
这个框架许多API来开发自己的iMessage APP, 更进一步, 我会推荐你查看苹果的文档--
更多精彩内容请关注“IT实战联盟”哦~~~
IT实战联盟.jpg
https://github.com/mugworts
读书是在别人思想的帮助下建立自己的思想
——尼古拉.鲁巴金 (俄国作家)
用两张图告诉你，为什么你的 App 会卡顿? - Android - 掘金Cover 有什么料？ 从这篇文章中你能获得这些料： 知道setContentView()之后发生了什么？ ... Android 获取 View 宽高的常用正确方式，避免为零 - 掘金相信有很多朋友...
申请完账号，我们就得有一个自己的APP我选的是盆友推荐的类型iMessage表情包，下面我就来介绍一下该表情包的创建。（同时附上盆友简书的链接@kurt_wang ） 骚年们，整天斗图可否想过创造自己的斗图表情包！可否想过斗自己的图，霸他人的屏。（ps:哈..哈..哈..想...
原文：Building a Message Sticker App Extension in Xcode 8作者：SIMON NG原文日期： 译者注：这是一篇非常基础的文章，基础到你不需要写一行代码，就能发布一个应用，实际上这归功于 Apple 强大的流...
下边都学会就大神了: 声明:都是网上搜集的,能标明出处的都标了.别只搜集而不看,与君共勉.. 先看完整项目完整App@HackerNews-React-Native用 React Native 完成的 HackerNews 客户端。WeChat实现类似微信朋友圈或者QQ空间...
用到的组件1、通过CocoaPods安装项目名称项目信息AFNetworking网络请求组件FMDB本地数据库组件SDWebImage多个缩略图缓存组件UICKeyChainStore存放用户账号密码组件Reachability监测网络状态DateTools友好化时间MBP...
&1996年出生，今年已经22岁的我。生活依然如往日一般的平淡。我想去经历一场自己人生的革命，一个我主动去选择的目标，努力的去实现它。我不想再这样浑浑噩噩的度日。我发现我似乎很明白人生的道理，但好像却又是这些所谓的真理一步步的阻挡这我的去路。所以我决定，不如就化繁为简吧！...
喜欢一个人的时候，你捂住嘴巴，它也会从你的眼睛里跑出来。——某作者
刚刚看到一则新闻报道，关于上述男子的这种行为说实话很是不理解，但同时又有点感动。爱情故事经历的少，听的也不多，总是分手后女生一哭二闹三上吊的，这还是头一回看见这么痴情的男人。新闻底下是网友评论：奇葩男子也有女神女友？屌丝也配有爱情？ 很多污蔑对方的话语爆走在新闻下方，第三方...
今天学习了一个社区课程，是由一对北大父母针对低年级学生的一些问题做的。家长比较头疼的现象：写作业拖拖拉拉、丢文具、上课专注力不好，考试成绩不好.....收获良多以至于苦读至深夜。其实学习不好是因为学习的能力不足，学习能力主要来自四个方面。阅读力、作业力、认真力和专注力。 一...
每次回家，面对妈妈喊我回家发展的呼唤和爸爸嘱咐我把“终身大事”放心上的苦口婆心，心中都是百感交集。我是个在外面漂惯了的人，从大学时候起就离开家乡只身来到几千里外的南方城市，毕业后又毅然决然的选择了上海。 拒绝的理由已说了千遍万遍。不是不想回家，只是回家后，已经没有了自己立身...让「短信」更有趣：iMessage 上的表情包 - 少数派
请选择你要投稿的专栏
让「短信」更有趣：iMessage 上的表情包
0}" v-cloak>
我发现我的周围许多人都认为 iMessage 和短信（SMS）是同一个东西，每次推荐他们使用 iMessage 时，我经常要回答「这个信息服务要不要收短信费」的问题：其实 iMessage 不是短信，它与微信类似，是走流量的即时信息 App。从 iOS 10 开始，iMessage 更加「逼近」微信，加入了表情包功能——官方称之为贴纸（Sticker）。亲自上手后，我发现 Sticker 有别于传统意义的表情（Emotion），其最大的区别在于，Sticker 是可以「贴」在聊天时间线上任意有聊天气泡的地方，用时髦的语言来说就是支持 Drag & Drop。这个特性让表情包的使用可以更加地有创意，比如在对方发来的自拍上「贴」个小丑鼻子、一撮卓别林胡子或是一坨褐色的懒羊羊发型，都可以让图片文字信息增色不少，使聊天更加有趣。Sticker 推荐1. ARU Stickers贴纸作者：价格：免费阿鲁表情包约是在 12、13 年风靡起来的。如果你曾经或者现在加入一些二次元相关话题的QQ群，你也许见到过这款阿鲁表情包。其典型的特征就是一副「魔性又欠揍的笑脸」，然后加上特效形成各种变体——流汗?、害羞////、墨镜?、鼓掌?。阿鲁表情包的这种简笔画风格，形成了某种一致感，所以我特别喜欢这款 Sticker，而且可以说质量相当高了。包括 259 个不同表情，它足以满足我大多数逗趣聊天时的需要，比如好似聊天气泡上长出了阿鲁小人头，效果十分喜感。2. 阿狸表情包价格：免费一代萌神阿狸的贴纸包怎么能错过。很多人已经很熟悉阿狸了，值得一提的是，iMessage 的阿狸贴纸包是动图哦！3. Kaomotion价格：免费 + 内购这款曾经登陆过 ProductHunt 的贴纸包，把人们最喜欢的一些颜文字动画化，让你的聊天更有活力。Kaomotion 中包含了30枚左右免费贴纸，在此基础上你还可以内购解锁其他贴纸。4. Song Reactions价格：免费这是一款充满设计感的贴纸，让你酷到没朋友。即使是一句简单的吐槽都以极简的性冷淡风格呈现，通常我用它来给好友的气泡打分（1-5颗?），嘲讽“Super Dope”，致谢“Thanks Amigo”，或者表示极度赞同“I give it a 12/10”……5. MarcyMoji价格：免费 + 内购iMessage 贴纸吸引了不少艺术家创作其中。比如这款手绘贴纸就是来自 Marcy 和 Andrew 的作品，他们目前正骑行周游世界，Marcy 将途中所见之物画下制作成了这套艺术画。你可以免费下载 MarcyMoji，并且使用其中一小部分贴纸，在此基础上内购额外的贴纸，目前已收录 500+ 贴纸。6. Rilakkuma 轻松熊价格：?12.00这是我购买的第一款付费贴纸。从购买它那刻起，我就知道我注定要在使用 iMessage 的道路上越走越远了，毕竟微信上的轻松熊是可以免费下载的。虽然我不知道为啥要叫轻松熊，但是看到轻松熊的时候我确实感觉身心舒畅十分轻松啊，虽然官设轻松熊的内部是位大叔……这套贴纸非常适合贴在女朋友发来的照片上，可以起到一定的萌化效果。Stickers 相关1. Stickify你可以认为这是 iMessage 版的微信自定义表情，可以导入自定义的图片作为贴纸，同时具有贴纸Drag & Drop的特性。详情请看我的这篇文章：2. #image这是 Apple 推出的 GIF 搜索功能，让你通过关键词快速搜索 meme 动图。在 iMessage 中开启 #images 的方法，：3. 一些 App 也有它们的 Stickers一些功能上与 iMessage 无关的 App 也推出了一套自己的 Sticker，比如Bilibili、知乎、Fantastical、Starbucks……你可以在 iMessage 中找到它们的 Stickers。尾巴意外收获：写这篇文章时无意发现的特性，一只手指按住贴纸，另一只手指在屏幕其他区域滑动，即可放大缩小和旋转贴纸。我不会说 iMessage 符合「原生应用使用起来一定更加流畅」的刻板印象，但不可否认的是，iMessage 作为 Apple 生态的一环，可以实现许多系统层面上的互动，这是我最为看重的。
评论（${commentLength}）
请勾选举报理由
${ item.text }
0" v-cloak>
${ related.released_at * 1000 | friendlyTime }
${related.summary}
${ related.likes_count }
根据国家网信办规定，互联网账号需要实名认证。验证手机号码再进行评论或撰写文章。
点击去验证一方向两人转款一人收到另一人没有收到怎么查_百度知道
一方向两人转款一人收到另一人没有收到怎么查
我有更好的答案
如果是我行转出，要看你采用什么到账模式。比如普通、快速模式，并不是实时到账的，到账时间取决于收款银行处理速度，所以这种情况是正常的。建议联系银行客服尝试查询该笔转账的状态。
采纳率：93%
完全可以。顺祝顺利
为您推荐：
其他类似问题
换一换
回答问题，赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。404，无法找到你要访问的页面 - 七丽女性网两台苹果手机共用一个icloud账号，其中一个人能操控另一个人的手机qq吗_百度知道
两台苹果手机共用一个icloud账号，其中一个人能操控另一个人的手机qq吗
两台苹果手机共用一个icloud账号，其中一个人能操控另一个人的手机qq吗？
我有更好的答案
不能但是：1.最好是不要共用一个ID账号，否则就无法独立的备份重要的数据文件，一旦丢失就是不可找回的。2.还有就是即使共用一个文件，也不要把所有的iCloud同步选项功能都开启，要不然数据信息就会相互同步，导致手机信息混乱。3.点击设置——iCloud，然后再iCloud里面，把不需要相互同步的选项功能都关闭。4.自动下载的功能也要关闭，点击设置——iTunes store和AppStore，里面把自动下载软件的功能也关闭。5.设置——信息——iMessage，把信息同步的功能关闭，这样就不会短信相互同步。
为什么不能？
为什么不能？
因为QQ是第三方软件 不是系统自带的
自带的 都可以控制
采纳率：91%
来自团队：
为您推荐：
其他类似问题
换一换
回答问题，赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。