[null,null,["最后更新时间 (UTC):2025-07-29。"],[],[],null,["# Widget configuration\n\nConfigure your widget to display selected content or data from your app.\n\nWhen to use configuration\n-------------------------\n\nLet your user configure their widget either during widget selection or\nthrough touch \\& hold. Consider how crucial\ncustomization is to your widget experience to decide when to make it available.\n\n- If the widget appears empty without choosing settings or customization is central, directly open the configuration workflow during widget placement.\n- If the widget has a preferred default or does not need the user to make a selection before viewing content, then your widget does not need an initial configuration screen. In these cases, let your user access configuration after placement.\n\nDirect users\n------------\n\nWe suggest that you provide a configuration step to provide a customizable and\nglanceable experience for apps with multiple categories of content, such as an\nemail app.\n**Figure 1:** Let your users configure their widget and choose which folder to display.\n\nWhen to use configuration\n-------------------------\n\nAllow your user to configure their widget either between widget selection and\nappearing on the home screen or through touch \\& hold. Consider how crucial\ncustomization is to your widget experience to decide when to make it available.\n\n- If the widget appears empty without choosing settings or customization is central, directly open the configuration workflow during widget placement.\n- If the widget has a preferred default or does not need the user to make a selection before viewing content, then your widget does not need an initial configuration screen. In these cases, let your user access configuration after placement.\n\nDirect users\n------------\n\nLead the user through configuration and provide clear feedback. If your app\nalready contains a configuration flow, you can mirror your in-app configuration\nexperience, ideally minimized for 1 to 2 screens. \ncheck_circle\n\n### Do\n\nProvide a clear path though options that leads to adding a widget.\n\nFor example, the alarm configuration screen on the left only lets the user\nselect an alarm category, and then adds the widget. Tapping the category closes\nthe configuration step and adds the widget. If configuration is not completed,\ndon't cancel adding the widget. Provide a state to allow for restoring or\nconfiguring within the widget. \ncancel\n\n### Don't\n\nLead users to a dead end or treat this step like in-app settings.\n\nIn this example, it isn't clear that closing the configuration view through the\n**x** icon adds the widget, despite choosing content to display.\n\nInclude an empty state if there is no other preset available. The empty state\ncan show an onboarding or authentication reminder to make sure to direct users.\n\nCustomize widget appearance\n---------------------------\n\nProvide a desirable default widget when possible to let users quickly get\nstarted without customization or to help users understand how the widget\nappears on their home screen.\n\nShow a preview of the widget when customizing the widget appearance.\n**Figure 2:** A widget with a preview of the customization.\n\nUse progressive disclosure for advanced controls to help users move quickly\nthrough customization.\n**Figure 3:** Show a size slider after the user selects custom size.\n\nVariations\n----------\n\nFor widgets with limited customization, display popular or distinct\nconfigurations directly in the widget picker. This avoids the need for a\nseparate configuration screen.\n\nApps can support an unlimited number of widgets. However, the widget picker must\nfocus on showcasing only critical tasks and helpful variations. Limit picker\npreviews to 6-8 variations. Allow access to additional variations through a\nconfirmation screen. \ncheck_circle\n\n### Do\n\nProvide distinct widget use cases with configurable options, such as a steps widget and a streak widget. \ncancel\n\n### Don't\n\nDisplay all possible variations in the picker. Instead, display these as configuration options.\n\nLayout\n------\n\nFollow [Layout basics](/design/ui/mobile/guides/layout-and-content/layout-basics) best practices or take advantage of [Material Design\ncomponents](/design/ui/mobile/guides/components/material-overview), such as list layouts with switches, checkboxes, and toggle\nbuttons, when building your configuration screen. For more information on making\nyour widget layout high quality, see [Widget quality](/docs/quality-guidelines/widget-quality)."]]