wshobson/mobile-ios-design

mobile-ios-design 是做什么的？

精通 iOS 人机界面指南和 SwiftUI 模式，用于构建原生 iOS 应用。在设计 iOS 界面、实现 SwiftUI 视图或确保应用遵循 Apple 设计原则时使用。

概述

该技能提供全面的 iOS 设计最佳实践，帮助你创建符合 Apple 人机界面指南（HIG）和 SwiftUI 设计模式的用户界面。它涵盖了导航、布局、颜色、字体、交互和可访问性等关键领域，确保你的应用既美观又易于使用。

核心功能

• 界面设计指南：根据 HIG 提供特定的设计建议，包括导航栏、标签栏、表格视图和集合视图。
• SwiftUI 实现模式：展示如何用 SwiftUI 构建常见 UI 组件，如列表、表单、导航堆栈和模态视图。
• 设计一致性检查：评估现有视图是否符合 Apple 的设计原则，包括间距、对齐、颜色使用和字体选择。
• 可访问性支持：指导如何整合动态类型、旁白支持和高对比度模式等无障碍功能。

使用方式

1. 询问设计建议：描述你的 iOS 界面需求，技能将提供符合 HIG 的建议。
2. 实现 SwiftUI 视图：提供代码片段或模式，帮助你快速构建视图。
3. 检查设计合规性：提交现有 SwiftUI 代码，技能将分析并指出改进点。

示例

用户：如何在 SwiftUI 中创建一个符合 HIG 的导航栏？

技能响应：在 SwiftUI 中，使用 NavigationStack 和 toolbar 修饰符来创建导航栏。以下是一个基本示例：

struct ContentView: View {
    var body: some View {
        NavigationStack {
            List(1..<20) { i in
                Text("行 \(i)")
            }
            .navigationTitle("我的列表")
            .toolbar {
                ToolbarItem(placement: .navigationBarTrailing) {
                    Button("编辑") {
                        // 编辑操作
                    }
                }
            }
        }
    }
}

注意事项

• 始终优先使用系统组件和标准交互模式，以保持一致性。
• 遵循安全区域和布局边距，确保内容在所有设备上正确显示。
• 利用 SwiftUI 的声明式语法，减少自定义 UI 代码的复杂性。
• 将可访问性作为一个核心功能，而不是后期添加的补丁。