Apakah ada cara untuk menambahkan spasi antara UITableViewCell
?
Saya telah membuat tabel dan setiap sel hanya berisi gambar. Gambar ditugaskan ke sel seperti ini:
cell.imageView.image = [myImages objectAtIndex:indexPath.row];
tetapi ini membuat gambar diperbesar dan masuk ke dalam seluruh sel, dan tidak ada jarak antar gambar.
Atau katakanlah dengan cara ini, ketinggian gambar adalah misalnya 50, dan saya ingin menambahkan 20 spasi di antara gambar. Apakah ada cara untuk mencapai ini?
ios
objective-c
uitableview
saili
sumber
sumber
Jawaban:
Versi Swift
Diperbarui untuk Swift 3
Jawaban ini agak lebih umum daripada pertanyaan asli demi pemirsa di masa depan. Ini adalah contoh tambahan untuk contoh UITableView dasar untuk Swift .
Gambaran
Ide dasarnya adalah membuat bagian baru (bukan baris baru) untuk setiap item array. Bagian kemudian dapat spasi menggunakan tinggi bagian header.
Bagaimana cara melakukannya
Siapkan proyek Anda seperti yang dijelaskan dalam contoh UITableView untuk Swift . (Yaitu, tambahkan
UITableView
dan sambungkantableView
outlet ke View Controller).Di Interface Builder, ubah warna latar belakang tampilan utama menjadi biru muda dan
UITableView
warna latar belakang menjadi jelas.Ganti kode ViewController.swift dengan yang berikut ini.
LihatController.swift
Catatan yang
indexPath.section
digunakan daripadaindexPath.row
untuk mendapatkan nilai yang tepat untuk elemen array dan ketuk posisi.Bagaimana Anda mendapatkan bantalan / ruang ekstra di kanan dan kiri?
Saya mendapatkannya dengan cara yang sama Anda menambahkan spasi ke tampilan apa pun. Saya menggunakan batasan tata letak otomatis. Cukup gunakan alat pin di Interface Builder untuk menambahkan spasi untuk kendala terkemuka dan tertinggal.
sumber
numberOfSectionsInTableView
danreturn 1
untuk jumlah baris. Kemudian gunakanindexPath.section
untuk mendapatkan indeks sel saat ini. Coba sekali. Saya pikir Anda akan menemukan bahwa Anda tidak perlu melakukan banyak perubahan pada pengaturan Anda saat ini. Ini jelas lebih mudah daripada subclassing.layer
manipulasi cukup cepat. Apakah Anda mengatakan ini karena Anda melihat ada peningkatan kinerja, atau sebagai praktik umum yang baik? Bahkan jika Anda mengaturnya dalam XIB, mereka masih harus diatur ketika sel dibuat.Solusi mudah saya menggunakan Swift :
Hasil
sumber
super.layoutSubviews()
dulu untuk memastikan seluruh tampilan ditata dengan baik sebelum mengatur bingkainya.didSet
untukselected
variabel dan panggilanlayoutSubviews()
dalam!Cara saya mencapai menambahkan spasi antar sel adalah dengan membuat numberOfSections = "Jumlah array Anda" dan membuat setiap bagian hanya berisi satu baris. Lalu tentukan headerView dan tingginya.
sumber
Saya perlu melakukan konsep yang sama agar UITableCells memiliki "ruang" di antara mereka. Karena Anda tidak bisa menambahkan ruang antar sel, Anda dapat memalsukannya dengan memanipulasi ketinggian sel UITableView dan kemudian menambahkan UIView ke contentView sel Anda. Berikut ini adalah cuplikan layar dari prototipe yang saya lakukan di proyek pengujian lain ketika saya mensimulasikan ini:
Berikut ini beberapa kode (Catatan: ada banyak nilai yang dikodekan untuk tujuan demonstrasi)
Pertama, saya perlu mengatur
heightForRowAtIndexPath
untuk memungkinkan ketinggian yang berbeda pada UITableViewCell.Selanjutnya, saya ingin memanipulasi tampilan dan nuansa UITableViewCells jadi saya melakukannya dalam
willDisplayCell:(NewsUITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
metode.Perhatikan bahwa saya membuat whiteRoundedCornerView tinggi 70.0 saya dan itulah yang menyebabkan ruang simulasi karena tinggi sel sebenarnya 80.0 tetapi contentView saya 70.0 yang memberikan tampilan.
Mungkin ada cara lain untuk mencapai ini lebih baik, tetapi hanya bagaimana saya menemukan cara melakukannya. Saya harap ini bisa membantu orang lain.
sumber
Anda harus mengatur bingkai ke gambar Anda. Kode yang belum diuji adalah
sumber
layoutSubviews
jika AndaUITableViewCell
UITableViewCell
untuk mendapatkan hasil yang saya butuhkan :) ... SubklasUITableViewCell
sangat umum.UITableViewCell
. Saat Anda membuat kustomUITableViewCells
Anda harus subklasUITableViewCell
.Saya berada di kapal yang sama. Pada awalnya saya mencoba beralih ke bagian, tetapi dalam kasus saya itu berakhir lebih dari sakit kepala daripada yang saya pikir, jadi saya sudah mencari alternatif. Untuk tetap menggunakan baris (dan tidak mengacaukan bagaimana Anda mengakses data model Anda), inilah yang bekerja untuk saya hanya dengan menggunakan mask :
Yang harus Anda lakukan adalah membuat tinggi sel lebih besar dengan nilai yang sama seperti yang Anda inginkan
verticalPadding
, dan kemudian memodifikasi tata letak bagian dalam Anda sehingga setiap tampilan yang memiliki jarak ke tepi sel memiliki jarak yang sama meningkatverticalPadding/2
. Kelemahan minor: Anda mendapatkanverticalPadding/2
bantalan di bagian atas dan bawah tableView, tetapi Anda dapat dengan cepat memperbaiki ini dengan mengaturtableView.contentInset.bottom = -verticalPadding/2
dantableView.contentInset.top = -verticalPadding/2
. Semoga ini bisa membantu seseorang!sumber
Saya pikir solusi yang paling lurus jika Anda hanya mencari sedikit ruang dan mungkin paling murah adalah dengan hanya mengatur warna batas sel ke warna latar belakang tabel Anda kemudian mengatur lebar perbatasan untuk mendapatkan hasil yang diinginkan!
sumber
Jika Anda belum menggunakan header bagian (atau footer), Anda bisa menggunakannya untuk menambahkan spasi sewenang-wenang ke sel tabel. Alih-alih memiliki satu bagian dengan n baris, buat tabel dengan n bagian dengan masing-masing satu baris.
Terapkan
tableView:heightForHeaderInSection:
metode untuk mengontrol spasi.Anda mungkin juga ingin menerapkan
tableView:viewForHeaderInSection:
untuk mengontrol seperti apa spacing itu.sumber
Saya menyelesaikannya seperti ini di Swift 4.
Saya membuat ekstensi UITableViewCell dan memasukkan kode ini:
Saya harap ini membantu Anda.
sumber
Contoh dalam cepat 3 ..
lihat kode pengontrol di bawah ini seperti
func numberOfSections (dalam tableView: UITableView) -> Int {return arraytable.count}
Unduh sumber lengkap ke tautan Github:
https://github.com/enamul95/CustomSectionTable
sumber
Tiga pendekatan yang dapat saya pikirkan:
Buat sel tabel kustom yang menjabarkan seluruh sel dengan cara yang Anda inginkan
Alih-alih menambahkan gambar ke tampilan gambar, hapus subview tampilan gambar, buat tampilan kustom yang menambahkan UIImageView untuk gambar dan tampilan lain, mungkin UIView sederhana yang menyediakan jarak yang diinginkan, dan menambahkannya sebagai subview dari tampilan gambar.
Apakah itu masuk akal?
sumber
Ya, Anda dapat menambah atau mengurangi jarak (bantalan) antara dua sel dengan membuat satu tampilan dasar pada tampilan konten dalam sel. Mengatur warna yang jelas untuk latar belakang tampilan konten dan Anda dapat menyesuaikan ketinggian tampilan dasar untuk membuat ruang antar sel.
sumber
Berdasarkan jawaban Husam: Menggunakan lapisan sel alih-alih tampilan konten memungkinkan untuk menambahkan batas di seluruh sel dan aksesori jika perlu. Metode ini membutuhkan penyesuaian hati-hati dari batasan dasar sel serta inset-inset tersebut jika tidak, tampilan tidak akan sesuai.
sumber
Ubah jumlah baris di bagian menjadi 1 Anda telah mengubah jumlah bagian alih-alih jumlah baris
Di sini Anda menempatkan spasi di antara baris
sumber
Saya pikir ini adalah solusi terbersih:
sumber
layoutMargins
cara ini. Mungkin karena saya menggunakan autolayout.Artikel ini membantu, cukup banyak apa yang dikatakan jawaban lain tetapi merangkum dan ringkas
https://medium.com/@andersongusmao/left-and-right-margins-on-uitableviewcell-595f0ba5f5e6
Di dalamnya, ia hanya menerapkannya ke sisi kiri dan kanan tetapi
UIEdgeInsetsMake
init memungkinkan untuk menambahkan padding ke keempat titik.Perhatikan bahwa UIEdgeInsets juga dapat digunakan untuk mencapai hal yang sama.
Xcode 9.3 / Swift 4
sumber
Tidak perlu menggunakan banyak bagian berbeda. Jawaban lain menggunakan bingkai insets dan CGRect dan layer dan ... BLAH. Tidak baik; gunakan tata letak otomatis dan UITableViewCell kustom. Dalam UITableViewCell itu, alih-alih sub melihat konten Anda di dalam contentView, buat containerView baru (a UIView), tinjau tampilan kontainer di dalam contentView, lalu tinjau semua pandangan Anda di dalam tampilan wadah.
Untuk membuat spasi sekarang, cukup edit margin tata letak tampilan kontainer, seperti:
sumber
Coba lihat - - (UIEdgeInsets) layoutMargins; di sel
sumber
Situasi saya adalah saya menggunakan UIView kustom untuk viewForHeader di bagian juga heightForHeader di bagian mengembalikan ketinggian konstan katakanlah 40, masalah adalah ketika tidak ada data semua tampilan header disentuh satu sama lain. jadi saya ingin spasi antara bagian dalam ketiadaan data jadi saya memperbaikinya dengan hanya mengubah "gaya tampilan tabel" pesawat ke "Grup". Dan itu berhasil untuk saya.
sumber
Lihat solusi saya di GitHub dengan subkelas
UITableView
dan menggunakan fitur runtime Objective-C.Ini pada dasarnya menggunakan struktur data pribadi Apple
UITableViewRowData
yang saya cari tajuk runtime pribadiUITableView
:https://github.com/JaviSoto/iOS10-Runtime-Headers/blob/master/Frameworks/UIKit.framework/UITableView.h ,
dan inilah kelas privat yang diinginkan yang berisi semua yang Anda butuhkan untuk mengatur tata ruang sel Anda seperti yang Anda inginkan tanpa mengaturnya di kelas sel:
https://github.com/JaviSoto/iOS10-Runtime-Headers/blob/master/Frameworks/UIKit.framework/UITableViewRowData.h
sumber
Saya mengalami kesulitan membuat ini bekerja bersama warna latar belakang dan tampilan aksesori di sel. Akhirnya harus:
1) Tetapkan properti tampilan latar belakang sel dengan set UIView dengan warna latar belakang.
2) Posisikan ulang tampilan ini di layoutSubviews untuk menambahkan ide spasi
sumber
Menggunakan header sebagai spasi akan bekerja dengan baik, saya kira jika Anda tidak ingin menggunakan header. Kalau tidak, mungkin bukan ide terbaik. Yang saya pikirkan adalah membuat tampilan sel khusus.
Contoh:
Di sel khusus, buat tampilan latar belakang dengan kendala sehingga tidak memenuhi seluruh sel, berikan padding.
Kemudian, buat latar belakang tampilan tabel tidak terlihat dan hapus pemisah:
sumber
Jika Anda tidak ingin mengubah bagian dan nomor baris dari tampilan tabel Anda (seperti yang saya lakukan), inilah yang Anda lakukan:
1) Tambahkan ImageView ke bagian bawah tampilan sel tabel Anda.
2) Jadikan warna yang sama dengan warna latar belakang tampilan tabel.
Saya sudah melakukan ini di aplikasi saya dan berfungsi dengan baik. Bersulang! : D
sumber
SWift-5, Spasi Antar UITableViewCell
sumber
Anda cukup menggunakan kendala dalam kode seperti ini:
penting untuk menambahkan subview (wadah) dan memasukkan elemen lain di dalamnya.
sumber
tambahkan tampilan dalam ke sel lalu tambahkan tampilan Anda sendiri ke dalamnya.
sumber
Solusi Swift 5.0
Di dalam subkelas UITableViewCell
sumber
Gunakan UITableViewDelegate,
heightForRowAtIndexPath
dan kembalikan ketinggian baris.sumber