Designa för hopfällbara: ställningar, fönsterstorlekar och gester
Hur man designar appar för vikbara telefoner: vikta och ovikta layouter, bords- och bokställningar, fönsterstorleksklasser, kontinuitet och gester nära vikningen.
Core Takeaway
Designa vikbara layouter efter tillgänglig fönsterstorlek, inte enhetsmodell: Android:s fönsterstorleksklasser behandlar bredder under 600 dp som kompakta, 600 till 840 dp som medium och 840 till 1200 dp som expanderade. Stöd hopvikta, öppna och halvöppna (bordsskiva) ställningar, håll användarens plats när enheten fälls ihop eller fälls ut och håll nyckelinnehåll och beröringsobjekt borta från vecket.
Ställningar
Androids utvecklardokumentation beskriver hopfällbara i flera ställningar: vikt, öppen platt, öppen platt roterad till liggande och halvöppen, känd som bordsskiva. Viken delar skärmen i två delar, antingen som ett flexibelt område på en skärm eller som ett gångjärn mellan två skärmar, och det kan skymma en del av skärmen.
Design efter fönsterstorleksklasser
Istället för att rikta in sig på specifika enheter grupperar Android tillgängligt utrymme i fönsterstorleksklasser. Kompakt bredd (under 600 dp) täcker nästan alla telefoner i stående; medium bredd (600 till 840 dp) täcker de flesta surfplattor i stående och många stora ovikta inre skärmar i stående; utökad bredd (840 till 1200 dp) täcker de flesta surfplattor och stora ovikta skärmar i landskapet. Stora och extra stora klasser täcker större surfplattor och stationära datorer.
Layouter som använder vecket
Vanliga mönster:
- Vikt: normal telefonlayout.
- Öppna platt: listdetalj- eller tvåpanelslayouter, med varje ruta på ena sidan av vecket.
- Bordsskiva: innehåll som video i den övre halvan, kontroller i den nedre halvan.
- Placera aldrig en knapp, textrad eller ansikte tvärs över vecket.
Kontinuitet
När någon vecklar ut en enhet mitt i uppgiften bör appen fortsätta där de var: samma rullningsposition, samma utkast, samma uppspelning. Behandla vikning och utvikning som en layoutändring, inte en omstart, och animera övergången så att människor kan följa var innehållet flyttade.
Gester och räckvidd
Större ovikta skärmar ändrar tumens räckvidd: placera ofta kontroller nära kanterna där händerna vilar, och undvik kantsvep som kommer i konflikt med systemgester. Fysikbaserad rörelse hjälper även här: rutor som glider och sätter sig med fjädrar gör att bytet mellan ställningarna känns naturligt snarare än skakande.
Nyckel Principles att komma ihåg
- Design efter fönsterstorleksklass, inte enhetsmodell
- Kompakt < 600 dp, medium 600–840 dp, expanderad 840–1200 dp
- Stöd vikta, öppna och bordsställningar
- Håll innehåll och kontroller borta från mitten
- Bevara tillstånd och animera ställningsförändringar
Vanliga frågor
Källor
- Learn about foldables — Android utvecklare
- Use window size classes — Android utvecklare