[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-cb8ef72a-4a5c-4e18-8b52-bb022f86ec91":3,"$fQAbKJ5g44S7RhSSMv4Lcr-MedF_-ZKb-c0mmcfGiuno":42},{"id":4,"title":5,"description":6,"categoryId":7,"moduleId":8,"tags":9,"prompt":10,"icon":11,"source":12,"sourceUrl":13,"authorId":14,"authorName":15,"isPublic":16,"stars":17,"runs":18,"createdAt":19,"updatedAt":19,"module":20,"category":27,"packages":33},"cb8ef72a-4a5c-4e18-8b52-bb022f86ec91","hig-components-controls","检查.claude\u002Fapple-design-context.md文件后再提问。使用现有上下文，只询问尚未涵盖的信息。","cat_coding_backend","mod_coding","sickn33,coding","---\nname: hig-components-controls\ndescription: \"Check for .claude\u002Fapple-design-context.md before asking questions. Use existing context and only ask for information not already covered.\"\nrisk: unknown\nsource: community\ndate_added: '2026-02-27'\n---\n\n# Apple HIG: Selection and Input Controls\n\nCheck for `.claude\u002Fapple-design-context.md` before asking questions. Use existing context and only ask for information not already covered.\n\n## Key Principles\n\n1. **Clear current state.** Users must always see what is selected. Toggles show on\u002Foff, segmented controls highlight the active segment, pickers display the current selection.\n\n2. **Prefer standard system controls.** Built-in controls provide consistency and accessibility. Custom controls introduce a learning curve and may break assistive features.\n\n3. **Toggles for binary states.** On or off. In Settings-style screens, changes take effect immediately. In modal forms, changes commit on confirmation.\n\n4. **Segmented controls for mutually exclusive options.** 2-5 items, roughly equal importance, short labels.\n\n5. **Sliders for continuous values.** When precise numeric input is not critical. Provide min\u002Fmax labels or icons for range endpoints.\n\n6. **Pickers for long option lists.** Too many options for a segmented control. Works well for dates, times, structured data.\n\n7. **Steppers for small, precise adjustments.** Increment\u002Fdecrement in fixed steps. Display current value next to the stepper with reasonable min\u002Fmax bounds.\n\n8. **Text fields for short, single-line input.** Text views for multi-line. Configure keyboard type to match expected input (email, URL, number).\n\n9. **Combo boxes: text input + selection list.** macOS. Type a value or choose from a predefined list when custom values are valid.\n\n10. **Token fields: discrete values as visual tokens.** macOS. For email recipients, tags, or collections of discrete items.\n\n11. **Gauges and rating indicators display values.** Gauges show a value within a range. Rating indicators show ratings (often stars). Display-only; use interactive variants for input.\n\n## Reference Index\n\n| Reference | Topic | Key content |\n|---|---|---|\n| [controls.md](references\u002Fcontrols.md) | General controls | States, affordance, system controls |\n| [toggles.md](references\u002Ftoggles.md) | Toggles | On\u002Foff, immediate effect |\n| [segmented-controls.md](references\u002Fsegmented-controls.md) | Segmented controls | 2-5 options, equal weight |\n| [sliders.md](references\u002Fsliders.md) | Sliders | Continuous range, min\u002Fmax labels |\n| [steppers.md](references\u002Fsteppers.md) | Steppers | Fixed steps, bounded values |\n| [pickers.md](references\u002Fpickers.md) | Pickers | Dates, times, long option sets |\n| [combo-boxes.md](references\u002Fcombo-boxes.md) | Combo boxes | macOS, type or select, custom values |\n| [text-fields.md](references\u002Ftext-fields.md) | Text fields | Short input, keyboard types, validation |\n| [text-views.md](references\u002Ftext-views.md) | Text views | Multi-line, comments, descriptions |\n| [labels.md](references\u002Flabels.md) | Labels | Placement, VoiceOver support |\n| [token-fields.md](references\u002Ftoken-fields.md) | Token fields | macOS, chips, tags, recipients |\n| [virtual-keyboards.md](references\u002Fvirtual-keyboards.md) | Virtual keyboards | Email, URL, number keyboard types |\n| [rating-indicators.md](references\u002Frating-indicators.md) | Rating indicators | Star ratings, display-only |\n| [gauges.md](references\u002Fgauges.md) | Gauges | Level indicators, range display |\n\n## Output Format\n\n1. **Control recommendation with rationale** and why alternatives are less suitable.\n2. **State management** -- how the control communicates current state and whether changes apply immediately or on confirmation.\n3. **Validation approach** -- when to show errors and how to communicate rules.\n4. **Accessibility** -- labels, traits, hints for VoiceOver.\n\n## Questions to Ask\n\n1. What type of data? (Boolean, choice from fixed set, numeric, free-form text?)\n2. How many options?\n3. Which platforms? (Combo boxes and token fields are macOS-only)\n4. Settings screen or inline form?\n\n## Related Skills\n\n- **hig-components-menus** -- Buttons and pop-up buttons complementing selection controls\n- **hig-components-dialogs** -- Sheets and popovers containing forms\n- **hig-components-search** -- Search fields sharing text input patterns\n- **hig-inputs** -- Keyboard, pointer, gesture interactions with controls\n- **hig-foundations** -- Typography, color, layout for control styling\n\n---\n\n*Built by [Raintree Technology](https:\u002F\u002Fraintree.technology) · [More developer tools](https:\u002F\u002Fraintree.technology)*\n\n## When to Use\nThis skill is applicable to execute the workflow or actions described in the overview.\n\n## Limitations\n- Use this skill only when the task clearly matches the scope described above.\n- Do not treat the output as a substitute for environment-specific validation, testing, or expert review.\n- Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.\n","","imported","https:\u002F\u002Fgithub.com\u002Fsickn33\u002Fantigravity-awesome-skills","user_system_seed","SkillOPIC",true,248,1363,"2026-05-16 13:21:50",{"id":8,"name":21,"slug":22,"icon":23,"description":24,"sort":25,"createdAt":26},"编程开发","coding","mdi-code-braces","代码生成、调试、审查，提升开发效率",2,"2026-05-16 12:53:40",{"id":7,"name":28,"slug":29,"icon":30,"description":31,"moduleId":8,"sort":25,"skillCount":32,"createdAt":26},"后端开发","backend","mdi-server","API、数据库、服务端架构",296,[34],{"id":35,"skillId":4,"version":36,"fileName":37,"fileSize":38,"filePath":39,"fileHash":40,"manifest":41,"createdAt":19},"2eaa7057-0e08-48af-8491-2d4b7e20a7a5","1.0.0","hig-components-controls.zip",39186,"uploads\u002Fskills\u002Fcb8ef72a-4a5c-4e18-8b52-bb022f86ec91\u002Fhig-components-controls.zip","01d5c166f71f66944ddf333da1f4477df127c95fffc4c9d4f62403006021b9f0","[{\"path\":\"SKILL.md\",\"isDirectory\":false,\"size\":5014},{\"path\":\"references\u002Fcombo-boxes.md\",\"isDirectory\":false,\"size\":2671},{\"path\":\"references\u002Fcontrols.md\",\"isDirectory\":false,\"size\":11578},{\"path\":\"references\u002Fgauges.md\",\"isDirectory\":false,\"size\":5940},{\"path\":\"references\u002Flabels.md\",\"isDirectory\":false,\"size\":7144},{\"path\":\"references\u002Fpickers.md\",\"isDirectory\":false,\"size\":10006},{\"path\":\"references\u002Frating-indicators.md\",\"isDirectory\":false,\"size\":2349},{\"path\":\"references\u002Fsegmented-controls.md\",\"isDirectory\":false,\"size\":9758},{\"path\":\"references\u002Fsliders.md\",\"isDirectory\":false,\"size\":9076},{\"path\":\"references\u002Fsteppers.md\",\"isDirectory\":false,\"size\":2624},{\"path\":\"references\u002Ftext-fields.md\",\"isDirectory\":false,\"size\":8147},{\"path\":\"references\u002Ftext-views.md\",\"isDirectory\":false,\"size\":4250},{\"path\":\"references\u002Ftoggles.md\",\"isDirectory\":false,\"size\":13982},{\"path\":\"references\u002Ftoken-fields.md\",\"isDirectory\":false,\"size\":3834},{\"path\":\"references\u002Fvirtual-keyboards.md\",\"isDirectory\":false,\"size\":17675}]",{"code":43,"message":44,"data":45},200,"success",{"items":46,"stats":47,"page":50},[],{"averageRating":48,"totalRatings":48,"ratingCounts":49},0,[48,48,48,48,48],{"limit":51,"offset":48,"hasMore":52,"nextOffset":51,"ratedOnly":16},15,false]