Mantieni tutto organizzato con le raccolte
Salva e classifica i contenuti in base alle tue preferenze.
Material 3 Expressive si basa sul linguaggio delle forme in modo molto più ampio e significativo utilizzando forme di contenitori flessibili per applicare l'arrotondamento e l'affilatura dei raggi degli angoli per supportare le liste di morphing delle forme e gli stati dei pulsanti.
Il sistema di progettazione introduce anche i pulsanti che aderiscono ai bordi come pattern di progettazione
iconico e di proprietà per i dispositivi rotondi su Wear OS.
Mantenere la scalabilità degli elementi dell'interfaccia utente
Quando progetti layout su uno schermo rotondo, le visualizzazioni scorrevoli e non scorrevoli
hanno requisiti unici per mantenere il ridimensionamento degli elementi UI e preservare
un layout e una composizione bilanciati.
Visualizzazioni con scorrimento
Per le visualizzazioni scorrevoli, utilizza le percentuali per definire tutti i margini superiore, inferiore e laterali
per evitare il ritaglio e fornire un ridimensionamento proporzionale degli elementi.
Tutti i margini superiore, inferiore e laterali devono essere definiti in percentuale per evitare
il ritaglio e fornire il ridimensionamento proporzionale degli elementi.
Visualizzazioni non scorrevoli
Per le visualizzazioni non scorrevoli, utilizza percentuali e vincoli verticali per tutti i margini. In questo modo, i contenuti principali al centro possono estendersi per riempire l'area disponibile.
Tutti i margini devono essere definiti in percentuale e i vincoli verticali devono essere
definiti in modo che i contenuti principali al centro possano estendersi per riempire
l'area disponibile.
Livelli delle norme sulla qualità
Le nostre norme sulla qualità sono organizzate in tre livelli. Offri la migliore esperienza possibile ai tuoi utenti rispettando le linee guida in tutti e tre i livelli.
Pronto per tutte le dimensioni dello schermo
Assicurati che la tua app offra un'esperienza di qualità su tutte le dimensioni dello schermo.
Crea layout che utilizzano completamente lo spazio disponibile nell'app.
Reattivo e ottimizzato
Offri più contenuti agli utenti sui dispositivi che lo consentono e utilizza
layout adattabili che si adattano automaticamente a dimensioni dello schermo diverse.
Adattivo e differenziato
Sfrutta al meglio lo spazio aggiuntivo utilizzando i punti di interruzione per offrire
nuove esperienze potenti su schermi più grandi, impossibili sui dispositivi
con schermi più piccoli.
I campioni di contenuti e codice in questa pagina sono soggetti alle licenze descritte nella Licenza per i contenuti. Java e OpenJDK sono marchi o marchi registrati di Oracle e/o delle sue società consociate.
Ultimo aggiornamento 2025-07-26 UTC.
[null,null,["Ultimo aggiornamento 2025-07-26 UTC."],[],[],null,["# Design quality tiers\n\nMaterial 3 Expressive leans into shape language in a much more expansive and\nmeaningful way by utilizing flexible container shapes to apply rounding and\nsharpening of corner radii to support shape morphing lists and button states.\nThe design system also introduces edge-hugging buttons as an ownable and iconic\ndesign pattern for round devices on Wear OS.\n\nMaintain UI element scaling\n---------------------------\n\nWhen designing layouts on a round screen, scrolling and non-scrolling\nviews each have unique requirements to maintain UI element scaling and preserve\na balanced layout and composition.\n\n\n**Scrolling views**\n\nFor scrolling views, use percentages to define all top, bottom, and side\nmargins to avoid clipping and provide proportional scaling of elements.\n\nAll top, bottom, and side margins should be defined in percentages to avoid\nclipping and provide proportional scaling of elements. \n**Non-scrolling views**\n\nFor non-scrolling views, use percentages and vertical constraints for all\nmargins. That way, the main content in the middle can stretch to fill the\navailable area.\n\nAll margins should be defined in percentages and vertical constraints should be\ndefined such that the main content in the middle can stretch to fill the\navailable area.\n\n\u003cbr /\u003e\n\nTiers of quality guidelines\n---------------------------\n\nOur quality guidelines are organized into three tiers. Enable the best possible\nexperience for your users by meeting guidelines in all three tiers.\n\n\n**Ready for all screen sizes**\n\nEnsure your app is delivering a quality experience across all screen sizes.\nCreate layouts that fully use the available app space. \n\n**Responsive and optimized**\n\nDeliver more content to users on devices which allow for it, and utilize\nresponsive layouts that automatically adapt to different screen sizes. \n\n**Adaptive and differentiated**\n\nMake the most of additional real estate by utilizing breakpoints to offer\npowerful new experiences on larger screens which are not possible on devices\nwith smaller screens.\n\n\u003cbr /\u003e\n\n| **Caution:** A larger display size should *never* display less information than ones that are smaller than it, this is especially relevant for custom behaviors added in at the breakpoint. A common example of this is when components or text sizes are increased past the breakpoint and end up showing less are the larger screens. Screens should always show \"more value\" and never \"less value\" with increasing size."]]
