Zunächst einmal bin ich ein mobiler Entwickler und riskiere von Anfang an die Entwicklung eines Layouts für meine App Das folgende Problem wurde festgestellt: Photoshop verwendet PX als Maßeinheit für die Formulare. In der Entwicklung verwendet die App DP. Ich weiß, wie die Konvertierung von PX zu PD funktioniert.
dp = px * (160 / dpi)
Wenn ich jedoch eine Formel anwende und die Werte in der Programmierung verwende, bricht das Layout. Ich würde gerne wissen, ob es eine PSD-Dateikonfiguration gibt, wie z. B. Höhe, Breite, Pixeldichte, auf der ich meine App modellieren kann. Machen Sie es sich also einfach, diese Maßnahmen für Handys und Tablets durchzuführen?
Antwort
Photoshop verwendet PX als Maßeinheit für die Formulare und in der Entwicklung der App verwendet DP, ich weiß, wie die Konvertierung funktioniert Von PX nach DP
Die Konvertierung hängt von o ab n wie das ursprüngliche Design in Photoshop erstellt wurde. Die dp -Einheiten von Android sind dichteunabhängige Pixel. 1dp wird je nach Geräte- und Android-Einstellungen möglicherweise als 1 Bildschirmpixel oder 2 oder 3 oder 4 oder ein anderer Wert gerendert.
Hier ist eine Liste der gängigen Konvertierungen:
- 1 dp = 1 Pixel oder 1 × für
mdpiAnzeigen (~ 160PPI). - 1 dp = 1,5 Pixel oder 1,5 × für
hdpi-Anzeigen (~ 240PPI). - 1 dp = 2 Pixel oder 2 × für
xhdpiAnzeigen (~ 320PPI). - 1 dp = 3 Pixel oder 3 × für
xxhdpiAnzeigen (~ 480PPI). - 1 dp = 4 Pixel oder 4 × für
xxxhdpi-Anzeigen (~ 640PPI).
Die große Frage ist also, welche Dichte Sie möchten um deine Modelle einzubauen? Sie können eine der oben genannten Dichten auswählen. Ihre Wahl bestimmt die Konvertierung und andere Faktoren.
Ich bevorzuge es, mit 1 × eine Skala zu entwerfen, in der 1 dp = 1 px = 1 CSS px = 1 iOS point. Das bedeutet, dass Ihre Modelle eine niedrigere Auflösung haben als das Gerät selbst, aber für die Konvertierung muss der Wert nicht geändert werden.
Wenn Sie fertig sind, bietet Photoshop einige Möglichkeiten, Assets für die verschiedenen Dichten zu exportieren . Export As und Generator können die anderen Skalen erstellen, oder Sie können Save for Web und Slices ( wie ich ).
Hier ist das Fenster „Exportieren als“ von Photoshop, wobei der Export für 1 ×, 2 × und 3 × Dichten eingerichtet ist ( in diesem Fall für iOS).
Antwort
Ihre Formel ist falsch. Als Referenz sagt Android-Entwicklungshandbuch :
px = dp * (dpi) / 160)
Die tatsächliche Formel für dp lautet also
dp = px / (dpi / 160)
Ich hoffe, das hilft!
Für den zweiten Teil Ihrer Frage ist Photoshop ziemlich langweilig, wenn Es geht um den Export von Assets oder sogar Spleißen. Wenn Sie offen für die Verwendung von Sketch sind, ist dies viel einfacher. Tut mir leid, als mobiler Designer verwende ich Photoshop kaum, da die Konvertierung von px in dp in diesem Programm nicht einfach ist.
Überarbeitet
Ich glaube, ich verstehe Ihre Frage jetzt besser. Auf dieser Website finden Sie die Werte, nach denen Sie suchen: https://www.paintcodeapp.com/news/ultimate-guide-to-iphone-resolutions
Kommentare
- Entschuldigung, ich habe die falsche Formel in den Beitrag geschrieben, also habe ich die richtige Formel für die Konvertierung verwendet. Meine Frage ist, wie groß die Datei sein soll, damit ich kann die Werte richtig exportieren. Und auf Sketch kann ich es nicht verwenden, das Betriebssystem ist Linux. Um Photoshop zu verwenden, musste ein Tool namens Wine verwendet werden, mit dem Photoshop unter Linux ausgeführt werden kann.
Antwort
Dies ist hier möglicherweise kein Thema, aber ich würde empfehlen, Photoshop überhaupt nicht für die Bildschirmgestaltung zu verwenden. Verwenden Sie ein Vektorwerkzeug wie Illustrator, Sketch oder ähnliches. Der Unterschied besteht darin, dass Sie Ihre Designs später skalieren können. Wenn Sie in Photoshop mit einer Größe von 1x arbeiten, sehen Ihre Designs auf einem modernen Andriod-Telefon schrecklich aus. Sie müssten die Designs mindestens 2x und besser 4x einrichten, damit sie auf einem Bildschirm mit hohen ppi-Werten reibungslos aussehen.
Auch alle Assets, die Sie mit einem Vektorwerkzeug erstellen, können später als verwendet werden Assets für alle erforderlichen Größen. In Photoshop ist es viel aufwändiger, Schaltflächen, Symbole usw. für einen späteren Export zu isolieren.