老铁们，大家好，相信还有很多朋友对于探索iOS14 Widget新功能：用户个性化体验分享和的相关问题不太懂，没关系，今天就由我来为大家分享分享探索iOS14 Widget新功能：用户个性化体验分享以及的问题，文章篇幅可能偏长，希望可以帮助到大家，下面一起来看看吧！
关于Widget代码演示部分，可以直接跳到第三部分：iOS14 Widget代码实现。
1：与iOS13 Widget区别
不同点
最直观的区别是，如官方演示视频所示，组件可以直接布局在iPhone主屏幕上，如下所示。
image iOS13上的Widget是一个整体，从负1屏的一个显示区域内的布局来看，它们都有专门的页面进行管理。在14 上，每个Widget 都是一个独立的组件，它们可以通过简单的长按手势进行自我管理，进行编辑和删除。如果你想改变iOS13上某个Widget的大小，只能通过右上角的下标箭头来编辑和展开它。一般有两种尺寸：NCWidgetDisplayMode 的Expanded 和Compact 属性。 14 中改为三种尺寸：Widget 仅支持3 种尺寸：systemSmall (2x2)、systemMedium (4x2) 和systemLarge (4x4)（基于单个APP-icon 的尺寸）。下图是13-Widget小日历和14-Widget内置日历的对比。 iOS13-Widget
imageiOS14-Widget
iOS13上的image Widget不支持Widget堆叠，可以通过上下滑动切换。并且在14上支持。14还支持在任意主界面上编辑Widget页面。除了显示上的差异，代码实现上也有差异
默认情况下，iOS13 上的Widgets 根据开发语言的选择生成组件。例如，OC 项目生成OC Widget 组件，Swift 项目生成Swift Widget 组件。而到了14，Swift和SwiftUI默认都是基于该语言开发的。
14号使用了新的WidgetKit框架，而不是13号的Today Extension。UI部分只能使用SwiftUI进行开发，所以需要有一定的SwiftUI和Swift基础。
14的Widget需要依赖Xcode12.0版本。
相同点
同一个APP可以开发多个组件，也可以同时使用多个组件。
可以与主程序APP进行交互。
2：iOS14 Widget的特点
14 的小部件更加可定制。它们可以与主屏幕上的应用程序一起排列、堆叠以节省空间，并与Siri 的智能推荐集成。
苹果对于开发中如何设计一个漂亮的小部件（Widget）有更多建议，比如通过颜色、布局和图像传达你的品牌、舒适的信息密度等，具体请查看苹果开发文档
适应不同屏幕尺寸
屏幕尺寸- 纵向小部件- systemSmall 中小部件- systemMedium 大部件- systemLarge414x896 pt (XR/XsMax/11/11ProMax)169x169pt360x169pt360x379pt375x812 pt (X/Xs/11 Pro)155x155 pt329x155 pt329x345 pt414 36 点(6p/6sp/7p)159x159 pt348x159 pt348x357 pt375x667 pt (6/6s/7/8)148x148 pt321x148 pt321x324 pt320x568 pt (5/5s/SE)141x141 pt292x141 pt292x311 pt 支持Widget 配置和交互
3：iOS14 Widget的代码实现
3
1：项目创建
1：Widget 作为项目的组件，创建之前您需要先创建一个iOS项目。
创建新的Xcode Project 语言选择：Swift/OC2：项目创建成功后，点击：File-New-Target 添加Widget Extension Target，点击Next。
image3：输入Widget组件名称，取消勾选，然后单击完成。包含配置意图：是否支持用户配置。
image4：如图所示，可以看到默认生成的模板和默认预览组件尺寸systemSmall。但在真机上编译后，可以看到Widget的三种尺寸。您可以在预览方法中添加systemMedium和systemLarge预览。 Xcode12上最右边的可视化界面直接运行模拟器并在真机上编译。
imageAdd各种尺寸的组件预览//MARK: - 预览
结构AdopterWidget_Previews: PreviewProvider {
静态变量预览：一些视图{
///小的
AdopterWidgetEntryView（条目：条目）
.previewContext(WidgetPreviewContext(family:systemSmall))
///中间
AdopterWidgetEntryView（条目：条目）
.previewContext(WidgetPreviewContext(family:systemMedium))
///大的
AdopterWidgetEntryView（条目：条目）
.previewContext(WidgetPreviewContext(family:systemLarge))
}
}5：熟悉Hello World后开始编写新的demo。
image6：预览上面视图的工具
最左边的项目：Live Preview：Xcode 视图预览。左边第二个：Preview on Device：真实设备预览，会在你的真实设备上编译出一个APP：Xcode Previews不包含APP应用Widget组件。
3：与主应用交互
根据官方文档的描述，点击Widget窗口调用APP进行交互并指定跳转支持两种方式：
widgetURL：点击区域为Widget的所有区域，代码如下。 if family==.systemSmall { //小
VStack(alignment:center, 间距： 20, content: {
文本（条目.引用.作者）
.font(.system(size: 16))
文本(entry.quotes.content[0])
.font(.system(size: 15))
.foregroundColor(.black)
Text("(entry.quotes.date) at (entry.quotes.place) ")
.font(.system(size: 9))
.foregroundColor(.灰色)
})
.frame(maxWidth: /*@START_MENU_TOKEN@*/.infinity/*@END_MENU_TOKEN@*/, maxHeight: /*@START_MENU_TOKEN@*/.infinity/*@END_MENU_TOKEN@*/,alignment: /*@START_MENU_TOKEN@*/.center/*@END_MENU_TOKEN@*/).padding(16)
.widgetURL(URL(string: "https://www.baidu.com/small"))
}Link：通过Link修改，可以让界面上的不同元素产生点击响应。 if family==.systemMedium { //中等
VStack(alignment:center, 间距： 8, content: {
文本（条目.引用.作者）
.font(.system(size: 18))
.frame(高度： 30，对齐方式：top)
链接(destination: URL(string: "https://www.baidu.com/medium/1")!) {
文本(entry.quotes.content[0])
.font(.system(size: 17))
.foregroundColor(.black)
.frame(maxWidth:infinity,alignment:leading)
}
链接(destination: URL(string: "https://www.baidu.com/medium/2")!) {
文本(entry.quotes.content[1])
.font(.system(size: 17))
.foregroundColor(.black)
.frame(maxWidth:infinity,alignment:leading)
}
Text("(entry.quotes.date) at (entry.quotes.place) ")
.font(.system(size: 12))
.foregroundColor(.灰色)
.frame(maxWidth:infinity,alignment:trailing)
.frame(高度： 20，对齐方式：bottom)
})
.frame(maxWidth:infinity, maxHeight: /*@START_MENU_TOKEN@*/.infinity/*@END_MENU_TOKEN@*/,alignment:center).padding(16)
}笔记！systemSmall（小型组件）仅支持widgetURL，而systemMedium（中型组件）和systemLarge（大型组件）均支持。链接：更希望的是不同元素的点击响应。
在主项目的SceneDelegate 代理方法中接收回调- (void)scene:(UIScene *)scene openURLContexts:(NSSet*)URLContexts {
///根据不同的URL回调进行响应
NSLog(@"%@",URLContexts);
}
4：部分代码和方法注释
1：默认模板代码注释
提供占位符方法作为没有特定属性的通用可视化视图。 func placeholder(in context: Self.Context) -Self.Entry 提供表示当前时间和状态的视图，可以理解为false 或者供用户临时选择组件的显示信息。数据可以显示在“添加小部件”页面上。 func getSnapshot(in context: Self.Context,completion: @escaping (Self.Entry) -Void) 提供了一个视图更新数组，或者与上述方法相反的实际数量的信息，通过时间轴显示。可以设置更新时间。下面的refreshDate 定义告诉组件每5 分钟重新加载一次。 func getTimeline(in context: Self.Context,completion: @escaping (Timeline) -Void)
///这是更新时间5分钟
让refreshDate=Calendar.current.date（通过添加：分钟，value: 5，to: currentDate）！笔记！苹果原始文档中有一段话
显示动态日期
由于您的小部件扩展并不总是运行，因此您无法直接更新小部件的内容。相反，WidgetKit 代表您呈现小部件的视图并显示结果。但是，某些SwiftUI 视图允许您在小部件可见时显示持续更新的内容。
由于您的小部件扩展并不总是运行，因此您无法直接更新小部件的内容。相反，WidgetKit 代表您呈现小部件的视图并显示结果。但是，某些SwiftUI 视图允许您在小部件可见时显示持续更新的内容。
这使得无法预测Widget 何时更新。即使你让时间轴本身在上面设置的5 分钟后再次更新，也不能保证iOS 会同时更新视图。这会导致Widget页面的更新有一定的延迟。
Apple 提供了一个单独的方法来重新加载所有小部件///控制所有配置的小部件的重新加载时间线
///包含应用程序。
WidgetCenter.shared.reloadAllTimelines()
2：对于支持多个Widget和小、大、中页面数据布局的思考？
在检查Apple API 之前，我有两件事感到困惑？
如何定义多个Widget，小中大布局完全不同。是否可以通过单个扩展项目来实现？
数据定义和更新
通过上面默认方法的引入，已经解决了第二个问题。
iOS14中的Widget支持通过创建扩展项目来返回一个或多个Widget，这使得您的应用程序可以提供多种Widget选择。并且在项目中，视图可以通过WidgetFamily枚举来定制自己想要的组件和布局。
WidgetFamily 枚举public enum WidgetFamily : Int, RawRepresentable, CustomDebugStringConvertible, CustomStringConvertible {
///一个小部件。
案例系统小
///一个中等大小的小部件。
案例系统中
///一个大的小部件。
案例系统大
}可以通过修改原来的Widget入口文件方法，添加更多的配置来支持多个Widget：@main
结构SwiftWidgetsBundle: WidgetBundle {
@WidgetBundleBuilder
var body: 一些小部件{
小部件1()
小部件2()
小部件3()
小部件4()
.
}
}
5：样式/演示
在编写Widget的过程中，你可以直观地查看你的组件的预览，就像你开发SwiftUI时，你可以实时Resume一样。组件预览WidgetDemo 完整演示组件并点击响应演示
6：项目地址
欢迎下载WidgetDemo 查看更多演示项目中的源代码。
项目github地址：iOS14WidgetDemo
新的Widget组件还支持用户配置（包括配置意图）。演示中没有演示这一点。以后如果有需要的话我会更新的。
4：参考文献
Apple 小部件
小工具包
小部件已更新
制作可配置的小部件
如何在iOS 14 中使用Swift 创建小部件
5：总结
更新到iOS14后，无论是用户体验还是组件开发过程都更加流畅。除了改用SwiftUI的开发时间成本之外，完成项目组件的最新形态还是很有吸引力的，而且开发起来也很舒服。
新的小部件玩具感觉很强大，感觉还有很多东西需要更新和补充。
【探索iOS14 Widget新功能：用户个性化体验分享】相关文章：
2.米颠拜石
3.王羲之临池学书
8.郑板桥轶事十则
用户评论
感觉widget真的挺方便的，手机桌面不用那么空荡，能一目了然看时间、天气预报什么的。
有19位网友表示赞同！
终于可以自定义桌面布局了！之前一直觉得苹果机桌面有点单调。
有7位网友表示赞同！
我试了一下股票 widget，还能实时更新数据，这个功能还是挺实用的。
有14位网友表示赞同！
现在widget的种类越来越丰富了，希望未来能看到更多第三方开发的 widget 进来，丰富桌面体验。
有14位网友表示赞同！
我还想看一个可以显示待办事项的 widget。
有8位网友表示赞同！
用 widgets 把常用功能放到最显眼的地方，感觉确实比以前更快更方便。
有13位网友表示赞同！
这东西还是挺考验创意的，设计一个颜值高的widget 很难。
有16位网友表示赞同！
有些 widget 的操作还是不太顺畅，需要再优化下。
有15位网友表示赞同！
希望 iOS14 Widget 的功能能随着时间不断完善。
有15位网友表示赞同！
苹果这次真是一点一进步，把 widget 做得越来越成熟。
有15位网友表示赞同！
iOS14 Widget 确实提升了手机桌面的互动性，而且很个性化。
有14位网友表示赞同！
对于喜欢玩手机的人来说，widgets 绝对是福音！
有9位网友表示赞同！
我最近把几个常用的widget都设置在了桌上，现在使用体验确实变好了很多。
有12位网友表示赞同！
以后应该可以把常用的 app 直接放到 widget 之中，这样更方便了。
有9位网友表示赞同！
希望 iOS14 Widget 能支持更多app 的功能整合。
有6位网友表示赞同！
这个更新挺好的，让手机桌面更加灵活和实用。
有11位网友表示赞同！
iOS14Widget 真的值得体验一下，会让你对手机的桌面使用方式有新的认知。
有6位网友表示赞同！
对于喜欢定制化手机桌面的用户来说，iOS14 Widget 简直太棒了！
有19位网友表示赞同！
这个功能可能会改变未来我们使用手机的方式。
有10位网友表示赞同！