Rekan-rekan pengembang, saya mengalami masalah dengan AutoLayout di Interface Builder (Xcode 5 / iOS 7). Ini sangat mendasar dan penting, jadi saya pikir semua orang harus tahu cara kerjanya dengan benar. Jika ini adalah bug di Xcode, itu adalah bug yang kritis!
Jadi, setiap kali saya memiliki hierarki tampilan seperti ini, saya mengalami masalah:
>UIViewController
>> UIView
>>>UIScrollView
>>>>UILabel (or any other comparable UIKit Element)
UIScrollView memiliki kendala solid, misalnya, 50 px dari setiap sisi (tidak ada masalah). Kemudian saya menambahkan batasan Space Top ke label UIL (tidak ada masalah) (dan saya bahkan dapat menyematkan tinggi / lebar label, tidak mengubah apa pun, tetapi harus tidak perlu karena ukuran intrinsik Label)
Masalahnya dimulai ketika saya menambahkan batasan trailing ke UILabel:
Misalnya, Trailing Space ke: Superview Equals: 25
Sekarang dua peringatan terjadi - dan saya tidak mengerti mengapa:
A) Ambiguitas Ukuran Konten yang Dapat Digulir (Scroll View memiliki tinggi / lebar konten yang dapat digulir)
B) Tampilan salah tempat (Label Diharapkan: x = -67 Sebenarnya: x = 207
Saya melakukan contoh minimal ini dalam proyek baru yang dapat Anda unduh dan saya lampirkan tangkapan layar. Seperti yang dapat Anda lihat, Interface Builder mengharapkan Label untuk duduk di luar batas UIScrollView (persegi panjang berwarna oranye). Memperbarui bingkai Label dengan Resolve Issues Tool memindahkannya ke sana.
Harap dicatat: Jika Anda mengganti UIScrollView dengan UIView, perilaku seperti yang diharapkan (bingkai Label sudah benar dan sesuai dengan kendala). Jadi sepertinya ada masalah dengan UIScrollView atau saya kehilangan sesuatu yang penting.
Ketika saya menjalankan Aplikasi tanpa memperbarui bingkai Label seperti yang disarankan oleh IB, itu diposisikan dengan baik, tepat di tempat seharusnya dan UIScrollView dapat digulir. Jika saya DO memperbarui bingkai Label tidak terlihat dan UIScrollView tidak menggulir.
Bantu aku Obi-Wan Kenobi! Mengapa tata letak ambigu? Mengapa tampilan salah tempat?
Anda dapat mengunduh proyek sampel di sini dan mencoba jika Anda dapat mengetahui apa yang terjadi: https://github.com/Wirsing84/AutoLayoutProblem
UIScrollView
secara langsung. Alih-alih menggunakanUICollectionView
atauUITableView
sebanyak mungkin, kebanyakan setiap hal adalah mungkin dengan elemen ini dan juga memberikan kesederhanaan, keterbacaan dan penggunaan kembali !!!Jawaban:
Jadi saya hanya memilah seperti ini:
Di dalam
UIScrollView
add aUIView
(kita bisa menyebutnyacontentView
);Dalam hal ini
contentView
, atur margin atas, bawah, kiri dan kanan ke 0 (tentu saja dari yangscrollView
mana adalahsuperView
); Atur juga sejajarkan pusat secara horizontal dan vertikal ;Selesai .
Sekarang Anda dapat menambahkan semua pandangan Anda di dalamnya
contentView
, dan semuacontentSize
ituscrollView
akan secara otomatis diubah ukurannya sesuai dengancontentView
.Memperbarui:
Beberapa kasus khusus dicakup oleh video ini yang diposting oleh @Sergio di komentar di bawah.
sumber
Kesalahan ini memakan waktu beberapa saat untuk melacak, awalnya saya mencoba menyematkan ukuran ScrollView tetapi pesan kesalahan dengan jelas mengatakan "ukuran konten". Saya memastikan semua yang saya sematkan dari atas ScrollView juga disematkan ke bawah. Dengan begitu ScrollView dapat menghitung tinggi kontennya dengan menemukan ketinggian semua objek & batasan. Ini memecahkan ketinggian konten yang ambigu, lebarnya sangat mirip ... Awalnya saya memiliki banyak hal yang berpusat pada ScrollView, tetapi saya juga harus menyematkan objek ke sisi ScrollView. Saya tidak suka ini karena iPhone6 mungkin memiliki layar lebih lebar tetapi akan menghapus kesalahan 'ambiguous content width'.
sumber
Xcode 11+
Cara paling sederhana menggunakan
autolayout
:UIScrollView
dan sematkan0,0,0,0
ke superview (atau ukuran yang Anda inginkan)UIView
di ScrollView, sematkan0,0,0,0
ke semua 4 sisi dan pusatkanhorizontally
danvertically
.bottom
danalign center Y
prioritaskan menjadi 250. (untuk perubahan gulir horizontaltrailing
danalign center X
)UIScrollView
, pilih inspektur ukuran dan batalkan pilihanContent Layout Guides
.sumber
Ini adalah jawaban untuk pertanyaan yang saya jawab sendiri UIScrollView + Tampilan Tengah + Ukuran Konten yang Dapat Digulir + ukuran iPhone yang banyak .
Tapi itu sepenuhnya menutupi kasus Anda juga!
Jadi, inilah keadaan awal untuk kasus paling sederhana:
Has ambiguous scrollable content width
danHas ambiguous scrollable content height
.Yang harus kita lakukan adalah:
Penting: Anda harus menambahkan trailing dan / atau batasan bawah . Bukan "terkemuka dan teratas" - ini tidak berhasil!
Anda dapat memeriksanya di proyek contoh saya , yang menunjukkan cara memperbaiki masalah ini.
PS
Menurut logika - tindakan ini harus menyebabkan "kendala yang saling bertentangan". Tapi tidak!
Saya tidak tahu mengapa ia bekerja dan bagaimana Xcode mendeteksi kendala mana yang lebih diprioritaskan (karena saya tidak menetapkan prioritas untuk kejelasan kendala ini). Saya akan berterima kasih jika seseorang menjelaskan, mengapa itu bekerja di komentar di bawah ini.
sumber
Xcode 11+, Swift 5
Jika Anda bertanya-tanya mengapa semua jawaban tidak berfungsi lagi, pastikan Anda telah menyematkan tampilan konten (yang Anda masukkan ke dalam tampilan gulir) ke Panduan Tata Letak Konten dari tampilan gulir dan BUKAN ke Panduan Tata Letak Bingkai.
Tepi tampilan konten (depan, belakang, atas, bawah) tidak boleh disematkan seperti memimpin pada gambar - ke Panduan Tata Letak Bingkai
tapi seperti ini - ke Panduan Tata Letak Konten.
Dan kemudian sebagian besar jawaban akan bekerja untuk Anda.
Pendekatan paling sederhana sekarang adalah seperti ini:
Secara keseluruhan struktur Anda dalam implementasi paling sederhana akan terlihat seperti ini
sumber
Anda harus membuat
UIView
subviewUIScrollView
seperti yang dijelaskan di bawah ini:UIViewController
UIView
'Tampilan Utama'UIScrollView
UIView
'Tampilan Kontainer'Langkah kedua adalah membuat
UIScrollView
kendala. Saya melakukan ini dengan batasan atas, bawah, depan dan belakang untuk superView-nya.Selanjutnya saya menambahkan kendala untuk wadah
UIScrollView
dan di sinilah masalahnya dimulai. Saat Anda meletakkan batasan yang sama (atas, bawah, depan dan belakang) Storyboard memberikan pesan peringatan:"Memiliki lebar konten yang dapat digulir ambigu" dan "Memiliki tinggi konten yang dapat digulir ambigu"
Lanjutkan dengan kendala yang sama di atas, dan tambahkan saja kendala
Equal Height
danEqual Width
ke Tampilan Kontainer Anda sehubungan dengan Tampilan Utama dan bukan untuk AndaUIScrollView
. Dengan kata lain batasan Container View terkait denganUIScrollView
superview.Setelah itu Anda tidak akan memiliki peringatan di Storyboard Anda dan Anda dapat terus menambahkan kendala untuk subview Anda.
sumber
Saya memiliki masalah yang sama. Hapus centang pada kotak ini. Karena Anda mengatur ukuran konten dalam kode.
sumber
Saya akhirnya menemukan ini, saya harap ini lebih mudah dimengerti.
Anda sering dapat melewati peringatan itu dengan menambahkan UIView baru ke scrollview sebagai "tampilan konten", seperti yang mereka sebutkan dan menjadikannya ukuran yang sama dengan tampilan gulir Anda dan, pada tampilan konten ini, atur 6 parameter ini.
Seperti yang Anda lihat, Anda membutuhkan 6 parameter total! Yang .. dalam keadaan normal, Anda menduplikasi 2 kendala tetapi ini adalah cara untuk menghindari kesalahan storyboard ini.
sumber
Saya tahu saya mungkin terlambat, tetapi solusi berikutnya memecahkan masalah semacam ini tanpa kode tambahan , hanya menggunakan storyboard:
Untuk tampilan konten Anda, Anda perlu menetapkan batasan untuk memimpin / mengikuti / spasi atas / bawah ke scrollview dan ini tidak akan mengubah bingkai tampilan konten , seperti ini:
Tentu saja Anda perlu membuat batasan tambahan untuk tampilan konten sehingga tampilan gulir bisa mengetahui ukuran konten. Misalnya mengatur tinggi dan pusat tetap x.
Semoga ini membantu.
sumber
Bagi saya menambahkan
contentView
tidak benar-benar berfungsi seperti yang disarankan. Selain itu, ini menciptakan overhead karena tampilan yang ditambahkan (walaupun saya tidak menganggap ini masalah besar). Apa yang paling berhasil bagi saya adalah mematikan ambiguitas-memeriksa sayascrollView
. Semuanya meletakkan dengan baik jadi saya pikir tidak apa-apa dalam kasus-kasus sederhana seperti milik saya. Namun perlu diingat, bahwa jika kendala lain untukscrollView
istirahat Anda , Interface-Builder tidak akan memperingatkan Anda lagi tentang hal itu.sumber
Lihat ini sangat cepat dan langsung ke tutorial tentang cara membuat tampilan gulir bekerja dan sepenuhnya dapat digulir dengan tata letak otomatis. Sekarang, satu-satunya hal yang masih membuat saya bingung adalah mengapa ukuran konten tampilan gulir selalu lebih besar dari yang diperlukan ..
http://samwize.com/2014/03/14/how-to-use-uiscrollview-with-autolayout/
sumber
Lihat di bawah: tampilan konten dalam scrollview vertikal dan horizontal terpusat. Anda mendapat kesalahan ambiguitas, selalu pastikan dua ditambahkan ke scrollview dari tampilan konten Anda adalah 1) .tombol spasi ke penampung.2) mengekor spasi ke batasan yang disorot dalam tangkapan layar,
kendala ini berarti dalam gulir adalah seberapa banyak Anda dapat menggulir setelah konten Anda melihat tinggi atau lebar.
mungkin membantu Anda.
sumber
Saya memecahkan masalah semacam ini untuk pandangan saya dengan menggunakan "Selesaikan masalah tata letak otomatis"> "Tambahkan kendala yang hilang" untuk Tampilan Terpilih
Dua kendala berikut memecahkan masalah saya:
di mana: trailing, bottom adalah trailing, bottom dari UIScrollView
sumber
Menggunakan contentView (
UView
) sebagai wadah dalamUIScrollView
, tongkat ke tepi (top
,bottom
,trailing
,leading
) dari SuperView (UIScrollView
) dancontentView
harus memilikiequalwidth
danequalheight
untuk SuperView. Itu adalah kendala. Dan panggilan metode:Memecahkan masalah bagi saya.
sumber
Pendekatan Swift 4+:
1) Setel UIScrollView margin atas, bawah, kiri dan kanan ke 0
2) Di dalam UIScrollView tambahkan UIView dan atur margin atas, bawah, depan, akhir menjadi 0 (sama dengan margin UIScrollView).
3) Bagian terpenting adalah mengatur lebar dan tinggi, di mana batasan ketinggian harus memiliki prioritas rendah .
sumber
@Matteo Gobbi jawaban sempurna, tetapi dalam kasus saya, scrollview tidak dapat menggulir, saya menghapus " align center Y " dan tambahkan " height> = 1 ", scrollview akan menjadi scrollable
sumber
Orang-orang yang berjuang dengan uiscrollview tidak menggulir cukup menetapkan batasan bawah tampilan konten Anda dengan tata letak bawah tampilan terakhir Anda (yang ada di dalam tampilan konten Anda). Jangan lupa untuk menghapus batasan pusat Y.
Istirahat semua kendala sama seperti yang didefinisikan di atas. Scrollview hanya peduli tentang mendapatkan ketinggian maksimum dari tampilan kontennya, dan kami menetapkannya sebagai kendala bawah tampilan terakhir, yang berarti scrollview secara otomatis akan mengubah offset kontennya.
Dalam kasus saya, tampilan terakhir adalah UILable tanpa garis properti = 0 (yang secara otomatis menyesuaikan ketinggiannya tergantung pada isinya) sehingga secara dinamis meningkatkan ketinggian uilable dan akhirnya area yang dapat digulir bertambah karena tata letak bawah uilable disejajarkan dengan bagian bawah tampilan konten kami, yang memaksa scrollview untuk meningkatkan konten diimbangi.
sumber
Saya membuat video di youTube
Scroll StackViews hanya menggunakan Storyboard di Xcode
Saya pikir 2 jenis skenario bisa muncul di sini.
Tampilan di dalam scrollView -
UIView
)UIStackView
)Untuk tampilan yang dapat digulirkan secara vertikal dalam kedua kasus, Anda perlu menambahkan batasan ini:
4 kendala dari atas, kiri, bawah dan kanan.
Lebar sama dengan scrollview (untuk berhenti menggulir secara horizontal)
Anda tidak memerlukan kendala lain untuk tampilan yang memiliki tinggi konten intrinsiknya sendiri.
Untuk tampilan yang tidak memiliki tinggi konten intrinsik, Anda perlu menambahkan batasan ketinggian. Tampilan akan bergulir hanya jika batasan ketinggian lebih dari ketinggian scrollView.
sumber
Keluaran:
sumber
Dalam kasus saya, saya menerima masalah ukuran konten dan Ambiguitas Ukuran konten yang salah di iPad tetapi berfungsi untuk iPhone. Saya telah melakukan perubahan berikut di storyboard untuk menyelesaikan masalah ini.
sumber
Pengguliran Vertikal
sumber
Apa yang saya lakukan adalah membuat tampilan konten terpisah seperti yang ditunjukkan di sini.
Tampilan konten adalah bentuk bebas dan dapat memiliki semua subview ditambahkan dengan kendala mereka sendiri sehubungan dengan contentView.
UIScrollView ditambahkan ke pengontrol tampilan utama.
Secara pemrograman saya menambahkan contentView yang terhubung melalui IBOutlet ke kelas dan mengatur contentView dari UIScrollView.
sumber
Saya mendapatkan kesalahan yang sama .. saya telah melakukan yang berikut
Sekarang tambahkan leading / trailing / top / bottom untuk scrollView (2) kemudian UIView (3).
Pilih Lihat (1) dan Lihat (3) mengatur tinggi dan berat yang sama .. itu memecahkan masalah saya.
Saya telah melakukan video yang akan membantu:
https://www.youtube.com/watch?v=s-CPN3xZS1A
sumber
[diuji dalam XCode 7.2 dan untuk iOS 9.2]
Apa yang menekan kesalahan dan peringatan Storyboard bagi saya adalah menetapkan ukuran intrinsik dari tampilan gulir dan tampilan konten (dalam kasus saya, sebuah stackview) ke Placeholder . Pengaturan ini ditemukan di inspektur Ukuran di Storyboard. Dan katanya - Mengatur waktu desain ukuran konten intrinsik hanya memengaruhi tampilan saat mengedit di Interface Builder. Tampilan tidak akan memiliki ukuran konten intrinsik ini saat runtime.
Jadi, saya kira kita tidak salah dengan mengatur ini.
Catatan: Di storyboard, saya telah menyematkan semua tepi scrollview ke superview dan semua tepi stackview ke scrollview. Dalam kode saya, saya telah menetapkan translatesAutoresizingMaskIntoConstraints sebagai false untuk scrollview dan stackview. Dan saya belum menyebutkan ukuran konten. Ketika stackview tumbuh secara dinamis, kendala yang diatur dalam storyboard memastikan bahwa stack dapat digulir.
Peringatan storyboard membuatku gila dan aku tidak ingin memusatkan hal-hal secara horizontal atau vertikal hanya untuk menekan peringatan.
sumber
Jika ada yang mendapatkan perilaku di mana Anda melihat bilah gulir di gulungan kanan tetapi kontennya tidak bergerak, fakta ini mungkin layak dipertimbangkan:
Itu dari dokumentasi Apple . Misalnya, jika Anda secara tidak sengaja menyematkan Label / Tombol / Img / Tampilan atas ke tampilan di luar area gulir (Mungkin tajuk atau sesuatu di atas scrollView?) Alih-alih contentView, Anda akan membekukan seluruh konten Anda di tempatnya.
sumber
Seperti disebutkan dalam jawaban sebelumnya, Anda harus menambahkan tampilan khusus di dalam tampilan gulir:
Tambahkan semua subview Anda ke tampilan konten. Pada titik tertentu Anda akan melihat tampilan konten gulir memiliki peringatan ukuran konten yang ambigu, Anda harus memilih tampilan konten dan klik tombol "Selesaikan masalah tata letak otomatis" (di sudut kanan bawah tata letak IB), dan pilih "Tambah yang hilang opsi kendala ".
Mulai sekarang ketika Anda menjalankan proyek, tampilan gulir akan secara otomatis memperbarui ukuran kontennya, tidak diperlukan kode tambahan.
sumber
Dalam kasus saya - tampilan gulir yang bergulir secara horizontal - Saya juga perlu menambahkan batasan lebar dan tinggi untuk setiap anak dari tampilan gulir, meskipun catatan teknis Apple tidak memberi tahu Anda hal ini.
sumber
Setel ukuran ViewController (yang memegang UIScrollView) ke Freeform di inspektur ukuran di Interface Builder dan semua akan berfungsi.
Pengaturan bentuk bebas di inspektur Ukuran di Interface Builder untuk mengandung UIViewcontroller
sumber
Jika Anda masih memiliki masalah dengan UIScrollView, matikan saja Panduan Tata Letak Konten (Pilih ScrollView Anda di xcode Interface Builder -> pilih Size inspector di panel kanan -> batalkan pilihan 'Content Layout Guides') Atau coba langkah-langkah ini: xcode 11 layout tampilan gulir - ini dapat berguna untuk gaya tata letak baru. Bekerja dengan baik di macOS 10.15.2, Xcode 11.3.1, untuk 05.02.2020
lihat tangkapan layar
sumber
Menggunakan Autolayout
Tambahkan tampilan gulir Anda di dalam tampilan yang ditentukan dengan baik dan kemudian tambahkan tampilan tumpukan di dalam tampilan gulir
Tambahkan batasan atas, kiri, kanan, bawah, tengah X dan tengah Y dari tampilan gulir dan tampilan tumpukan ke tampilan super yang relevan
Pastikan kendala ditautkan dari tampilan tumpukan ke superview yang sah (scrollview) karena pengaturan default saat ini adalah menambahkan kendala Align Top dan bukan Space Top.
sumber