So erstellen Sie ein Bild als Hintergrundbild für alle Bildschirmgrößen

Question

Wie erstelle ich ein Bild für alle Bildschirmgrößen wie iPhone 5 bis 6 \ 6+ (dasselbe wie 7 \ 7+)?

hier die Verwirrung, erstelle ich eine oder ich erstelle ein paar Basisbilder?

Ich lese über die @ 1x, @ 2x, @ 3x. Aber ich bin immer noch verwirrt.

     iphone4 iphone5  iphone6  phone6+ 

Canvas Size(pts) 320x460 320x568  375x667  414x736 
Screen Size(Px)  640x960 640 x1136  750x1334  1080x1920 

Hier die Ansätze, die ich verwenden werde, bitte helfen Sie mir, sie zu beheben.

Dies ist, was ich auf der Bildschirmgröße jedes iPhone tun werde.

Approach (A):

1.0) erzeugen nur eine Basis Bild der Größe 320x568 (Unterseite auf iphone 5)

1.1) Name dieses Bild: myimage320x568.png, myimage320x568@2x.png, myimage320x568 @ 3x.png

ist der richtige Weg? Wird das System das Bild korrekt für iphone5/6/6 + skalieren?

Approach (B)

1. Erstellen Sie ein Bild von 320x568 für iphone5 Name es. myimage320x568.png

2. ein Bild von 375x667 für iphone6 ​​

   Namen erstellen es myimage375x667.png, eine Kopie erstellen und es für iphone6 ​​+

   myimage375x667@2x.png

3. ein Bild von 414x736 erstellen nennen

   Name es myimage414x736.png, myimage414x736 @ 3x.png

   4) Code verwenden iPhone-Modell zu erkennen oder screen.height

   if (iphone5){ 
   
       use myimage320x568.png 
   
   } else if (iphone 6 or 7) { 
   
       use myimage375x667.png 
   
   } else if (iphone 6+ or 7+) { 
   
       use myImage414x736.png 
   
   } 
   

ist das korrekt?

// - Update

Dies funktioniert. Aber ich bin mir nicht sicher, was die Basis Bildgröße sollte verwenden?

Verwendung dieses 375x667 (iphone6) oder diese Größe 414x736 (iphone 6+) als Basis-Image

UIGraphicsBeginImageContext(self.view.frame.size) 

let img = UIImage(named: "iosWPMain1") 

img?.draw(in: self.view.bounds, blendMode: .normal, alpha: 1) 

let image: UIImage = UIGraphicsGetImageFromCurrentImageContext()! 

UIGraphicsEndImageContext() 


self.view.backgroundColor = UIColor(patternImage: image) 

Dank

Answer 1

Sie können ein Bild für alle Bildschirmgrößen erstellen, wenn Sie verwenden möchten, Es deckt den gesamten Bildschirm ab und schneidet oder verzerrt nicht. Also sollten Sie Ansatz B verwenden.

Answer 2

Wenn Sie ein externes Bild hinzufügen, dann empfehle ich Ihnen, ImageAssets.xcassets zu verwenden. Fügen Sie Ihre Bilder dort hinzu. Auf diese Weise, wenn Sie die UIImage mit UIImage(named: "image") aufrufen. Auf diese Weise lädt iOS bei der Veröffentlichung Ihrer App im AppStore nur die für das jeweilige Gerät erforderlichen Bilder herunter.

Sie können aber auch den Scale-Faktor eines Gerätes erhalten mit dem folgenden Code

let scale: CGFloat = UIScreen.main.scale 

Auf diese Weise können Sie Ihre Logik dies ändern:

let scaleFactor: CGFloat = UIScreen.main.scale 

if scaleFactor == 1.0 { 
    // use 1x image 
}else if scaleFactor == 2.0 { 
    // use 2x image 
}else if scaleFactor == 3.0 { 
    // use 3x image 
} 

Aber es ist besser, Verwenden Sie ImageAssets.xcassets als dies. Wenn Sie diesem Ansatz folgen, erhöht sich die Größe Ihrer App.

Answer 3

Der einfachste Ansatz ist ein einzelnes Bild auf der größten Größe zu erstellen, und dann stellen Sie Ihr UIImageView ‚s contentMode-.aspectFill