iOS开发之构建Widget - 简书
iOS开发之构建Widget
伴随这iOS 8 系统多达4000项API更新而来同样还有Today Extension.而对iOS而言，有了Today Extension 开发者可以很好借助系统提供的接入点为系统定制的服务,提供自定义的附加功能.这意味着什么呢？从iOS 7版本尝试开路到现在iOS 8更新的到来终于向开发者开放Widget接入,这意味着系统应用和第三方应用都可以通知中心(Notification Center)里面实现交互.
Notification Center Widget [Via Apple]
其实相对于Android，因其特有开放性Widget插件已经发展了很多年，拥有极高自由定制性，在新版本的Android系统中甚至可以将部分插件摆在锁屏页.而Google和各大软件厂商制作的Widget插件也能很好与系统的整体风格进行无缝的融合，而直到目前iOS 8版本中，Widget也就只是能摆在通知中心(Notification Center)今天通知栏中而已，相对于Android也听到很多人把这个作为"iOS不够开放"一个有力的依据.针对这个问题其实Apple也在中提到：iOS 8 中开发者的中心并不应该发生改变，依然应该是围绕 app.在 app 中提供优秀交互和有用的功能，现在是，将来也会是 iOS 应用开发的核心任务。而Widget在 iOS 中是不能以单独的形式存在的,一定是随着一个应用一起打包提供的。从这个侧面可见，Apple对开放一直持有审慎的态度，开放的目的是力求保证整体体验完整性，虽然iOS的Widget相比Android自定义性太低，但基于Apple目前的开放程度而言是能够很有效控制Widget与系统的更好的融合.虽似戴着镣铐起舞，但却能捕获人心.而从用户角度来看，在无需打开应用前提下就可以对消息进行处理的交互特性,使它在很多场景里有效提升了用户操作效率.例如在Widget中快速回复email，即时完成Todo日程等.这种交互更多从更宏观角度重新定义了消息,通知中心(Notification Center)通过获取用户上一行为，还可以起到承接下一行为的作用(虽然目前开放API只能做到系统级的行为).点虽小，但这对用户使用习惯改变却是巨大的.
Widget on hands [Via Yalantis]
有人看到这肯定一定会问为何没有提到Windows Phone平台?因为无论从通知中心快捷入口数量还是谈到可以交互的点一句话而概之WP的现状是“一穷二白”，你想作为曾经走过WP7时代用户根本不知道通知中心为何物的，而是用了足足两年时间WP8上才有体现，而那些被其他平台玩腻的希望习以为常通知中心交互，就像这样：
WP 通知中心[Via PCGGroup]
你就像看这张静态图片一样也就是停留只是看看程度而已（除了删除操作之外）,MS针对通知中心现在最新消息是未来会支持类似可以通知中心直接回复短信等交互，至于什么时候能够等到，谁知道呢.说了这么多，回归正题.1.交互在开始构建Widget之前，如果想对Widget实现技术细节和交互特点有一个完整概览，我觉得没有什么文档比官方更值得一读了.刚开始接触iOS通知中心，一直很疑惑为何通知中心采用两个不同Tab“今日”和“通知”来对消息进行分离.其实这和Widget工作机制有关.Widget是放在“今日”Tab之中，而它工作机制是只有用户下拉通知中心时才会去刷新获取最新数据，这种做法和Android不同在于，Android更偏向于把整个Widget一直放在后台实时持续的更新.设想一下，如果我们看同样天气信息，Android会持续消耗资源去做一件用户不会实时预览信息,这也就能解释为何经常看到Android用户抱怨耗电问题.而对于即时消息，iOS做法是直接把这些消息实时归类到”通知“Tab中.其实这种做法很好解决采用消耗最少资源前提下保证其操作的灵活性.因为现有Widget一般来说是展现在系统级别的 UI上，所以在中Apple对Widget交互提出如下明确的要求:扩展应该保持轻巧迅速，并且专注功能单一，在不打扰或者中断用户使用当前应用的前提下完成自己的功能点.类似一直挚爱Todo应用Clear则交互上堪称上典范:
Clear's Widget
当然如果动点脑子会发现，Widget开放iOS上实现应用之间Launcher成为了可能，类似早期一直很魔性应用"Launcher"：
Launcher's Widget
可以让用在 iOS 的通知中心里，以类似应用程序捷径的方式直接快速切换 App 的小工具，其实当初在推出没多久后，便被 Apple 以"误用 / 滥用"Widgets 为理由下架，但有意思的就在几天前3月20日又重新上架.2.构建在Widget技术实现细节上，并不打算在本篇把所有技术细节通览一遍，我只会写我个人(其实就是初学者)认为值得写的容易出错的点或者耗费一些时间找到一些问题的解决方案.2.1 纯代码构建Xcode 6中已经支持Today Extension创建Widget的模板，该模板会默认创建MainInterface.storyboard文件来构建UI:
StoryBoard UI
当然对于一个纯代码的拥趸而言，肯定直接删除storyboard文件采用纯代码方式来进行构建，删除完后之后注意需要找到Supporting Files下面的Info.plist中NSExtension字段做如下两个操作:
A：直接删除NSExtensionMainStoryboard字段
B：添加NSExtensionPrincipalClass字段 并设为TodayViewController
注意当采用Xcode默认模板创建Widget时会自动把ViewController文件命名设置为“TodayViewController”.当然这个ViewController命名其实是可以修改的，唯一值得注意的修改该ViewController文件命名后还需要设置NSExtensionPrincipalClass的值与其保持一致即可.不然Widget编译时会报找不到对应入口.2.2 左侧间隔当第一次添加UI元素采用真机来运行Widget会发现，Widget左侧到屏幕之间始终会有一段距离的间隔，导致调整布局和效果图差距甚远，类似这样:
其实这个问题主要是因为Widget里面的视图默认居左居下都会有一定距离的间隔，可以采用如下方式取消间隔，使布局区域填充整个Widget:
这种方式把整个布局填充区域间隔都设置为0，当然更简洁的方式是你可以直接采用“return UIEdgeInsetsZ”方式.而关于Widget上布局处理则采用框架做的相对布局,简单快捷推荐.当然关于Masonry框架快速上手则不得不推荐阅读.2.3 整个点击区域实现如你所看当用户拉开Widget时，因为Widget是依赖于应用程序在分发时是跟应用程序一块打包的，希望点击Widget布局任何区域都能唤起主应用程序,常用的方式在整个View增加Tap事件订阅处理:
但这种方式会额外产生一个问题，如果Widget空白区域没有任何UI元素则无法触发该事件,那这里有一个小技巧可以解决改问题,可以整个Widget增加一个透明的ImageView:
设置透明度
初始化时注意把imageview透明度设置为0.01最小值，那么无论设置其背景色为什么值肉眼都是不可见的.然后使用框架布局来填充Widget整个背景如下：
填充整个背景
然后为imageview增加Tap事件订阅即可：
增加事件订阅
这样就能整个Widget区域可点击效果.另外针对通过Widget中唤起主应用程序方式目前只支持url scheme方式来实现.同时也是Widget向主应用程序反馈数据和交互的渠道之一.2.4 定时更新机制Widget自身更新机制当用户下拉通知中心(Notification Center)时立即更新数据，但我们仔细研究Widget用户使用场景时发现，如果用户锁屏时间过长，打开Widget后不做任何操作，这个时候针对一些即时类应用，类似我们天气中可能涉及到灾害预警它要求场景数据一旦产生就要实时展现给用户，这就需要我们基于Widget自身机制外还要处理这个场景下天气数据自动更新的问题.这个时候我们需要构建一个定时更新的NSTimer：
初始化NSTimer
非常简单，在NSTimer固定更新间隔执行的方法调用就是更新数据方法，当然重点不在这里，而是触发和关闭这个NSTimer时机.按照Widget生命周期来说，如果用户是第一次下拉查看Widget其实就是执行整个ViewController生命周期调用过程，这个并没有什么问题，但是还是存在一个特殊情况.系统为了保证Widget上数据是及时更新的,默认会截取上次显示成功Widget的快照.这个快照会一直保存到新的数据或UI被更新才回被替换，那这就会带来一个问题,当你拖拽通知中心(Notification Center)下拉过于频繁时，Debug跟踪代码执行路径你会发现整个Widget生命周期执行过程和第一次下拉执行的路径发生了变化.第一次下拉执行路径是viewDidLoad-&viewWillAppear,而如果下拉过于频繁你就会发现代码执行路径直接只会执行viewWillAppear方法，这个就是系统默认保存上次快照而导致的执行路径上变化.这对我们选择NSTimer更新时机以及后面会提到的Widget横竖屏处理都会有影响.那么很明显，为了保证这个定时更新机制能够无论用户什么情况下操作都能起作用，我们需要把NSTimer fire触发代码调用放到viewWillAppear方法中来.同理当Widget关闭后在viewDidDisappear方法取消NSTimer invalidate定时更新即可.2.5 Widget横屏支持关于Widget横屏支持在开发中耽误一点时间来解决这个问题,在iPhone 6 & Plus上已经横竖屏直接切换，Widget默认是竖屏，但如果你需求中横屏UI的布局和竖屏布局完全不同，这个时候你就需要判断当前Widget横竖屏状态来切换对应的布局.当然一般思路我们都会按照端内处理横竖屏方式来处理Widget，如果你翻过官方的开发文档，你会发现在iOS 6.0版本之前UIViewController之间横竖屏切换，只需要设置shouldAutorotateToInterfaceOrientation函数即可.UIInterfaceOrientation是UIApplication.h头文件中定义的枚举类型，总共有四个方向.在shouldAutorotateToInterfaceOrientation方法中返回相应的结果即可，如果直接返回YES将支持所有方向.而在iOS 6.0版本之后，UIViewController之间横竖屏切换需要多设置一个supportedInterfaceOrientations函数返回UIInterfaceOrientationMask枚举类型.除了设置shouldAutorotateToInterfaceOrientation之外,还要将supportedInterfaceOrientations返回的方向与shouldAutorotateToInterfaceOrientation保持一致，否则会在两个支持不同横竖屏ViewController中切换时，会出现竖屏变横屏，横屏变竖屏的情况.但问题是这种方式是否适用Widget横屏处理呢?使用UIDeviceOrientationIsPortrait来判断：
判断横屏方法一
当你执行这段代码调试时你会发现，orientation方向的值始终都会是UIDeviceOrientationUnknown.如果你点开UIDeviceOrientation枚举你会看到.它包含了两个扁平方向UIDeviceOrientationFaceUp和UIDeviceOrientationFaceDown，其实它代表的意思屏幕朝上或朝下平躺两个方向的判断.所以当你设备平躺桌面时.即时你有时已经切换了横屏你会发现它会返回FaceUp或FaceDown，所以你当你调用UIDeviceOrientationIsPortrait方法时它返回值其实是没有意义的，因为设备目前方向在平躺下Faceup和FaceDown既不是横屏也不是竖屏.难道没有更好的方式嘛?可以采用如下方式能够完美解决Widget横竖屏切换状态判断的问题:
Widget横竖屏状态判断
其实设置Widget显示高度时就会发现，高度在横竖屏状态切换是不会变化的，但宽度会随着横竖屏状态切换会发生变化，所以判断屏幕宽度这个思路是可取的.因为横竖屏UI布局不同，调用时机则可以选择在viewWillLayoutSubviews或viewDidLayoutSubviews方法中进行.因为这两个方法都是viewWillAppear方法是必然执行的，这也就自然规避Widget自身因为下拉快照保存机制导致代码执行路径变化导致布局更新的问题.2.6 Widget国际化在来说说这个Widget国际化，因为我们客户端自身已经支持三种不同语言,这就是导致Widget也是需要根据端内语言变化必须有国际化的支持.其实我们端内已经做了一套完整的国际化机制.Widget最好处理方式能够复用端内机制，而不需要单独开发支持.iOS 8 新引入的自制 framework 的方式来组织需要重用的代码，这样在链接 framework 后 app 和Widget就都能使用相同的代码. 包含Widget中数据请求和数据记忆其他能够复用的代码。这也是我们一开始打算解决方式，但发现剥离这部分代码时间周期明显超过我们预期.所以在国际化处理上我们Widget独立做了一套国际化处理，它和端内在处理机制上并没有多大的不同：
Widget国际化处理
当然重点不再于它的实现，你可以发现我们Widget中国际化文本文件Locallizable.string命名加了一个"WG",这个问题是刚开始开发之初我们一直认为Widget作为端是独立于主应用程序的.所以当初理解为只有把这个文件命名为的“Locallizable.string”才是正常的能够被识别的，但我们调试时发现，Widget打包时会把这些国际化单独放到PlugIns文件下,这里给出一个简体中文全路径：/private/var/mobile/Containers/Bundle/Application/61C637FF-B5BC-432A-ADD5-BA64EBFE98E8/MojiWeather.app/PlugIns/MojiWidget.appex/zh-Hans.lproj根据这个路径你会发现文件时可以找到的，但调试时发现国际化取对应Key的值一直是取不到的，但我们任意非“Locallizable.string”时则是没有问题的，后来我们发现当我们打包在不同机型上测试这个问题时，如果“Locallizable.string”名称命名会导致调试时ok，而最终打包上会出现找不到对应key值得问题.这个原因到我写这篇blog一直没有找到具体的原因.所以我们给出解决方案是一定要和主应用程序“Locallizable.string”保持不同即可解决.当然关于Widget中闪现的问题，因为我们Widget存在两个不同尺寸切换，导致这个问题很明显，处理方式自然是viewWillLoad方式中做好Widget高度在不同场景高度初始化就可以完美避免.这里就不做赘述.如上只是我们解决Widget遇到一些大大小小的问题.解决问题方式虽然没有给出细节，但思路是有的.有不清楚可以文后评论@我即可..
不要尝试为无谓的事情正名.
伴随这iOS 8 系统多达4000项API更新而来同样还有Today Extension.而对iOS而言，有了Today Extension 开发者可以很好借助系统提供的接入点为系统定制的服务,提供自定义的附加功能.这意味着什么呢？从iOS 7版本尝试开路到现在iOS 8更...
用到的组件1、通过CocoaPods安装项目名称项目信息AFNetworking网络请求组件FMDB本地数据库组件SDWebImage多个缩略图缓存组件UICKeyChainStore存放用户账号密码组件Reachability监测网络状态DateTools友好化时间MBP...
发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注
09:45字数 61697阅读 3316评论 2喜欢 85 用到的组件 1、通过CocoaPods安装 项目名称 项目信息 AFNetworking 网络请求组件 FM...
Swift版本点击这里欢迎加入QQ群交流:
最新更新日期：17-11-01 About A curated list of iOS objective-C ecosystem. How to Use Simply presscommand+F+&xxx...
今天，一个顾客来了，这个顾客呀，我们整个美容院的美容师都烦她，一开始她是我的顾客，后来我实在受不了了，交给了别人，然后，她被我们一个人推给另一个人，最后店长无奈地给她做护理了。 这个顾客和我们美容院很近，她在这里有卡，但是，她每次来却不是做护理，比如，有时候说脑袋疼了，就直...
你喜欢你现在的这个世界吗？ 每天黑暗环境里突然响起的闹铃声，下雨天沿着伞沿滴落到裤脚的雨水，人行道上迎面而来的灰色的脸，公交车上谁的衬衫传来樟脑球的味道。太阳在天上闪耀着光，你没有墨镜躺椅柠檬汽水，你只有廉价T恤下揩不尽的臭汗。你感觉天总是阴沉沉的，花没有香味，行道树总是伸...
古老的歌谣——（九）
目录 雪华到了全福的两个舅舅家，舅舅们出去搞运输了，不在家，两个舅妈在家，开始还蛮热情地请雪华喝茶，当知道雪华是为了全福的事才来的，立即就冷了脸，小舅妈说：“政策也不能不讲道理，全福总是要生孩子的，我劝你别没事找事，打胎这种缺德事，我们不会做。你回吧...
在路上的突然感悟，回忆了自己的大学生活。 以前总想追求的绝对和谐，是因为根本不爱彼此 。如果爱的话，就会有付出，付出了就会期待，期待了就会失望，失望了就会吵架。区别就是有些人吵吵就散了，有些人怎么吵都不会散。
舍不得剪的头发，干枯分叉又毛躁。 舍不得删除的记忆，让人哭也会让人笑。 舍不得忘记的人，让人爱又让人恨。 你有那么多舍不得，又怎能看清前行的路。没有更多推荐了，
不良信息举报
举报内容：
Widget的简单应用并适配iOS10
举报原因：
原文地址：
原因补充：
最多只允许输入30个字
加入CSDN，享受更精准的内容推荐，与500万程序员共同成长！iPhone7如何添加widget控件 苹果7添加widget控件方法详细介绍_西西软件资讯
西西软件园多重安全检测下载网站、值得信赖的软件下载站！
→ iPhone7如何添加widget控件 苹果7添加widget控件方法详细介绍
类型：音频处理大小：1M语言：中文 评分：5.1
iPhone7在使用的时候，用户想要添加widget控件的时候，不知道怎么弄。就让小编给大家详细的讲讲怎么弄吧，想知道的一起来看看吧。iPhone7添加widget控件方法详细介绍1）首先我们要在手机主屏幕按住任意地方往下滑，这样就能进入widget控件界面，然后继续滑动到最底部，点击【编辑】按钮。（如图）2）这时就会打开可用widget应用列表，选择添加就可以了，这里一为例，只需点击【支付宝】左边的【+】号，然后点击右上角的【完成】按钮，这样就添加完成了，就可以在widget页面看到支付宝的widget。（如图）
01-2901-2901-2801-2701-2501-2201-2101-1701-1301-13
阅读本文后您有什么感想? 已有23人给出评价!
名称大小下载当前位置：
iOS8通知中心的小部件添加或移除步骤分析
编辑：圆胖子
来源：网络
　　苹果新一代的iOS8系统最为突出的特点之一便是变得更为开放，最直观的体现便是在通知中心里。在iOS8正式版中，用户可以轻松将程序的小部件（Widget）添加到今天（Today）选项卡下方。这意味着信息流将可以在通知中心进行快速访问，无论是待办事项，还是天气数据等等。
　　那么，要怎么才可以把支持的应用小部件添加到通知中心的「今天」选项卡下方？添加后要移除又该如何操作？请往下看详细的步骤分析：
　　|在iOS8通知中心添加小部件
　　第一步：手指从iPhone屏幕顶部向下轻扫来打开通知中心。
　　第二步：选择「今天」选项卡。
　　第三步：滚动屏幕，找到并点击「编辑」按钮。
　　第四步：点击你需要添加的小部件名称前的红色按钮。
　　第五步：你还可以拖动小部件来改变它们出现在通知中心的顺序，最后按右上角的「完成」按钮确定添加。
　　|在iOS8通知中心移除小部件
　　第一步：在在通知中心点击「编辑」按钮。
　　第二步：点击需要删除的小部件名称前的红色按钮。
　　第三步：接着点击小部件名称右方滑入的「移除」按钮。
　　第四步：点击右上角的「完成」按钮确认移除该小部件。
　　｜更多iOS8关联推荐：
　　&iOS8常见问题解答
你可能还对一下内容感兴趣
【上一篇】
【下一篇】
推荐阅读：
看完这篇文章有何感觉？
PP助手准备为您下载应用
未越狱版：鳄鱼小顽皮爱洗澡
如果在10秒后下载任务还没有开始，请下载并安装：
下载步骤如下：iOS Today Extension/widget编程小记
从iOS8开始，下拉的&今天&里，应用可以添加自己的小widget，就是下图这样的东西:
这个东西在Android里叫widget，不过在iOS中我们叫它Today Extension，因为它是iOS中众多种类的extensions中的一种。
Extensions有很多种，Today Extension之外，还有包括Share、Action、Photo Editing、Document Provider、Custom Keyboard、Watch App这些；其中一些很熟悉，像Watch App，另外一些可能不太熟悉；今天主要来研究Today Extension。vcD4NCjxwPsrXz8ijrMjnus60tL2o0ru49lRvZGF5IEV4dGVuc2lvbsTYo7+63LzytaWjrNTa0tHT0LXEz+7Ev8Dvo6zU2lhjb2RlwO+jrNGh1PFGaWxlLU5ldy1UYXJnZXQtQXBwbGljYXRpb24gRXh0ZW5zaW9uLVRvZGF5IEV4dGVuc2lvbqOs0MK9qNK7uPZ0YXJnZXSjrMjnz8LNvMv5yr6hozxiciAvPg0KPGltZyBhbHQ9"这里写图片描述" src="https://www.2cto.com/uploadfile/Collfiles/5.png" title="\" />
这样，一个Today Extension就建好啦。Run一下(就是那个new name，一个空的Today Extension)：
是的，创建一个Today Extension就是这么简单。对于开发者来说，一个Today Extension其实就是一个有点儿特殊的UIViewController；我们可以向这个View Controller中添加subviews，执行任务，等等。不过在开发的过程中，还有一些常见的问题：
怎么跳转到主App？
对于Today Extension来讲，主App的官方名称叫Containing App；widget并没有什么特殊的方式跟Containing App交互，只能跟其它App一样，调用URL Scheme来跳转到Containing App中，执行一些特定操作。
如何确定Today Extension的高度和宽度？
对于Today Extension来说，它的宽度是不能变的，就是屏幕的宽度；而它的高度可以根据内容动态变化。苹果推荐我们使用auto layout，这样Today Extension的高度就可以自适应变化；如果不用auto layout的话，还可以调用
self.preferredContentSize = CGSizeMake(0,100);
来将其高度定为100；
如何定时/下拉时刷新？
定时刷新很简单，用NSTimer就可以，只是要注意dealloc的时候，将NSTimer销毁；
对于下拉刷新，我们就要先搞清楚，下拉的时候，都调用了哪些方法。刚才讲了，Today Extension其实就是一个View Controller，因此它的生命周期，也是viewDidLoad-viewWillAppear-viewDidAppear-viewWillDisappear-viewDidDisappear-dealloc这个路子。也就是说，每次下拉展示Today Extension的时候，都会将这个流程走一遍，所以我们只要在viewDidLoad里调用最新结果就可以了。
如何修改Icon旁边的名字？
默认的名字都是Containing App的Bundle Name，不过我们可以修改这个名字，方法：在Info.plist里，修改Bundle display name。
苹果对Today Extension的建议：苹果认为，Today Extension就是一个执行简单操作、界面也简单的地方，不应当有复杂的界面、复杂的操作。因此最好不要在这里搞的很复杂，否则可能会在提交审核的时候被拒掉。
一些需要注意的地方：
Today Widget是不支持键盘输入的，所以诸如UITextField、UITextView之类的控件不应当放进来。
一般情况下，要避免使用UIScrollView，因为Today View本身就是一个scroll view，这样的话会让用户困惑，在操作的时候容易误操作。
Today Extension不是正常的App，因此有一些限制：
不能使用UIApplication这个类；
不能使用某些标记了NS_EXTENSION_UNAVAILABLE的API，以及一些诸如Health Kit、Event Kit的framework；
不能获取相机、麦克风；
不能长时间运行background tasks；
不能通过AirDrop得到数据，但可以向AirDrop发送数据；
以上就是关于Today Extension的普通问题，还有一些高端的情况，比如增加view时刷新高度、确定extension在特定情况下出现/特定情况下消失，等等情况，还有待进一步研究。