Kurangi jumlah ruang antar elemen ketika ruang dibatasi

Bayangkan kasus di mana Anda memiliki tiga tombol berdampingan. Anda ingin ketiga tombol memenuhi lebar yang tersedia, dan menjadi kotak sempurna dengan ukuran minimum yang ditetapkan, dengan jumlah ruang tertentu di antara keduanya. Untuk menyiapkannya, Anda akan memiliki batasan berikut:

A:
Rasio 1:1 terhadap A
Mengarah ke superview
Lebar dan tinggi >= 25

B:
Sama lebar dan tingginya dengan A
Menuju ke A: 50

C:
Lebar dan tinggi sama dengan A
Menuju ke B: 50
Mengikuti ke superview

Sekarang bayangkan lebar yang tersedia cukup kecil sehingga tidak ada cukup ruang horizontal untuk memastikan tombol-tombolnya berbentuk persegi sempurna dengan jarak 50 di antara masing-masing tombol. Daripada melanggar batasan rasio aspek dan lebar, Anda malah ingin mengurangi jumlah ruang antar tombol. Pertanyaan saya adalah, bagaimana Anda melakukan itu?

Saya pikir saya hanya akan mengubah hubungan kendala utama menjadi kurang dari atau sama, namun hal ini mengakibatkan Ambiguitas Kendala Ketimpangan dengan kedua kendala tersebut. Saya pikir mungkin saya perlu menentukan nilai minimum untuk lead, jadi saya menambahkan dua batasan lead lagi yang disetel lebih besar dari atau sama dengan 10. Itu tidak menyelesaikan ambiguitas. Saya kemudian menambahkan kumpulan batasan utama lainnya, kali ini sama dengan kumpulan nilai yang berada di antara kedua nilai tersebut, lalu saya mengurangi prioritasnya. Hal ini menyelesaikan ambiguitas, namun jarak antar tombol tidak pernah berkurang - selalu merupakan nilai yang saya tetapkan untuk batasan dengan batasan sama meskipun prioritasnya diturunkan.

Kendala apa yang perlu ditetapkan untuk mencapai hal ini?

  • Tiga tombol ditampilkan berdampingan dalam ruang horizontal yang sama
  • Ketiga tombol tersebut berbentuk kotak sempurna
  • Ukuran minimum untuk tombol (25x25)
  • Jumlah jarak tertentu di antara keduanya - 50
  • Jika ruang horizontal terlalu kecil untuk memastikan semua batasan dapat dipenuhi, maka jumlah ruang antar tombol harus dikurangi.

person Jordan H    schedule 25.05.2015    source sumber


Jawaban (3)


Anda menginginkan batasan jarak pada prioritas yang diperlukan yang menyatakan jarak minimum yang diperbolehkan. Misalnya >= 10 @1000.

Kemudian, Anda memerlukan batasan spasi pada prioritas lebih rendah yang menyatakan spasi yang diinginkan dengan persamaan, seperti == 50 @200.

Namun, Anda memiliki dua ruang antar tombol. Ambiguitas muncul karena tata letak otomatis tidak mengetahui mana yang harus dikurangi ketika tidak tersedia cukup ruang untuk membuat jarak yang diinginkan.

Anda dapat menetapkan prioritas yang berbeda-beda untuk menyelesaikan ambiguitas tersebut, namun kemudian satu jarak akan diciutkan sementara jarak lainnya tetap pada 50, hingga mencapai nilai minimum, yang kemudian jarak lainnya akan berkurang juga.

Saya kira Anda ingin kedua ruang selalu sama. Tidak ada cara langsung untuk melakukan itu hanya dengan batasan. Sebagai gantinya, Anda perlu menggunakan tampilan spacer tersembunyi. Jadi, Anda akan melakukan sesuatu seperti:

|-[buttonA][spacer1(>=10,==50@200)][buttonB(==buttonA)][spacer2(==spacer1)][buttonC(==buttonA)]-|
person Ken Thomases    schedule 25.05.2015

Coba buat mode konten untuk setiap tombol UIViewContentModeScaleAspectFit atau apa pun sebutan IB. Kemudian kendalikan jarak antara menggunakan lebar, bukan leading. Saya kira dengan mengetuk spasi di antara akan memanggil target tombol, jadi dalam hal ini gunakan tiga UIView biasa dengan cara ini dan kemudian tambahkan tombol sebagai subviewnya.

person Elliot Alderson    schedule 25.05.2015

Saya akhirnya memutuskan untuk menghindari pandangan spacer dan mencari solusi untuk mencapai hasil akhir. Daripada mengaturnya sehingga tata letak otomatis akan mengetahui penghitungan dan secara otomatis mengurangi jarak antar tombol, saya memutuskan untuk mengatur constant batasan tersebut secara terprogram berdasarkan lebar tampilan. Dengan demikian memastikan ruang antar tombol besar untuk lebar besar dan kecil untuk lebar kecil.

Untuk mencapai hal ini saya cukup menyiapkan koleksi outlet untuk batasan horizontal, lalu di updateViewConstraints saya mengulang batasan tersebut dan mengatur constant sama dengan self.view.frame.size.width / 12.

person Jordan H    schedule 25.05.2015