iOS 18 新增Home screen Tint Color(色调)选择,用户可以通过以下方式自定义主屏幕颜色,并且小组件,APP 图标也会跟随改颜色。
比如说意料之外的小组件(不兼容)
白色部分内部应该还有其他显示内容(title和图标)。 而且这里设置的item背景颜色也不是白色(系统会自动设置为白色)。
如果是 accented 模式,小组件背景会自动调整为灰黑色,设置了颜色的地方会自动变为白色(随便你设置什么颜色),标记为 accentable 的组件会按照主题色显示。
小组件兼容
控件支持 Accentable
通过设置widgetAccentable将控件添加到着重组(会使用用户选择的颜色渲染,忽略本身设置的颜色)
var body: some View {
VStack {
Text("MON")
.font(.caption)
.widgetAccentable()
Text("6")
.font(.title)
}
}
}
在视图上调用
widgetAccentable(true)
将其移动到着重组后,在其子视图上调用widgetAccentable(false)
不会将子视图移回默认组
图片兼容
借助widgetAccentedRenderingMode设置不同样式
Image("iconName")
.resizable()
.widgetAccentedRenderingMode(.fullColor)
如果需要兼容低版本,可以使用下面扩展
@ViewBuilder
func widgetImageAccentedDesaturated() -> some View {
if Bundle.main.bundlePath.hasSuffix(".appex"){
if #available(iOS 18.0, *) {
widgetAccentedRenderingMode(.accented) // 或.accentedDesaturated
}
}
}
widgetRenderingMode深层次定制
widgetRenderingMode,可以动态获取当前模式,根据条件配置不同的样式。
struct ItemView: View {
@Environment(\.widgetRenderingMode) private var widgetRenderingMode
}
但是并不能在 accented 模式显示其他颜色。但是可以设置透明度。
最佳方案
借助 widgetRenderingMode 在accented模式下,设置颜色透明度,来完成不同层次的显示。
比如:
参考
widgetaccentable – Apple Document
WidgetRenderingMode – Apple Document
iOS 18 小部件:添加对色调的支持 – Medium
How to support tinted home screen widgets in iOS 18