iOS: AutoLayout

Question

Başka View Bottom ile bir View Merkezi'ne hizalayın için nasıl mavi başlık ImageView'ın tutmak uyum alt kafa ImageView merkezini yapmak istiyorum.

Ben autoLayout kullanarak bunu nasıl? o | |

ekran 4.0inches ekran 4.7inches

Answer 1

Orada bir Bunu yapmanın birçok yolu var. Sadece yollardan birini göstereceğim.

Tamam, adım adım yapalım.

Aşama 1

İlk olarak, dikdörtgen görüntünün alt oval görüntünün merkezine hizalamak amacıyla, biz olarak isim hangi başka bir görünümünde dikdörtgen şeklinde bir görünümünü gömmek için gereken

Kapsayıcı Görünümü.

ff olacak Bu kapsayıcı bakış niteliklerini:

• şeffaf arka plan rengi
• genişliği
• yükseklik dikdörtgen görünümünde (Daha sonra
  iki katı yükseklik olacak ekran genişliğine eşittir nedenini bilecek).
Konteyner View kısıtlamaları için

: Öncü

• süper görünümü önde gelen
• üst uzay süper görünümüne eşittir süper görünümde yatay Merkezli 0
• olduğunu. öz ile
• set boy oranı.

İşiniz bittiğinde, kısıtlamalar buna benzer.

Adım Şimdi 2

dikdörtgen resim görünümü için, kısıtlamalar olacaktır: Öncü

• konteyner görünümün lider
• Üst boşluk eşittir konteyner görünümüne göre 0
• Trailing, kapsayıcı görünümün sonuna eşittir. Oval resim görüntüsü boy oranı ayarlayarak, oval görüntü görünümü
  • ile

  • ayarlayın boy oranı. Bu dikdörtgen görünümün boyutundaki değişiklik, oval görünümün boyut değişikliği ile orantılı olacaktır.

Bu gibi olacaktır:

Aşama 3

Bu kez, oval bakış contraints:

• sağlayan kendi kendine-boy oranına ayarlanması • kap görünümünde dikey da kendi kendine

  ile

• grubu boy oranı merkezli

kap görünümünde yatay merkezli olduğu dikdörtgen görünüşüdür genişler zaman boyutunda değişiklik Oval görünüm bozulmaya neden olmaz. 4

çok önemli bir görünümü vardır eklemek için



Adım:

Bu

sonuç olacaktır. Bu görüş, dikdörtgen görünüşün her zaman konteyner görünümünün yarısı kadar olmasını sağlayacaktır, böylece oval görünümün merkezi her zaman dikdörtgen görünüşün tabanı ile hizalanacaktır. Yani, bu görüşe kukla görünüm olarak ekleyeceğiz diyoruz.

ff olacak kukla görünüm niteliklerini:

• :
  • şeffaf arka plan rengi
  • genişlik ve yükseklik değeri yalnızca 1

  kukla görünümün contraints olmalıdır konteyner görünümünde dikey olarak ortalanmış

• konteyner görünümünde yatay olarak merkezlenmiş
• genişlik ve yükseklik sabitlenmiştir. Dikdörtgen görüntüsü
• atama dikey boşluk

Bu nasıl yapılması gerektiğini geçerli:

Pekala, etkiyi elde edecek Yukarıdaki adımları yaptıysam.

umarım bu yardımcı olur:

Bu

kısıtların bakış olacaktır. :)

Bunun işe yaradığını kanıtlayın!

simülatörde koştum ...: D

iPhone 4:

iPhone 5:

iPhone 6:

iPhone 6 Plus:

Answer 2

Önce elle arka plan resmi ve birinci İKEN HODLING SHIFT yerleştirmek doğru ölçüler SONRA dokunun kadar sürüklemek olur ekranın sağ alt köşesinde simge görünüyor kenar boşlukları seçeneğinin işaretini kaldıracağım ve 0, top 0, sağ 0 ve altta daha büyük bir sayı olmalıdır (sizin için otomatik olarak oluşturulmalıdır)

şimdi 2. UIImage'ı yerleştirin. ..Bunu ve istediğiniz gibi boyutlandırın ... şimdi aynı simge üzerinde | o | Buna dokunun ve bir yükseklik ve genişlik verin ... kısıtlamalar ekleyin ... şimdi sola devam etmek için 2'ye gidin (onun gibi iki yığılmış dikdörtgenler) .. buna dokunun ve "yatay olarak kapsayıcıya dokunun ... ŞİMDİ dokunun daha küçük resim ve ... dikey boşluklar dokunun ... büyütmek için kontrol ve sürükle tutun ve bırakın

son olarak .... bir benziyor aşırı sağ simgesi | o | ama bir üçgen vardır ... resimlerden biri seçili iken ... Eğer görünümü ile değil görüntüye göre autolayout Kısıtlamaları uygulamak zorunda alt "updtate çerçeveleri"

Answer 3

dokunun. fazla ayrıntı almak için https://www.raywenderlich.com/115444/auto-layout-tutorial-in-ios-9-part-2-constraints

Answer 4

Bu size yardımcı olabilir. Tamamen Otomatik Ödeme özelliğine göre, fazladan görünüm gerekmez.

• İlk önce, Kapak görüntüsünün yüksekliği ve genişliği ve konumu üzerinde bazı kısıtlamalar ayarlayın. (mavi renk)

Toplam genişlik 0,4, genişliğin eşit genişliği, sınırlarını görebilirsiniz.

• 

  Sonra Avatar (yeşil) resmin yüksekliğini ve genişliğini sabitlemek genişliğinde yatay olarak merkezi haline getirmektedir.

Ardından hem kapak görüntüsünü hem de avatar görüntüsünü seçin, bunları alt kenarı hizalayın.

Şimdi bu döner.

• Son adım
  , 'Resmi Kapak Align Bottom' seçin ve Avatar resmin yüksekliğinin yarısı kadar sürekli olun. Bitti!

Şu ana bulduk basit yoldur.

Answer 5

Adım 1: Görünümlerinizi aşağıda gösterildiği gibi oluşturun.

Adım 2: üç kenarlarına Arka plan görünüşüdür kısıtlamaları.

Adım 3: Kendi oranını ayarlayın. Bildiğiniz gibi, yüksekliğinizin olmadığını söylemiştiniz.

Adım 4: merkez görünümü seçin ve istediğiniz kadar genişlik & yükseklik kısıtlamaları ekleyin. Şimdi, her iki arka plan görünüşüdür & merkezi görünümü seçin:

Adım 5:

Aşama 6, aşağıda gösterildiği gibi Superview yatay merkez olarak merkezi görünümü ayarlayın. Hizalama kısıtlamasını "Dikey merkezler" olarak ayarlayın.

Adım 7: Şimdi, aşağıda gibi yanlış sabiteyle uyarı ile bir sınırlamayı görebilirsiniz. Bağlantılar denetçisinde "ikinci öğe" seçin ve için "alt"

Adım 9 değiştirin:: Bu sınırlamayı

Adım 8 Seç İşte bu kadar. Bir uyarı varsa, kısıtlamalarınızı güncelleyin. Herhangi bir ekran boyutunda farklı simülatör kontrol edebilirsiniz.

Bunu gerçekleştirmek için herhangi bir süper görünümleri veya yeni kardeş gerekmez. Herhangi bir görünümü merkez haline getirmenin ve başka bir görünümün alt/üst kısmı olarak tutmanın kolay yolu.