浅色模式和深色模式
如你所知,你可以在iPhone上切换浅色模式和深色模式。如果你不确定如何切换,请按照以下步骤操作:打开iPhone设置,向下滚动并轻触显示与亮度。你将看到标有浅色和深色的两个预览图像。轻触你喜欢的应用即可。这样,你可以根据环境自定义屏幕,以获得更好的可见性和舒适度。自第一代iPhone起,浅色模式就已存在。Apple在2019年9月通过iOS 13 / iPadOS 13正式为iPhone和iPad引入了深色模式,这一功能让许多iPhone用户对定制UI外观感到满意。有些人偏爱浅色模式,而另一些人则对深色模式情有独钟。你还可以选择自动模式,根据一天中的时间在两种模式间切换。
应用开发者如何在两种外观模式中控制UI设计
一个应用在浅色模式下可能看起来完美,但在深色模式下则完全不同。在某些情况下,深色模式可能会无意中破坏开发者的原始设计意图,影响颜色、对比度和整体美感。这意味着开发者必须在两种模式下仔细设计和测试他们的界面,以确保所有用户都能享受到一致而愉快的体验。一种可能的解决方案是为浅色模式和深色模式准备单独的视图和图像资源。然而,这种方法很快就会变得多余且难以维护,尤其是当应用程序不断扩展并添加新的UI组件时。出于这个原因,大多数开发者避免这种方法,而是依赖于能够自动适应两种外观模式的更具可扩展性的解决方案。
依赖系统UI功能
幸运的是,Apple引入了系统定义的颜色,这些颜色能够自动适应浅色模式和深色模式。通过使用这些内置颜色,开发者可以确保其UI元素根据用户的外观设置无缝调整。这消除了手动管理单独设计的需求,并有助于在两种模式下保持视觉一致性。例如,label、systemBackground和secondarySystemBackground等颜色会根据当前外观动态变化,使应用在任何环境中都能保持可读性和视觉平衡。这就是为什么当你从浅色模式切换到深色模式时,默认文本颜色会从黑色变为白色。然而,如果一个应用将其文本颜色硬编码为黑色,那么即使在深色模式下文字也会保持黑色,这使得在深色背景下几乎不可见。为防止此问题,开发者依赖系统颜色,确保文本和UI元素能够自动适应每种模式的适当颜色。
Splync的分类图标在深色模式下的问题
起初,Splync对深色模式用户不是很友好。当一位用户报告说分类图标在深色模式下难以看清时,我无法立即解决这个问题。当时,我专注于改进应用的核心功能,因此没有优先考虑这个视觉问题。到了2026年新年,我终于仔细检查了一下。我发现的问题虽然简单却很重要:图标图像本身是纯黑色的。从技术角度来看,它们被固定为颜色#000000。这意味着无论手机使用什么模式,它们总是黑色的。因此在深色模式下,黑色图标就像伪装一样坐在深色背景上。除此之外,我还在代码中使用了固定的白色来柔化图标背景。这在浅色模式下运作良好,但在深色模式下却产生了尴尬的对比,显得不自然。
我的新代码对图标颜色的改进
我做出的更改是:不再强制指定颜色,而是让系统自动决定图标颜色;浅色模式为黑色,深色模式为白色。此外,代码还让应用使用每个分类本身的颜色作为柔和的背景色调,并用相同的分类颜色添加细微边框,确保在两种模式下都保持清晰可读。简单来说,我不再强制颜色,让iPhone智能处理。借助这一改进,分类图标现在能够自然适应浅色和深色模式,在任何环境中都清晰可见且视觉一致。虽然这一修复不需要太多时间,但我决定立即发布更新,以便尽快解决深色模式用户期待已久的问题。
颜色很重要
没有一个“完美”的审美。每个人的设计感都不一样。即使是同一个人,也会因日子或时间的不同而有不同的感受。早上看起来很棒的东西,晚上可能会让人分心。这就是为什么开发人员必须专注于自定义,同时保持简单和直观的可用性。好的设计不是强迫一种风格,而是让用户选择适合自己的感觉——这就是我的信念。