Först och främst är jag mobilutvecklare och jag riskerar att utveckla en layout för min app, redan från början hittade följande problem, Photoshop använder PX som måttenhet för blanketterna och under utveckling använder appen DP, jag vet hur konverteringen fungerar Från PX till PD
dp = px * (160 / dpi)
Men när jag tillämpar en formel och använder värdena i programmeringen bryts layouten, Jag skulle vilja veta om det finns en PSD-filkonfiguration, som höjd, bredd, pixeldensitet där jag kan använda som bas för att mockupera min app så gör det enkelt att bära dessa åtgärder för mobil och surfplattor?
Svar
Photoshop använder PX som måttenhet för blanketterna och under utveckling av appen använder DP, jag vet hur omvandlingen fungerar Från PX till DP
Omvandlingen beror på n hur den ursprungliga designen i Photoshop konstruerades. Androids dp
enheter är densitetsoberoende pixlar. 1dp kan återges som en skärmpixel, eller 2, eller 3 eller 4, eller något annat värde, beroende på enhetens och Android-inställningarna.
Här är en lista över vanliga omvandlingar:
- 1 dp = 1 pixel, eller 1 ×, för
mdpi
visar (~ 160PPI). - 1 dp = 1,5 pixlar, eller 1,5 × , för
hdpi
visar (~ 240PPI). - 1 dp = 2 pixlar, eller 2 ×, för
xhdpi
visar (~ 320PPI). - 1 dp = 3 pixlar, eller 3 ×, för
xxhdpi
visar (~ 480PPI). - 1 dp = 4 pixlar, eller 4 ×, för
xxxhdpi
skärmar (~ 640PPI).
Så, den stora frågan är vilken densitet du vill ha att bygga dina mockups i? Du kan välja någon av ovanstående densiteter. Ditt val kommer att diktera omvandlingen och andra faktorer.
Min preferens är att utforma med 1 ×, en skala där 1 dp
= 1 px
= 1 CSS px
= 1 iOS point
. Det betyder att dina mockups har lägre upplösning än själva enheten, men det betyder att konverteringen inte kräver någon förändring av värdet.
När du är klar har Photoshop några sätt att exportera tillgångar för de olika densiteterna. . Export As
och Generator
kan bygga de andra skalorna, eller så kan du använda Save for Web
och skivor ( som jag gör ).
Här är Photoshops fönster Exportera som, med exporten inställd på 1 ×, 2 × och 3 × densiteter ( för iOS, i det här fallet).
Svar
Din formel är felaktig. Som referens säger Android-utvecklingshandbok ,
px = dp * (dpi / 160)
så den faktiska formeln för dp är
dp = px / (dpi / 160)
Hoppas det hjälper!
För den andra delen av din fråga är Photoshop ganska tråkigt när det gäller att exportera tillgångar eller till och med skarvar. Om du är öppen för att använda Sketch är det så mycket lättare. Men tyvärr, som mobildesigner använder jag knappast photoshop eftersom konvertering av px till dp inte är en lätt sak att göra i det programmet.
Revised
Jag tror att jag förstår din fråga bättre nu. Titta på den här webbplatsen för de värden du letar efter: https://www.paintcodeapp.com/news/ultimate-guide-to-iphone-resolutions
Kommentarer
- Tyvärr skrev jag fel formel i inlägget så jag använde rätt formel för konverteringen, min fråga är vad som ska vara storleken på filen så att jag kan exportera värdena ordentligt. Och på Sketch kan jag inte använda det, operativsystemet är Linux. För att använda Photoshop var det nödvändigt att använda ett verktyg som heter Wine som gör att Photoshop kan köras på Linux.
Svar
Detta kanske inte är ämnet här, men jag rekommenderar att du inte använder Photoshop alls för skärmdesign. Använd ett vektorverktyg som Illustrator, Sketch eller liknande. Skillnaden är att du kan skala upp dina mönster senare. Om du arbetar i Photoshop i en storlek på 1x ser dina mönster hemskt ut på en modern Andriod-telefon. Du måste ställa in designen åtminstone 2x, bättre 4x så att de ser smidiga ut på en hög-ppi-skärm.
Alla tillgångar som du skapar med ett vektorverktyg kan också tillgångar för alla storlekar som krävs. I Photoshop blir det mycket mer arbete att isolera knappar, ikoner etc. för en senare export.