Anpassung an alle Geräte mit automatischem Layout

Question

Ich versuche, einen Bildschirm wie folgt zu entwerfen. Ich kann dieses Design für mehrere Geräte wie IPhone 5 und 5S machen. Dies bedeutet, dass meine Anwendung ordnungsgemäß auf IPhone 5 und 5S ausgeführt wird. Aber wenn ich versuche, es auf IPhone 6 oder 6S zu laufen, ist mein Entwurf gebrochen und gestört. Wie kann ich ein gemeinsames Design für alle Geräte erstellen?

Answer 1

Hier ist eine Funktion, die ein CGPoint aus der Mitte versetzt gibt, für einen bestimmten Index

func offset(forIndex index: Int) -> CGPoint { 
    let part = M_PI/11.0 
    let phi = part * Double(index) 
    let x = Double(UIScreen.mainScreen().bounds.width) * sin(phi) 
    let y = Double(UIScreen.mainScreen().bounds.height) * cos(phi) 
    print("----") 
    print("index \(index)") 
    print("x \(x)") 
    print("y \(y)") 

    return CGPoint(x: CGFloat(x), y: CGFloat(y)) 
} 

Mit dieser Funktion können Sie Ihre Taste entsprechend

Answer 2

So positionieren, ist hier ein Muster, das ich vorher benutzt habe:

Die grauen Balken sind nur UIViews, die vergrößert und verkleinert werden, um alle Schaltflächen gleichmäßig auf einem anderen Bildschirm zu halten. In Ihrem tatsächlichen Design wären diese transparent. Jede dieser Ansichten hat eine Beschränkung, um sie auf die gleiche Höhe zu bringen - dies hält den Abstand zwischen den Schaltflächen gleich, unabhängig von der vertikalen Größe des Bildschirms. Die anderen Einschränkungen bestehen darin, dass die mittlere Schaltfläche vertikal zentriert ist und dass jede der Schaltflächen einen zunehmenden nachgestellten Abstand zur enthaltenden Ansicht aufweist. Jede Schaltfläche ist auch eingeschränkt, um 0 Punkte Abstand zur Ansicht oben und unten zu haben.

Wenn Sie dies auf einem kleinen Bildschirm ausführen, werden die Abstandhalter schrumpfen, und auf einem größeren Bildschirm werden sie wachsen. Auf größeren Bildschirmen sollten Sie auch größere Schaltflächen erhalten, wenn sie so eingestellt sind, dass sie die tatsächliche Größe verwenden.

Dies bewahrt nicht die Form der Ellipse, aber Sie könnten die x-Koordinate der Schaltfläche proportional zur Breite des Bildschirms machen, um das zu tun, denke ich. Hängt davon ab, was Ihre Ziele für das Gesamtbild sind.