iOS Widget(小组件)的开发

作者: 在路上浅谈管理 | 来源:发表于2019-07-02 15:46 被阅读0次

    所谓Widget,就是我们熟知的小组件,这是独立于应用之外的又一个新小应用,但是和主应用之间又有着一定的关系。

    例如,如下图所示,就是小组件。

    小组件效果图

    现在很多应用都有小部件功能,用起来非常方便,在用户安装包含Today小部件的应用后,他们可以将小部件添加到Today视图。当用户在“今日”视图中选择“编辑”时,通知中心会显示一个视图,允许用户添加,重新排序和删除小部件。

    常见的有支付宝、日历和天气,那么我们也想为自己的应用增加widget功能该怎么办呢?

    了解这个功能,当然官方文档App Extension Programming Guide是最值得读的了。

    官方对小部件的一段介绍是:

    App extensions in the Today view are called widgets. Widgets give users quick access to information that’s important right now. For example, users open the Today view to check current stock prices or weather conditions, see today’s schedule, or perform a quick task such as marking an item as done. Users tend to open the Today view frequently, and they expect the information they’re interested in to be instantly available.                                                                               “今日”视图中的附加应用信息称为小部件,小部件使用户能够快速访问现在非常重要的信息。例如,用户打开今日视图以检查当前股价或天气状况,查看今天的时间表,或者执行快速任务,例如将项目标记为已完成。用户倾向于经常打开“今日”视图,他们希望他们感兴趣的信息立即可用。

    1.首先因为Widget是一个独立的小应用,因此证书也需要另外的一套,也就是说如果你要开发带有这样功能的APP,你需要两套证书,一套是主项目的,另外一套是widget的,至于证书的创建,在这里我就不多说了,具体流程大家可以网上去找.

    主项目证书的创建流程和普通的创建流程一样,widget的证书创建流程和主项目的创建流程有一点区别

    首先:

    注意一:

    Bundle ID:widget的Bundle Id是在主项目的Bundle ID的基础上加的,例:

    主项目:

    widget:

    注意二:widget的App ID创建的时候要配置 App Groups项,例:

    主项目:

    主项目App Groups配置.png

    widget:

    widget项目App Groups配置.png

    至于怎么配置,其实很简单,大家在创建APP ID的时候,在下面第一项勾选App Groups

    配置App Groups.png

    创建APP ID之后,需要去创建一个App Groups

    App Groups.png

    然后把创建后的App Groups配置到对应的APP ID里面即可,这样证书就可以使用了

    2.接下来,就是创建一个项目或者是在你想要添加widget的项目里面找到

    创建项目:创建一个新的Xcode项目,创建好之后在:创建

    Xcode->File->New->Target->Today Extension 创建我们的Widget

    创建

    项目结构:

    Widget

    项目配置

    项目默认是有storyboard的,这里我想使用纯代码,所以把他删除了,删除后我们要配置一下启动界面,在TodayWidget->Info.plist->Extension

    删除 NSExtensionMainStoryboard 选项

    增加 NSExtensionPrincipalClass,value 为 类的名字 TodayViewController

    这个时候你就可以用纯代码构建布局了

    配置

    这个小组件都有一个展开和折叠的效果,那么怎么实现的呢,看下面:

    增加展开合并功能.png 展开和折叠效果实现.png

    刷新数据:

    点击小组件跳转到主app,

    因为 extension 和 主app 是两个完全独.立的进程,所以它们之间不不能直接通信(不能像应用内部点击按钮,跳转到指定页面)。为了了实现 Widget 调起 app,这里通过 openURL 的方式来启动 主app。

    添加URL Schemes

    在 主app 里配置 Targets->MCWidgetDemo-> Info->Url Types->+

    如下图 设置 URL Schemes 为 TodayWidget

    配置跳转

    我们先来做一个展示,显示出来看看效果:

    widget项目.png

    主应用中的监听:

    好,直接运行看效果:

    效果图

    到这里小组件的开发就完成了,具体上面展示什么,跟平时的开发一样布局显示就好了。widget可以看做是一个附加在应用上的一个小应用,可以进行网络请求的

    接下来主要看看小组件是怎么和主应用数据共享的,

    扩展程序一般都不是脱离宿主程序单独运行的,难免需要和宿主程序进行数据交互。由于拓展与宿主应用是两个完全独立的App,并且iOS应用基于沙盒的形式限制,所以一般的共享数据方法都是实现不了数据共享,这里就需要使用App Groups(App Groups这是iOS8新开放的功能,在OS X上早就可用了。它主要用于同一Group下的App共享同一份读写空间,以实现数据共享)。

    通过 App Groups 提供的同一 group 内 app 共同读写区域,可以用 NSUserDefaults 和NSFileManager 两种方式实现 extension 和 主app 之间的数据共享。

    创建 App Groups

    在开发者网站注册一个App Groups,点击加号,填入名字和id一路确认即可得到下图App Groups。

    app.groups

    在主程序和扩展程序中分别设置打开App Group,设置一个group的名称,这里要保证宿主APP和扩展APP的groupName要是相同的。并且与在开发者网站注册的App Groups保持一致

    主应用 widget

    到这里设置部分就好了,继续:

    利用NSUserDefaults数据共享

    在主应用中存储数据:

    主应用

    在widget中读取数据:

    widget

    注意:保存读取数据的时候必须指明group id;

    利用NSFileManager共享数据

    在主应用中存储数据:

    主应用

    在widget中读取数据:

    widget

    到这里小组件就可以获取得到主应用里面的数据了。我们看看效果:

    效果

    注意:在第一次运行应用之后,可能会显示空值,这是因为没有运行主应用,导致没有数据保存,所以在小组件里面直接运行显示的话,会显示空值。这个时候,点击打开主应用,在左滑倒小组件界面,就会看到在主应用保存的值显示出来了。

    最后,小组件,也是可以进行网络数据申请的,可以跟网易云,今日头条等小组件一样,在滑到小组件界面的时候,可以看见小组件上面的内容会进行刷新,所以,根据自己的项目需求,也可以把网络申请数据刷新等加进去!!!

    相关文章

      网友评论

        本文标题:iOS Widget(小组件)的开发

        本文链接:https://www.haomeiwen.com/subject/junncctx.html